Question

所以我一直在尝试将谷歌单点登录到我的角度应用程序中;但是，有时当我重新加载页面时，按钮会消失。我的角度应用是使用角度路由。如果我把我的按钮放在这个之外它会按预期工作。它通过部分加载时遇到问题。知道如何解决这个问题吗？

    <div class="g-signin2" data-onsuccess="onSignIn"></div>
    <div ng-view></div>

Answer 1

正如@agektmr所说，问题与angular和platform.js互动方式有关。

要使用自动渲染按钮，您需要在加载DOM时触发库。

我所做的是在onComplete方法中调用以下代码（我正在使用AngularMaterial对话框，但您应该能够很容易地找到类似的方法）：

$timeout(function() {
  $window.gapi.signin2.render('g-signin2');
});

唯一的区别在于您的HTML应该更改div而不是添加g-signin2课程，您应该添加g-signin2 ID：

<div id='g-signin2' data-onsuccess='yourMethod'></div>

如果您愿意了解有关Google实施的更多信息，可以查看here。

Answer 2

我建议使用命令式方法来实现此按钮。

<div id="signin">
  <button>sign-in</button>
</div>
<script>
document.querySelector('#signin').addEventListener('click', function() {
  var auth2 = gapi.auth2.getAuthInstance();
  auth2.signIn();
});
</script>

在这里找到更具体的例子 https://github.com/GoogleChrome/google-sign-in

您指出的代码由于时间原因而无法正常工作。 platform.js库试图处理它但是因为它在角度呈现DOM之前失败了。

无法在AngularJS应用程序中实现google sso

2 个答案: