【问题标题】:Google authentication javascript谷歌身份验证javascript
【发布时间】:2012-09-20 14:28:06
【问题描述】:

我正在尝试在我们的网站上实现 google 登录。我已阅读文档并在 api 控制台上设置了一个应用程序。

我更喜欢注册对话框显示在弹出窗口中,并且在用户登录并接受我将获得 javascript 回调的权限后。根据文档,这个 api 也支持。所以我在文档的帮助下构建了以下内容;-)

这第一部分是异步加载 google 客户端脚本并使用正确的 clientid 和 apikey 初始化脚本。

$gp = new googlePlus('@Trustpilot.Web.Social.Google.ClientID', '@Trustpilot.Web.Social.Google.ApiKey');
(function () {
    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
    po.src = 'https://apis.google.com/js/client.js?onload=googlePlusClientLoad';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();

下一部分是使用 google 客户端 api 的部分。加载 client.js 时调用 handleClientLoad()。该方法检查使用是否经过身份验证。如果用户是,我的想法是我想登录用户。 如果用户尚未通过身份验证,则会有一个按钮,并且当单击 handleAuthClick() 时,它的基本功能与 handleClientLoad() 相同,但会出现一个弹出窗口,用户最常登录(使用谷歌帐户)并接受权限。登录后调用handleAuthResult() 来登录用户。

function googlePlus(clientId, apiKey) {
    this.clientId = clientId;
    this.apiKey = apiKey;
    this.scopes = 'https://www.googleapis.com/auth/plus.me https://www.googleapis.com/auth/userinfo.email';

    /// This method is called when the javascript is loaded async
    this.handleClientLoad = function() {
        gapi.client.setApiKey(this.apiKey);
        window.setTimeout(this.authorize(true), 1);
    };

this.handleAuthResult = function (authResult) {
    console.log(authResult);
    if (authResult && !authResult.error) {
        var token = gapi.auth.getToken();
        console.log(token);
    }
    else if (authResult && authResult.error) {
        alert(authResult.error);
    }
};

this.handleAuthClick = function(event) {
    this.authorize(false);
    return false;
};

this.makeApiCall = function() {
    gapi.client.load('plus', 'v1', function () {
        var request = gapi.client.plus.people.get({
            'userId': 'me'
        });
        request.execute(function (resp) {
            console.log(resp);
        });
    });
};

    this.authorize = function (immediate) {
        gapi.auth.authorize({ client_id: this.clientId, scope: this.scopes, immediate: immediate }, this.handleAuthResult());
        //gapi.auth.authorize({ client_id: this.clientId, scope: this.scopes, immediate: immediate }, this.handleAuthResult());
    };
}
var googlePlusClientLoad = function() {
    $gp.handleClientLoad();
};

那么问题来了:

  1. 调用 handleClientLoad 时,即使用户从未经过身份验证 如果用户已经进行了身份验证。
  2. 如果用户使用 handleAuthClick() 弹出窗口显示和登录,权限和 回调到 handleAuthResult() 工作。但是参数 authResult 是 总是什么都没有(应该是文档中的东西)。
  3. 如果我尝试多次而不重新加载页面,我有时可以 让 makeApiCall() 和 gapi.auth.getToken() 工作并获取我需要的信息。

【问题讨论】:

  • 我在使用 javascript API 时遇到了同样的问题。如果您已经解决了,请分享您的答案。

标签: javascript google-api google-api-client google-authentication


【解决方案1】:

您的代码中有两个问题:

  • API 密钥不是必需的,您可以将其删除。您通过 OAuth2 获取用户令牌就足够了。
  • authorize()中,handleAuthResult方法调用不正确,去掉函数名末尾的括号。您不想执行该函数,只需传递其引用即可。 authorize 方法必须如下所示:

    gapi.auth.authorize({ client_id: this.clientId, scope: this.scopes, immediate: immediate }, this.handleAuthResult);

注意括号中的区别。

【讨论】:

    猜你喜欢
    • 2020-08-15
    • 2018-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-04-20
    • 2014-05-08
    • 2012-11-28
    相关资源
    最近更新 更多