以角度将“Bearer-Token”添加到http标头

Question

我正在尝试在 http 标头中添加自定义字段“Bearer-Token”。 将令牌添加为 'Authorization' : Bearer xyzqwerty 工作正常，但添加 'Bearer-Token': xyzqwerty 会引发错误

TypeError: Cannot read property 'length' of null
    at HttpHeaders.applyUpdate (http.js:334)
    at http.js:284
    at Array.forEach (<anonymous>)
    at HttpHeaders.init (http.js:280)
    at HttpHeaders.forEach (http.js:378)
    at Observable._subscribe (http.js:2362)
    at Observable._trySubscribe (Observable.js:42)
    at Observable.subscribe (Observable.js:28)
    at subscribeToResult (subscribeToResult.js:9)
    at MergeMapSubscriber._innerSub (mergeMap.js:59)

下面是我正在使用的拦截器的代码：

import { Injectable, Injector } from '@angular/core';
import { HttpEvent, HttpInterceptor } from '@angular/common/http'
import { AuthService } from './auth.service';
import { Observable } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class TokenInterceptorService implements HttpInterceptor {

  constructor(private injector: Injector) { }
  intercept(req, next): Observable<HttpEvent<any>>{

    let authService = this.injector.get(AuthService)
    let tokenizedReq = req.clone(
      {
        headers: req.headers.set('Authorization', 'bearer ' + authService.getToken()),
      }
      
    )

    let tokenizedReq1 = tokenizedReq.clone(
      {
        headers: tokenizedReq.headers.set('Bearer-Token', authService.getToken())
      }
    )
    return next.handle(tokenizedReq1)
  }
}

Answer 1

你可以这样做：

const tokenizedReq1 = req.clone({setHeaders: {'Bearer-Token': authService.getToken()}});
return next.handle(tokenizedReq1);

如果这不起作用，您可以尝试这种方式：

    const tokenizedReq1 = req.clone({
        headers: new HttpHeaders({
          'Bearer-Token':  authService.getToken(),
          'Authorization': `bearer ${authService.getToken()}`
        })
    });