如何在Angular 4.3中使用两个HttpClient实例(一个有2个拦截器,另一个有1个拦截器)?

如何在Angular 4.3中使用两个HttpClient实例(一个有2个拦截器,另一个有1个拦截器)?,angular,http-headers,angular-http-interceptors,Angular,Http Headers,Angular Http Interceptors,在我们的Angular 4.3项目中,我们分别拥有公共站点组件和安全站点(登录)组件。我们使用@angular/common/http。我们希望为公共站点组件和安全站点组件实现不同的http拦截器。比如说, 公共站点组件-仅适用于拦截器下方 LoggingInterceptor 安全站点组件-应用于以下两个拦截器 LoggingInterceptor AuthTokenInterceptor(在请求头中传递auth令牌) 我们尝试使用不同的拦截器在每个组件级别@component添加提供者详细信

在我们的
Angular 4.3
项目中,我们分别拥有公共站点组件和安全站点(登录)组件。我们使用
@angular/common/http
。我们希望为
公共站点
组件和
安全站点
组件实现不同的http拦截器。比如说,

  • 公共站点组件-仅适用于拦截器下方
    LoggingInterceptor
  • 安全站点组件-应用于以下两个拦截器
    LoggingInterceptor

    AuthTokenInterceptor
    (在请求头中传递auth令牌)
  • 我们尝试使用不同的拦截器在每个组件级别
    @component
    添加提供者详细信息
    HTTP_拦截器。但请求不会进入任何拦截器

    只有当我们在
    @NgModule
    中添加提供者详细信息
    HTTP_拦截器
    时,请求才会进入拦截器。这里的问题是,公共站点http请求也会进入不需要的
    AuthTokenInterceptor


    那么我们应该如何解决这个问题呢?谢谢。

    您不需要两个
    HttpClient
    实例作为拦截器在每个http请求上反复应用

    我不知道你们是如何处理我们应用程序的状态的,基于此,你们可以在你们的拦截器中设置一些条件,这些条件将决定当前请求是否发生变化。这样,如果请求是从
    公共站点组件触发的
    ,则不会附加
    授权
    头。e、 g:

    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        if ('your condition here if public-site components') {
            // Just return original request
            return next.handle(req);
        } else {
            // Here return modified one
            // Get the auth header from the service.
            const authHeader = this.auth.getAuthorizationHeader();
            // Clone the request to add the new header.
            const authReq = req.clone({headers: req.headers.set('Authorization', authHeader)});
            // Pass on the cloned request instead of the original request.
            return next.handle(authReq);
         }
    
       }
    
    intercept(req:HttpRequest,next:HttpHandler):可观察{
    if('如果公共站点组件',您的条件在这里){
    //只需返回原始请求
    返回next.handle(req);
    }否则{
    //这里返回修改的一个
    //从服务获取身份验证标头。
    const authHeader=this.auth.getAuthorizationHeader();
    //克隆添加新标头的请求。
    const authReq=req.clone({headers:req.headers.set('Authorization',authHeader)});
    //传递克隆请求而不是原始请求。
    返回next.handle(authReq);
    }
    }
    

    如果您不想将
    Authorization
    头发送到特定的
    api/url
    ,只需使用
    req.url
    设置过滤器即可

    谢谢你,昆塞维奇。我们将找到区分公共站点组件请求的条件。但有一个问题,如果我们在@Component级别(从@NgModule中删除)添加HTTP_拦截器提供程序,并且如果我们在该组件的ngOnInit方法中进行HTTP调用,则不会调用拦截器。如果我们将相同的代码行(provider)移动到@NgModule,拦截器就会工作。HTTP_拦截器提供程序是否应该仅在NgModule中配置?依赖项注入就是这样工作的。即使您将
    公共站点
    安全站点
    放入以分离
    模块
    ,显然,您必须在
    app.module
    中声明每一项,然后在
    公共站点中声明。module
    指定
    interceptor1
    并在
    安全站点中指定。module
    指定
    interceptor1
    interceptor2
    ,这样您最终将调用
    interceptor1
    两次。但是,如果您使每个模块都延迟加载,那么您可能会解决它,因为每个延迟加载模块都有自己的注入树,因此在这种情况下提供者不会干扰。但是我不建议使用
    延迟加载
    模块作为
    延迟加载
    来解决您的问题。我不建议使用
    延迟加载
    仅仅是为了让不同的
    http拦截器
    /
    提供程序
    应用于您的每个
    延迟加载
    模块,我希望这是清楚的。@Kuncevic您找到解决方案了吗?我也有同样的问题。我已经尝试在拦截器中添加条件,但找不到如何过滤它。我在拦截器中有对请求的引用,但没有对推荐人的引用,也没有关于请求来源的任何信息from@Kuncevic忽略上面的问题。找到了一种方法。我觉得自己很蠢,我以前没想过。您无法从请求对象获取它,但是您可以将路由器注入到拦截器中,并从那里获取源URL