时间戳

首页 > 解决方案 > 新标头未与拦截器一起添加

angular - 新标头未与拦截器一起添加

问题描述

我想向我的 Angular 8 应用程序中的所有 HTTPClients 添加标头。这是我的拦截器：

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

@Injectable()
export class Interceptor implements HttpInterceptor {
  constructor(private toaster: ToastrService) {}

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {

    alert('Interceptor!');

    // Set headers
    const headers = req.headers;

    // Set this header for security
    headers.set('test', 'value');

    const authReq = req.clone({ headers });

    return next.handle(authReq);
  }
}

警报已执行，但测试标头未添加到请求中。

标签： angularhttpclientangular-http-interceptors

解决方案

来自官方文档：

您不能直接修改先前选项对象中的现有标头，因为 HttpHeaders 类的实例是不可变的。

请改用 set() 方法。它返回应用了新更改的当前实例的克隆。

您需要克隆请求并在那里设置标头。

const newReq =  req.clone({ headers: req.headers.set('test', 'value') });
return next.handle(newReq);

推荐阅读