Question

我有一个按钮：

<span id="signinButton">
  <span
    class="g-signin"
    data-callback="onSignInCallback"
    data-clientid="CLIENT_ID"
    data-cookiepolicy="single_host_origin"
    data-requestvisibleactions="http://schemas.google.com/AddActivity"
    data-scope="https://www.googleapis.com/auth/plus.login">
  </span>
</span>

当按下时，这会运行一个函数...此时会关闭，发出一个AJAX帖子，然后在控制台中打印一些文本（只是为了测试，这个部分有效）：

<script type="text/javascript">
var helper = (function() {
    return {
        onSignInCallback: function(data) {

            var dataString = 'access_token=' + data['access_token'];

            $.ajax({
                type: "POST",
                url: "getdetails",
                data: dataString,
                dataType: 'html',
                timeout: 0,
                statusCode: {
                    200: function(data){
                        console.log(data);
                    },
                    error: function(data){
                        console.log("There was an error");
                    }
                }
            });
        }
    };
})();   

function onSignInCallback(data) {
  helper.onSignInCallback(data);
}
</script>

然而，问题在于每次刷新页面而不点击按钮时，我的函数都会运行，数据通过AJAX发布，文本会打印到控制台中。

知道为什么会这样吗？我希望它（显然）所以这只有在他们点击按钮时才会发生。

我正在使用Google Plus API，代码经过修改：

https://github.com/googleplus/gplus-quickstart-javascript/blob/master/index.html#L44

Answer 1

根据该指令的文档：

data-callback - 全局命名空间中的一个函数，在呈现登录按钮时调用，并在登录流完成后调用。呈现按钮时，将发生回调以检查用户是否先前已授权应用程序并应自动登录。

按照设计，回放将在渲染按钮（即页面加载）时以及单击按钮时运行。

解决方法是在第一次运行时设置全局布尔值。

<script type="text/javascript">
var first_run = true;
var helper = (function() {
    return {
        onSignInCallback: function(data) {

            var dataString = 'access_token=' + data['access_token'];

            $.ajax({
                type: "POST",
                url: "getdetails",
                data: dataString,
                dataType: 'html',
                timeout: 0,
                statusCode: {
                    200: function(data){
                        console.log(data);
                    },
                    error: function(data){
                        console.log("There was an error");
                    }
                }
            });
        }
    };
})();   

function onSignInCallback(data) {
  if(!first_run) {
      helper.onSignInCallback(data);
  }
  first_run = false;
}
</script>

Answer 2

在the Google Plus documentation中：

如果用户之前同意通过此按钮允许您的应用程序访问，或者代表同一应用程序的其他按钮，则会自动登录。一旦登录按钮呈现并传递回调函数，就会自动调用回调函数具有访问令牌的新授权对象。

Answer 3

我也是这样做的。在我的全局onSignInCallBack（authResult）函数中，我附加了一个调用，该调用在if语句中检查ajax请求，该语句检查authResult [＆＃39; access_token＆＃39;]中的值。我正在使用AngularJs并将我的Ajax调用移动到我的控制器中。由于您没有使用AngularJS，您可以使用AJAX调用替换gplusController（）。onSignInCallback（..）行。

function onSignInCallback(authResult){
    if (authResult['access_token']) {
    var afToken = document.getElementById('afToken').getAttribute('data-afToken');
    gplusController().onSignInCallback(authResult, afToken);
   }
 }

按钮回调函数运行每个页面加载

3 个答案: