时间戳

首页 > 解决方案 > 拦截器中的角度自定义标头

angular - 拦截器中的角度自定义标头

问题描述

我正在开发一个带有请求拦截器的 Angular 9 应用程序，它应该向服务器发送发出请求的 UI 版本。

因为请求需要这些数据，所以我在拦截器中添加了它。问题是它似乎无法正常工作。

这是我的拦截器代码：

@Injectable()
export class VersionInterceptor implements HttpInterceptor {

  constructor() {}

  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    const version = request.clone({ setHeaders: { 'App-version':  environment.UIversion } });
    return next.handle(version);
  }
}

这可能是 app.module 提供者

providers: [
    { provide: Http, useClass: AuthenticatedHttpService },
    { provide: HTTP_INTERCEPTORS, useClass: ErrorHttpInterceptor, multi: true },
    { provide: HTTP_INTERCEPTORS, useClass: VersionInterceptor, multi: true },
    { provide: APP_BASE_HREF, useValue: environment.baseurl },
]

但我的请求没有标题“App-version”

在此处输入图像描述

只有一个请求有它并且它失败（但如果我删除拦截器，这个请求工作正常）

在此处输入图像描述

是否有标准在标题中发送我的 ui 版本？如果没有，有什么方法可以添加自定义标头名称以将我的 ui 版本发送到服务器？

非常感谢

标签： angulartypescripthttp-headersangular-http-interceptors

解决方案

我发现我也无法传递自定义标题。但是，我可以在调用中传递拦截器中可用的自定义参数。

在服务伪代码

constructor(private http: HttpClient) {}

getMethod(): Observable<Type> {
  let params = { "X-custom-param": "true" };
  let options = { params: params };
  this.http.get<Type>(url, options);
}

在拦截器中

  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
  return next.handle(request).pipe(
    tap((e) => {}),
    catchError((error: HttpErrorResponse) => {
      let custom = request.params.get("X-custom-param");

推荐阅读