在interceptor.module.ts 中设置授权头参数答案

【问题标题】：Set authorization header param in interceptor.module.ts在interceptor.module.ts 中设置授权头参数
【发布时间】：2019-10-17 03:03:37
【问题描述】：

我需要将授权令牌发送到每个请求的标头中，但我找不到将参数设置为 intercepetor.module.ts 代码的正确方法。

这是我的 Angular interceptor.module.ts 的摘录

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

        console.warn("Loader Started - HTTP request: " + req.url);

        let dupReq = req.clone({
            setHeaders:{
                'Content-Type' : 'application/json',
                'Accept'       : 'application/json',
                'Authorization': "Basic "+ myToken
            }
        });

        return next.handle(dupReq).pipe(
            map(event => {
                return event;
            }),
            catchError(error => {
                return Observable.throw(error);
            }),
            finalize(() => {

            })
        );
    }

当我在调试模式下进入 Chrome 的网络选项卡时，请求的标头没有变化，也没有显示“授权”参数。

我尝试通过headers.append() 方法设置标题，它也没有区别。

【问题讨论】：

标签： angular typescript http header

【解决方案1】：

你可以试试这个，因为你想要Basic授权：

const httpOptions = {
    headers: new HttpHeaders({ 
        'Content-Type': 'application/json',
        'Authorization': 'Basic ' + btoa(myToken)
    })
};

【讨论】：

【解决方案2】：

试试这个：

const dupReq = req.clone({
    setHeaders: {
      Authorization: "Basic "+ btoa(myToken),
      'Access-Control-Allow-Origin': '*'
    },
  })

【讨论】：

【解决方案3】：

request.clone({
     setHeaders: {
       'Authorization': `Basic ${myToken}`
     }
   });

【讨论】：