谷歌登录无法识别登录 角度中的回调功能

Google Sign In not recognizing sign in Callback function in Angular

本文关键字：登录 功能 回调 识别 谷歌      更新时间：2023-09-26

我正在构建一个小型的Angular应用程序，并且正在使用Google登录。我只是使用谷歌提供的教程中的示例代码。

              <span class="g-signin"
                data-scope="https://www.googleapis.com/auth/plus.login"
                data-clientid="blah"
                data-redirecturi="postmessage"
                data-accesstype="offline"
                data-cookiepolicy="single_host_origin"
                data-callback="signInCallback">
              </span>

这是使按钮登录的元素，我运行此代码以启动 

(function () {
  var po = document.createElement('script');
  po.type = 'text/javascript';
  po.async = true;
  po.src = 'https://plus.google.com/js/client:plusone.js?onload=start';
  var s = document.getElementsByTagName('script')[0];
  s.parentNode.insertBefore(po, s);
})();

，所有这些都是从谷歌复制的。然后我的控制器中有这个方法，

.controller('splashController', ['$scope', '$window', function($scope, $window){
        $scope.googleLogin() = function(){
                $scope.googleAuthResult = $window.googleAuthResult;
                console.log($scope.googleAuthResult);
        };

        window.signInCallback = function(authResult){
                console.log("happy");
        };
}])

但问题是，在 google+ 脚本运行后，它会在 Angular World 之外寻找这个 signInCallback 函数，我想将其保留在 Angular 中，因为我想通过 angular 发送令牌，而不是像 jQuery 那样。有什么建议吗？

尝试使用 gapi.auth.authorize 方法。 它调用与按钮相同的功能，但通过 Javascript 显式调用，它还允许您在控制器/服务/任何范围内传入回调方法。 这是我的登录功能：

var authParams =                    // Define a params object for gapi.auth.authorize
{
    client_id       : '****-****.apps.googleusercontent.com',
    scope           : 'https://www.googleapis.com/auth/userinfo.email',
    immediate       : false,
    cookiepolicy    : 'single_host_origin'
};
/**
 * Authenticates the user and authorizes the local browser's JS GAPI Client, returns an object
 * with the GAPI Client's login token or false if it's not yet available, and the deferred 
 * object whose promise will be resolved when the JS GAPI Client authenticates.
 *
 * @param hard      If {{ hard }} is truthy, force the GAPI Client to reauthenticate the user
 *                  and reauthorize the client.  Ensures the client is logged in and the session
 *                  stays active even if it is disrupted external to the application.
 */
this.login = function(hard)
{
    // @TODO:   Consolidate into (!hard && (token || pending) if token can be guaranteed falsey
    //          while pending otherwise ret.logged is unreliable.  
    //          Where's a logical XOR when you need one?
    //////////////////////////
    // If a login is pending and we're not forcing a hard reauth, return the deferred object
    // promising the authorization response and 'logged':false
    if (pending && !hard) return { logged : false, deferred : deferred };
    // If the token is already set and we're not forcing a hard reauth, resolve the deferred
    // promise immediately and return it along with 'logged':token
    if (token && !hard)
    {
        deferred.resolve(token); // Resolve the promise immediately, no login response to wait for
        return { logged : token, deferred : deferred };
    }
    /////////////////////////
    deferred = $q.defer();  // We need to wait for gapi.auth.authorize to respond, reinit the promise
    pending = true;         // Don't restart the process on future calls if an authorization is pending
    gapi.auth.authorize(authParams,this.handleAuthResult);  // Authorize the client, then run the callback
    // Not logged in, return the deferred object
    return { logged : false, deferred : deferred};
}

所有这些都包含在服务中。

相关文章：