Question

我已经更新了我所有的Angular依赖项，包括 ng-oidc-client （〜2.0.3）和 oidc-client （^ 1.10.1），但是更新后，我无法登录到我的应用程序，因为存在无限重定向。

在控制台中，我收到以下错误：

UserManager.getUser: user not found in storage
UserManager.signinRedirectCallback: successful, signed in sub:  auth0|auth0|5cac7184cf805a119895edc6

我找不到更新后无法再使用的原因。

我还将静态HTML页面替换为文档中的最新页面：

oidc-login-redirect-callback.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Callback</title>
    <link rel="icon" type="image/x-icon" href="favicon.png" />
    <script src="oidc-client.min.js" type="application/javascript"></script>
  </head>

  <body>
    <script>
      var Oidc = window.Oidc;

      var config = {
        userStore: new Oidc.WebStorageStateStore({ store: window.localStorage }),
      };

      if (Oidc && Oidc.Log && Oidc.Log.logger) {
        Oidc.Log.logger = console;
      }
      var isPopupCallback = JSON.parse(window.localStorage.getItem('ngoidc:isPopupCallback'));

      if (isPopupCallback) {
        new Oidc.UserManager(config).signinPopupCallback();
      } else {
        new Oidc.UserManager(config).signinRedirectCallback().then((t) => {
          window.location.href = '/';
        });
      }
    </script>
  </body>
</html>

oidc-login-redirect-callback.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Renew Callback</title>
    <link rel="icon" type="image/x-icon" href="favicon.png" />
  </head>

  <body>
    <script src="oidc-client.min.js"></script>
    <script>
      var config = {
        userStore: new Oidc.WebStorageStateStore({ store: window.localStorage }),
      };
      new Oidc.UserManager(config).signinSilentCallback().catch(function (e) {
        console.error(e);
      });
    </script>
  </body>
</html>

oidc-logout-redirect-callback.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Signout Callback</title>
    <link rel="icon" type="image/x-icon" href="favicon.png" />
    <script src="oidc-client.min.js" type="application/javascript"></script>
  </head>

  <body>
    <script>
      var Oidc = window.Oidc;

      var config = {
        userStore: new Oidc.WebStorageStateStore({ store: window.localStorage }),
      };

      if (Oidc && Oidc.Log && Oidc.Log.logger) {
        Oidc.Log.logger = console;
      }

      var isPopupCallback = JSON.parse(window.localStorage.getItem('ngoidc:isPopupCallback'));

      if (isPopupCallback) {
        new Oidc.UserManager(config).signoutPopupCallback();
      } else {
        new Oidc.UserManager(config).signoutRedirectCallback().then((test) => {
          window.location.href = '/';
        });
      }
    </script>
  </body>
</html>

身份验证模块仍配置为更新前：

export function getWebStorageStateStore() {
  return new WebStorageStateStore({ store: window.localStorage });
}

@NgModule({
  declarations: [],
  imports: [
    CommonModule,
    NgOidcClientModule.forRoot({
      // prettier-ignore
      oidc_config: {
        authority: environment.sts.authority,
        client_id: environment.sts.clientId,
        redirect_uri: `${environment.appRoot}oidc-login-redirect-callback.html`,
        scope: 'openid profile email',
        response_type: 'id_token token',
        post_logout_redirect_uri: `${environment.appRoot}oidc-logout-redirect-callback.html`,
        silent_redirect_uri: `${environment.appRoot}oidc-silent-renew-redirect-callback.html`,
        accessTokenExpiringNotificationTime: 10,
        automaticSilentRenew: true,
        metadata: {
          authorization_endpoint: `${environment.sts.authority}authorize?audience=${environment.sts.audience}`,
          userinfo_endpoint: `${environment.sts.authority}userinfo`,
          issuer: environment.sts.authority,
          jwks_uri: `${environment.sts.authority}.well-known/jwks.json`,
          // tslint:disable-next-line:max-line-length
          end_session_endpoint: `${environment.sts.authority}v2/logout?returnTo=${environment.appRootEncoded + 'oidc-logout-redirect-callback.html'}&client_id=${environment.sts.clientId}`
        },
        userStore: getWebStorageStateStore
      }
    }),
  ],
  exports: [],
  providers: [
    AuthService,
    CanActivateAuthGuard,
    {
      provide: HTTP_INTERCEPTORS,
      useClass: AuthInterceptorService,
      multi: true,
    },
  ],
})

我还使用与以前相同的拦截器：

intercept(
    req: HttpRequest<any>,
    next: HttpHandler
  ): Observable<HttpEvent<any>> {
    return this.authService.identity$.pipe(
      take(1),
      switchMap(user => {
        if (user && !user.expired && user.access_token) {
          req = req.clone({
            setHeaders: {
              Authorization: `Bearer ${user.access_token}`,
            },
          });
        } else {
          this.authService.signinRedirect();
        }
        return next.handle(req);
      })
    );
  }
}

还有同一个警卫：

@Injectable()
export class CanActivateAuthGuard implements CanActivate {
  constructor(private authService: AuthService) {}

  public canActivate(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot
  ): Observable<boolean> | boolean {
    return this.authService.loggedIn$.pipe(take(1));
  }
}

我该如何解决UserManager.getUser错误并删除对 oidc-logout-redirect-callback.html 的无限重定向？

在存储中找不到ng-oidc-client用户

0 个答案: