Angular 4.3x 动态 http 拦截器

Question

我按照medium中的这篇文章创建了一个http拦截器，它可以让我向每个http调用添加标头

@Injectable()
export class TokenInterceptor implements HttpInterceptor {
  constructor(public auth: AuthService) {}
  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {

    request = request.clone({
      setHeaders: {
        Authorization: `Bearer ${this.auth.getToken()}`
      }
    });
    return next.handle(request);
  }
}

本文使用 authService 动态获取令牌。然而，一旦我将 HttpClient 注入 AuthService 中，我就会收到循环注入错误。

还有其他方法可以动态调整拦截器吗？

Answer 1

避免 AngularJS 和 Angular 中循环依赖的传统方法是就地获取另一个提供程序实例，而不是在提供程序实例化时获取：

export class TokenInterceptor implements HttpInterceptor {
  constructor(public auth: AuthService, public injector: Injector) {}
  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    const httpClient = injector.get(HttpClient);
    ...
  }
}

请注意，如果拦截器适用于所有HttpClient请求，它将适用于拦截器本身内部完成的请求，并可能导致无限递归。为了避免这种情况，可以将请求标记为跳过拦截器（例如通过自定义标头）。