Question

我从介质跟随this article创建了一个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个请求，它将应用于在拦截器内部完成的请求，并可能导致无限递归。为了避免这种情况，可以将请求标记为跳过拦截器（例如，通过自定义标头）。

Answer 2

来自article它说：

应该注意Angular的新HttpClient来自这里使用@ angular / common / http而不是Http类 @角/ HTTP。 如果我们尝试用传统的请求 Httpclass，拦截器不会被击中

请确保您在导入部分中使用import { HttpClient } from '@angular/common/http';。

然后构造函数使用它：constructor(public http: HttpClient) {}

angular 4.3x动态http拦截器

2 个答案: