实施Google身份验证后，Google登录按钮会在注销后消失

Question

我正在尝试在AngularJS 2中实施Google身份验证

我关注this链接

我已经构建了一个包含4个组件的应用程序

1. 标题组件
2. 登录组件
3. 详细信息组件
4. App Component（root）

登录组件具有登录页面代码。因此我在login.component.html中包含以下内容 - ＆gt;

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

Logout按钮包含在Header组件中。代码如下：

header.component.html

 <div>
    <span class="log-out" (click)="signOut()"> Logout </span>
  </div>

header.component.ts

constructor (private router:Router, private ngZone: NgZone){

gapi.load('auth2', function () {
  gapi.auth2.init()
});

window['signOut'] = (user) => ngZone.run(() => this.signOut());
}

signOut() {
  var auth2 = gapi.auth2.getAuthInstance();
  auth2.signOut().then(function () {
  console.log('User signed out.');
   });
    this.router.navigate(['']);
 }

注销成功后，它将导航回登录页面，地址为''，已在app-routing.module中设置

当我退出时，我会被重定向到登录页面，但Google登录按钮会消失。刷新后再次出现

如果我遗失了什么，请指导我！

Answer 1

我解决了我的问题：

所以，我了解到包含 this.router.navigate [''] 不会触发整页的重新加载。它只是导航我到HTML中所需的div。

我在index.html文件中加载了platform.js.要加载它，我们需要调用 window.open（）函数。

因此我将其替换为 window.open（“/”，“_ self”） 。这里“/”是根页面（在我的例子中是登录页面），“_ self”表示它将在同一个选项卡上重定向到你。