Angular 7 中的身份验证 OIDC答案

【问题标题】：Auth OIDC in Angular 7Angular 7 中的身份验证 OIDC
【发布时间】：2021-02-17 05:36:46
【问题描述】：

我正在尝试获取访问令牌，我可以通过登录但我无法获取访问令牌。我正在使用 angular-oauth2-oidc。以下是我的尝试：

constructor(private route: ActivatedRoute,
    private authService: OAuthService) {
 
    const authCodeFlowConfig: AuthConfig =  {
      issuer: '...',

        redirectUri: 'http://localhost:4200',

        clientId: 'secret',
        tokenEndpoint:'..../access_token',
        
        responseType: 'code',
       
        scope: 'openid profile',
        showDebugInformation: true,
        disablePKCE: true,
        nonceStateSeparator: '.',
      };
      this.authService.configure(authCodeFlowConfig);

      this.authService.loadDiscoveryDocumentAndTryLogin().then(_ => {
        console.log("Logged in");
        if(!this.authService.hasValidAccessToken()){
          setTimeout(() => {
            this.authService.initCodeFlow();
          }, 10000);
        }
      }).catch(err => {
        console.log("Unable to login");
      })

我错过了什么吗？

【问题讨论】：

我认为您应该在应用启动时致电this.oauthService.initCodeFlow();
配置行之后？
是的，我相信是的。它应该使用返回的令牌
我编辑了，现在卡住了，它总是重定向
我编辑它。感谢您的帮助

标签： angular openid-connect

【解决方案1】：

constructor(oauthService: OAuthService) {
  const authCodeFlowConfig: AuthConfig = {
    issuer: '...',

    // URL of the SPA to redirect the user to after login
    redirectUri: 'http://localhost:4200',

    // The SPA's id. The SPA is registerd with this id at the auth-server
    // clientId: 'server.code',
    clientId: '....',
    tokenEndpoint: '...../access_token',
    // Just needed if your auth server demands a secret. In general, this
    // is a sign that the auth server is not configured with SPAs in mind
    // and it might not enforce further best practices vital for security
    // such applications.
    // dummyClientSecret: 'secret',
    responseType: 'code',
    
    // set the scope for the permissions the client should request
    // The first four are defined by OIDC.
    // Important: Request offline_access to get a refresh token
    // The api scope is a usecase specific one
    scope: 'openid profile droit_miw',
    showDebugInformation: true,
    disablePKCE: true,
    nonceStateSeparator: '.'
  };

  oauthService.configure(authCodeFlowConfig);
  oauthService.loadDiscoveryDocumentAndTryLogin().then(() => {
    if (oauthService.hasValidAccessToken()) {
      console.log(oauthService.getAccessToken());
    } else {
      oauthService.initCodeFlow();
    }
 });

【讨论】：