调用SignInDirect时的Oidc客户端无限循环

Question

我将angular 8与oidc客户端js一起使用。我已连接到IdentityServer4（代码流PKCE）。在我打开应用程序（在主组件内）后，我想检查用户是否经过身份验证。这就是我调用SignInDirect（）的原因。我没有手动单击按钮，而是在构造函数内部调用它（当我单击按钮调用SignInDirect（）时，整个流程都起作用）。问题是我被困在无限循环中。Angular一直在调用IdenityServer并刷新登录页面。对服务器的api调用（结果重定向到登录页面）工作正常，但不会停止。请帮忙。

export class AuthService {
  private userManager: UserManager;
  private user: User;

  constructor(private client: HttpClient) {
    this.userManager = new UserManager(AuthSettings.settings);
    this.userManager.getUser().then(user => {
      this.user = user;
    });
  }

  checkCredentials() {
    if (!this.isUserLoggedIn()) {
      this.redirectToLogin();
    }
  }

  redirectToLogin() {
    return this.userManager.signinRedirect();
  }

  isUserLoggedIn(): boolean {
    return this.user != null && !this.user.expired;
  }
}

export class AppComponent {
  title = "app";

  constructor(private authService: AuthService) {
    this.authService.checkCredentials();
  }
}

用户进入angular应用程序。然后我调用authorize endpoint（SignInDirect，发送代码流中所需的服务器内容）——如果用户登录，服务器将检查cookie。如果没有，它会将我重定向到登录页面。问题是，如果我单击一个调用（SignInDirect）的按钮，而不是在组件打开时执行该按钮，则该场景可以工作。循环以日志显示登录名结束：用户未通过身份验证。循环以启动HTTP/1.1 GET的请求开始http://localhost:5555/.well-已知的/openid配置。然后-请求启动HTTP/1.1 GEThttp://localhost:5555/connect/authorize?response_type=code

Answer 1

也许我反应晚了。以下是我的观察结果。

下面的代码在您的身份验证服务构造函数异步工作，有一个非常好的理由，你不会有用户对象填充的时间检查凭据称为应用程序内组件，也修复了这一点，通过使构造函数是一个反模式，你真的需要有一个异步和等待使用在这里。

 this.userManager.getUser().then(user => {
      this.user = user;
    });