角度拦截器：未调用 Http 请求答案

【问题标题】：Angular Interceptor: Http request is not being called角度拦截器：未调用 Http 请求
【发布时间】：2021-03-03 06:42:38
【问题描述】：

我试图在每个请求之前获取 RefreshToken，如果它已过期，我需要刷新它。拦截器调用服务的函数，但我从来没有得到 API 调用。请帮忙

我的拦截器代码

public intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    if (!this.authService.isAccessTokenExpired()) {
      return next.handle(this.addCookiesToRequest(request));
    }
    if (this.refreshTokenInProgress) {
      return this.refreshTokenSubject.pipe(
        filter(result => result !== null),
        take(1),
        switchMap(() => next.handle(this.addCookiesToRequest(request)))
      );
    } else {
      this.refreshTokenInProgress = true;
      this.refreshTokenSubject.next(null);
      return this.authService.refreshExpiredToken().pipe(
        switchMap((token: any) => {
          this.refreshTokenInProgress = false;
          this.refreshTokenSubject.next(token);
          return next.handle(this.addCookiesToRequest(request));
        }),
        catchError((error: any) => {
          this.refreshTokenInProgress = false;
          return Observable.throw(error);
        })
      );
    }
  }
}

  public addCookiesToRequest(request: HttpRequest<any>): HttpRequest<any> {
    return request.clone({
      withCredentials: true
    });
  }

authService refreshToken 代码

refreshExpiredToken() {
    return this.http.get(`${api_url}/token/refresh`, {
      withCredentials: true,
      observe: 'response'
    }).pipe(
      tap((res) => {
        if (res.status >= 300 && res.status < 400) {
          window.location.href = res.url;
        }
      }),
      catchError((error) => {
        if (error.status === 401) {
          this.router.navigate(['/login']);
        }
        return of(error);
      })
    );
  }

我什至尝试在某处添加 .subscribe()，但仍然没有

【问题讨论】：

标签： angular typescript httpclient interceptor

【解决方案1】：

所以问题是我没有从拦截器中排除 refreshToken URL，这就是它在无限循环中拦截自身的原因，这就是它从未被实际调用的原因。

【讨论】：

【解决方案2】：

我认为根本问题是您要处理引用令牌状态客户端。

除此之外，在您的代码中，您的第二个 if 语句依赖于 else 语句：当 refreshTokenInProgress 为 true 时，拦截器返回 refreshTokenSubject，这将发出一些值仅在 else 语句中。这样

 switchMap(() => next.handle(this.addCookiesToRequest(request)))

永远不会被触发。

【讨论】：

问题不在于那一行。我到达return this.authService.refreshExpiredToken().pipe( 行，然后什么都没有发生，switchMap 和catchError 都没有，因为对refreshToken 的http 请求永远不会触发。但是正在调用服务的函数并且调试器进入它。
在客户端处理是什么意思？我正在向服务器发出请求以获取新令牌
如果我正确理解了您的代码，您将返回一个从不发出值的 observable，这就是 return 语句有效但您没有得到任何值的原因。您应该检查的行是this.refreshTokenSubject.next(token); 和this.refreshTokenSubject.next(null);。
情况并非如此。此外，您写的那一行是针对其他请求，如果它们在第一个请求尚未触发时触发，因为它正在等待 refteshToken。当 refreshToken 被刷新时 - 所有其他请求也会触发