Angular 5 HttpClient如何在特定请求中禁用请求头？

嘿，我刚好碰到过类似的问题，给你一个适配Angular 5.2.9的解决方案！核心思路是给不需要全局请求头的特定请求加一个自定义标记，然后在拦截器里识别这个标记，跳过全局头的添加逻辑。

步骤1：发送特定请求时添加自定义标记 #

当你发送不需要全局头的请求时，在请求的headers里加一个自定义标识（比如skip-interceptor），告诉拦截器跳过这个请求的头处理：

import { HttpHeaders } from '@angular/common/http';

// 示例：发送不需要全局头的GET请求
this.http.get('/api/your-target-url', {
  headers: new HttpHeaders().set('skip-interceptor', 'true')
}).subscribe(response => {
  // 处理响应
});

步骤2：修改拦截器代码，识别标记并跳过处理 #

更新你的SetHeaderInterceptor，在添加全局头之前先检查这个标记。如果检测到标记，就移除它（避免传给后端），然后直接转发请求；否则正常添加全局头：

import { Injectable } from '@angular/core';
import { HttpRequest, HttpHandler, HttpEvent, HttpInterceptor } from '@angular/common/http';
import { Observable } from 'rxjs';

@Injectable()
export class SetHeaderInterceptor implements HttpInterceptor {
  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    // 检查请求是否带有跳过拦截器的标记
    const shouldSkip = request.headers.has('skip-interceptor');

    if (shouldSkip) {
      // 移除自定义标记，避免后端收到无效头
      const clonedRequest = request.clone({
        headers: request.headers.delete('skip-interceptor')
      });
      // 直接转发，不添加全局头
      return next.handle(clonedRequest);
    }

    // 对需要全局头的请求，添加你配置的请求头
    const modifiedRequest = request.clone({
      setHeaders: {
        'Authorization': 'Bearer YOUR_AUTH_TOKEN', // 替换成你的全局头
        'Content-Type': 'application/json'
        // 其他全局头...
      }
    });

    return next.handle(modifiedRequest);
  }
}

额外提醒：确保拦截器正确注册 #

别忘了在你的AppModule的providers数组里注册这个拦截器，否则它不会生效：

import { HTTP_INTERCEPTORS } from '@angular/common/http';
import { SetHeaderInterceptor } from './setHeader';

@NgModule({
  // ...其他配置
  providers: [
    { 
      provide: HTTP_INTERCEPTORS, 
      useClass: SetHeaderInterceptor, 
      multi: true 
    }
  ]
})
export class AppModule { }

这种方式既保留了全局请求头的便利性，又能灵活地针对特定请求禁用，完全适配你当前的Angular 5.2.9版本~

内容的提问来源于stack exchange，提问作者Harleen Kaur Arora