JWT 与 Angular 和 SpringBoot

Question

我想在我当前连接到 Spring Boot 后端的 Angular 应用程序中集成 JWT 身份验证。

我浏览了很多教程，但大多数都不适合，因为它们连接到 Auth0。我想自己处理用户管理。

我找到了这个例子：

角度：https://medium.com/@juliapassynkova/angular-springboot-jwt-integration-p-1-800a337a4e0

Spring Boot：https://medium.com/@nydiarra/secure-a-spring-boot-rest-api-with-json-web-token-reference-to-angular-integration-e57a25806c50

不幸的是，这个 Angular 前端是 Angular 4，而我已经在使用 Angular 6。他们使用与 Angular 6 不兼容的“angular2-jwt”。我必须使用“auth0/angular-jwt”。

我的问题是，在我使用登录表单后，浏览器会再次打开一个登录弹出窗口以登录后端。但即使有正确的凭据，它也不起作用。我猜，请求中缺少一些凭据。在 app.module.ts 中有 2 个旧的 angular2-jwt 代码，我不知道如何将其升级到 auth0/angular-jwt

export function authHttpServiceFactory(http: Http) {
  return new AuthHttp(new AuthConfig({
    headerPrefix: 'Bearer',
    tokenName: TOKEN_NAME,
    globalHeaders: [{'Content-Type': 'application/json'}],
    noJwtError: false,
    noTokenScheme: true,
    tokenGetter: (() => localStorage.getItem(TOKEN_NAME))
  }), http);
}

和

providers: [
    {provide: AuthHttp, useFactory: authHttpServiceFactory, deps: [Http]},
]

谁能帮我解决这个问题。可能是我的猜测有误，可能是别的原因？

附注；我刚刚更改了前端，但尝试从示例连接到后端。如果我同时使用示例中的前端和后端，它的工作正常。

Answer 1

几个月前，我已经成功地从 angular2-jwt 迁移到 auth0/angular-jwt。这样做时您必须牢记的是：

• auth0/angular-jwt 使用了新的 angular HttpClient 库，所以如果你想使用它，你必须将所有应用程序迁移到它（我建议还是这样做，新库非常棒）

• 新的 angular-jwt 使用 HttpInterceptors - 这允许您将 JWT 直接附加到 HttpClient 过滤器链。所以你不必迁移上面的代码。您必须将其完全删除并替换为拦截器初始化：（从 auth0/angular-jwt 文档复制粘贴）：

  import { JwtModule } from '@auth0/angular-jwt';
  import { HttpClientModule } from '@angular/common/http';
  
  export function tokenGetter() {
    return localStorage.getItem('access_token');
  }
  
  @NgModule({
    bootstrap: [AppComponent],
    imports: [
      // ...
      HttpClientModule,
      JwtModule.forRoot({
        config: {  
          tokenGetter: tokenGetter,  
          whitelistedDomains: ['localhost:3001'],  
          blacklistedRoutes: ['localhost:3001/auth/']  
        }  
      })  
    ]  
  })  
  export class AppModule {}
  

请记住在您的根模块中应用此代码 - 然后使用您的 HttpClient 而不做任何更改，拦截器将自动应用 JWT。如果出现问题 - 责备 whitelistedDomains/blacklistedRoutes。这些字段目前实现得很差，并导致正则表达式等问题。
由于迁移并不简单，并且花了我很多时间，请随时询问。很有可能我会知道答案。