javascript - 谷歌登录点击两次？

Question

我正在通过 JS 使用 Google 登录，我的代码似乎获取了两次数据。我不确定为什么会这样。

当我点击“使用 Google 登录”按钮时，它会为用户输出 (console.log(result)) 数据。然后出现提示，要求我选择一个我的帐户(我登录了多个谷歌帐户)。当我点击我想要的帐户时，代码会再次吐出该用户数据。

为什么会这样？这是一个问题，因为在我吐出数据的地方，我想进行 ajax 调用以验证用户然后重定向他们。所以从本质上讲，它会尝试执行两次 - 这并不酷，如果我不想使用 google 在第一次返回时传回的凭据登录怎么办？

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

function googleLogin() {
    var additionalParams = {
        'callback': googleCallback
    };

    gapi.auth.signIn(additionalParams);
}

function googleCallback(authResult) {
    if (authResult['status']['signed_in']) {
        gapi.client.load('oauth2', 'v2', function() {
            gapi.client.oauth2.userinfo.get().execute(function(resp) {
                console.log(resp);
            })
        });
    } else {
        console.log('Sign-in state: ' + authResult['error']);
    }
}

更新:如果我退出我的所有 Google 帐户(一个且只有一个除外)，对 google 的调用仍然重复。这次它登录了，我看到 console.log() 输出了两次数据。访问 token 是相同的。

更新 2:console.log(resp) 输出两次

更新 3: 更多说明:

Answer 1

您遇到了对“console.log(resp);”的两次调用在您的“googleCallback”函数中，因为:

The function that you define for your sign-in callback will be called every time that the user's signed in status changes

此引用摘自 "Monitoring the user's session state"网页。

如文中所见，授权结果对象具有三种不同的状态“方法”值:

• 无
• 提示
• 自动

因此，当出现登录提示(“PROMPT”)和出现“欢迎回来”横幅(“AUTO”)时，将触发您的回调代码。

要阻止回调代码处理每个触发事件，您可以按如下方式更改代码:

function signinCallback(authResult) {
    if (authResult['status']['signed_in']) {
        // Update the app to reflect a signed in user
        // Hide the sign-in button now that the user is authorized, for example:
        // document.getElementById('signinButton').setAttribute('style', 'display: none');

        if (authResult['status']['method'] == 'PROMPT') {
            console.log(authResult['status']['method']);

            gapi.client.load('oauth2', 'v2', function () {
                gapi.client.oauth2.userinfo.get().execute(function (resp) {
                    console.log(resp);
                })
            });
        }
    } else {
        // Update the app to reflect a signed out user
        // Possible error values:
        //   "user_signed_out" - User is signed-out
        //   "access_denied" - User denied access to your app
        //   "immediate_failed" - Could not automatically log-in the user
        console.log('Sign-in state: ' + authResult['error']);
    }
}

如果用户已登录且触发回调的事件类型为“PROMPT”，此代码将仅调用“gapi.client.oauth2.userinfo.get()”函数。