首页 > 解决方案 > 是否可以在嵌套的惰性模块中使用 HTTP_INTERCEPTORS?

问题描述

我有一个FooModule嵌套在AppModule

AppModule

import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.model';

@NgModule({
  imports: [
    AppRoutingModule
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

FooModule

import { NgModule } from '@angular/core';
import { AuthInterceptorService } from '../auth/auth-interceptor.service';
import { HTTP_INTERCEPTORS } from '@angular/common/http';

@NgModule({
  providers: [
    {
      provide: HTTP_INTERCEPTORS,
      useClass: AuthInterceptorService,
      multi: true
    }
  ]
})
export class FooModule {}

FooModule正在通过延迟加载加载:

AppRoutingModule

const appRoutes : Routes = [
    {
        path: "foos",
        loadChildren: () =>
          import("./foos/foos.module").then(m => m.FoosModule)
    }
]

@NgModule({
    imports: [RouterModule.forRoot(appRoutes, { preloadingStrategy: PreloadAllModules })],
    exports: [RouterModule]
})
export class AppRoutingModule {
}

但只有当我移动HTTP_INTERCEPTORSAppModulehttp-s 时才会被拦截,有没有办法让拦截器从FooModule.

我要求拦截器执行添加授权的特定工作,该授权仅与FooModule.

标签: angularangular-http-interceptors

解决方案


看起来可以HTTP_INTERCEPTORS通过嵌套的延迟加载模块加载,我只是缺少HttpClientModule嵌套模块内部的导入:

@NgModule({
  import: HttpClientModule,
  providers: [
    {
      provide: HTTP_INTERCEPTORS,
      useClass: AuthInterceptorService,
      multi: true
    }
  ]
})
export class FooModule {}

但是,因为HttpClientModule是单例,所以它应该只定义一次,最好的地方是 inside AppModule。因此,我最终移动了拦截器和要从中导入的 http 客户端,AppModule同时基于以下内容修改resolve为条件解析器req.url

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    if (req.url == this._config.SecretAPI) {
        //Add Authorization Header:
        const modifiedReq = req.clone({ 
            headers: new HttpHeaders().set('Authorization', this._authService.authorizationHeaderValue)
        });
        return next.handle(modifiedReq);
    }
    else {
        return next.handle(modifiedReq);
    }
}

推荐阅读