Question

我有一个应用，该应用带有多个模块，遵循post中建议的体系结构。我需要知道Interceptor的项目文件夹结构中的正确配置和位置，以便使用@ auth0 / angular-jwt库将Authorization标头与Bearer Token附加在一起，以及模块导入结构。我有一个核心模块来分解通用模块的导入，但是我想将此定制的特定功能限制在我的自定义业务逻辑模块中。提前致谢。

Answer 1

import { ModuleWithProviders, NgModule } from '@angular/core';
import { LoadingComponent } from '../components/home/shared/loading/loading.component';
import { JwtModule, JWT_OPTIONS } from '@auth0/angular-jwt';
import { JwtService } from '../util';


export function jwtOptionsFactory(jwtService: JwtService) {
  return {
    tokenGetter: () => {
      return jwtService.getToken();
    }
  };
}

@NgModule({
  imports: [
    JwtModule.forRoot({
      jwtOptionsProvider: {
        provide: JWT_OPTIONS,
        useFactory: jwtOptionsFactory,
        deps: [JwtService]
      }
    })
  ],
  declarations: [LoadingComponent],
  exports: [JwtModule],
})
export class AuthModule {
  static forRoot(): ModuleWithProviders {
    return {
      ngModule: AuthModule
    };
  }
}

将AuthModule.forRoot()添加到app.module.ts的导入

Answer 2

此配置必须位于 app.module.ts 文件中。例如：

// other imports...
import { JwtModule } from '@auth0/angular-jwt';

export function tokenGetter(): string {
    return localStorage.getItem('token');
}

@NgModule({
  declarations: [
    // your declarations...
  ],
  imports: [
    // your imports...
    JwtModule.forRoot({
        config: {
            tokenGetter: tokenGetter,
            whitelistedDomains: ['localhost:5000'],
            blacklistedRoutes: ['localhost:5000/api/auth']
        }
    }),
  ],
  providers: [
    // your providers...
  ],
  bootstrap: [
    AppComponent
  ]
})
export class AppModule { }

Answer 3

如果您的项目中有延迟加载的模块。那么您可以使用auth0 / angular-jwt库的disallowedRoutes功能

disallowedRoutes

如果您不想替换特定路由的授权标头，请在disallowedRoutes中列出它们。如果您的初始身份验证路由在允许的域上并采用基本身份验证标头，这将很有用。这些路由需要使用正确的协议（Http：//，https：//）作为前缀。如果您希望将路由添加到禁止路由列表中，而不论协议如何，都可以在其前面加上//.

JwtModule.forRoot({
  config: {
    // ...
    disallowedRoutes: [
      "http://localhost:3001/auth/",
      "https://foo1.com/bar/",
      "//foo1.com/bar/baz",
      /localhost:3001\/foo\/far.*/,
    ], // strings and regular expressions
  },
});

通过子模块中的拦截器进行Angular2 jwt auth

3 个答案: