javascript - 在* ngIf中使用oidc-client在Angular中实现isLoggedIn()函数

目标：我正在尝试使用IdentityServer4和oidc客户端在Angular应用中隐藏和显示Loggin和Logout按钮。

问题：来自我的isLoggedIn函数的响应在返回true和* ngIf从不显示“注销”按钮或隐藏“登录”按钮之前返回未定义。看到代码：

app.componenet.html：

<span>
      <button *ngIf="!isLoggedIn()" mat-button (click)="login()">Login</button>
      <button *ngIf="isLoggedIn()" mat-button (click)="logout()">Logout</button>
</span>

app.componenet.ts：

    isLoggedIn(){
        console.log('isLoggedIn -this._authService.isLoggedIn():',
          this._authService.isLoggedIn());
        this._authService.isLoggedIn();
      }

验证服务

isLoggedIn(): boolean{
    return this._user && this._user.access_token && !this._user.expired;
  }

在auth.service.ts中，我像这样设置用户对象：

 this._userManager = new UserManager(config);
    this._userManager.getUser().then(user =>{
      if(user && !user.expired){
        this._user = user;
      }

console.log输出：


我尝试过的


我尝试玩我的oidc-client版本，切换
在leatest和1.4.1之间，并确保它们匹配
package.json和我的oidc-login-redirect.html文件。
如果使用异步管道，将auth.service.ts isLoggedIn函数转换为Promise isLoggedIn（）并直接从* nf调用它


验证服务
    诺言{
        返回新的Promise（resolve => {
          解析（this._user && this._user.access_token &&！this._user.expired）;
        }）;
      }

app.component.html

  <button *ngIf="!this._authService.isLoggedIn() | async" mat-button (click)="login()">Login</button>
  <button *ngIf="this._authService.isLoggedIn() | async" mat-button (click)="logout()">Logout</button>

这两种方法均无效，并且允诺尝试导致google chrome挂断：

最佳答案

如果您在某个角度的Angular应用程序中调用signinRedirectCallback（而不是位于SPA之外的单独的html页面），则很可能在调用登录回调之前调用了设置this.user的代码。

您应该在UserManager上订阅addUserLoaded，并从其处理程序中在身份验证服务中设置用户。这样，您的用户将始终保持最新状态。

如果上面的代码是从您的源复制/粘贴的，则您的app.component isLoggedIn不会从auth服务返回值，它只是在auth服务上调用isLoggedIn而不返回值。

关于javascript - 在* ngIf中使用oidc-client在Angular中实现isLoggedIn()函数，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/56811876/