时间戳

首页 > 解决方案 > forkJoin 和拦截器一起不起作用

angular - forkJoin 和拦截器一起不起作用

问题描述

我forkJoin用于多个请求。它运作良好。

但是，在我添加拦截器后，它停止工作。

intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
  const token = localStorage.getItem('token');

  if (token) {
    request = request.clone({
        url: request.url,
      setHeaders:
      { Authorization: `Bearer ${token}`,
        'Access-Control-Allow-Origin': '*'  
        }
    });
    return next.handle(request); 
  } else {
    this.router.navigate(['/login']);
    return next.handle(request);
  }
}

forkJoin代码：

const s0 = return this.http.get < IEntityOne > ('u1');
const s1 = return this.http.get < IEntityTwo > ('u2');

forkJoin([s0, s1]).subscribe(
  ([v1, v2]) => {
    console.log(v1);  // <-------- This line of code is never reached
  }
)

经过一些谷歌搜索，我将代码更改为

return next.handle(request).pipe(take(1));

但它仍然无法正常工作。

标签： angularhttprxjsangular-http-interceptors

解决方案

forkJoin 操作员只会在所有内部 observables 完成后才发出-因此在这种情况下，如果这些调用中的一个或没有一个成功完成，那么forkJoinobservable 将不会发出任何东西（导致不发生日志记录）。

对于初学者，请在您使用的任何开发人员工具中检查您的网络选项卡以查看这些请求，并确保您从后端获得响应。

其次，正如@eko 指出的那样，尝试 combineLatest。创建该可观察对象时，它会在任何内部可观察对象完成时发出。这样，如果两个都成功完成，您将看到 2 个控制台日志，如果一个完成，则看到 1 个，等等。

最后，您不应take在拦截器中使用运算符（在此上下文中）。由于拦截器旨在充当某种“管道”（不是 Angular 管道，只是在 Http 请求流经它们的意义上），使用take(1)将导致对后端的任何请求（在第一个之后）根本不返回。

推荐阅读