时间戳

首页 > 解决方案 > Angular HTTP 拦截器不执行 Observable

angular - Angular HTTP 拦截器不执行 Observable

问题描述

我正在尝试在 Angular 中实现一个滑动到期会话，其中会话应该随着与 API 的每次交互而扩展。

HTTP 拦截器负责在每次响应后更新令牌。这里的问题是authService.renewToken()调用从未真正执行对 API 的请求。我确实在控制台中看到begin renew token并renewToken记录了消息，但对 API 的令牌请求永远不会触发。

有什么想法可能是这里的问题吗？

AuthenticationService


  public renewToken(token: string): Observable<Token> {

    console.log('renewToken');
    
    return this.api
      .createSession(token)
      .pipe(tap((newToken) => {
          console.log(token === newToken.token);

          this.saveToken(newToken);
        }));
  }

@Injectable()
export class ResponseInterceptor implements HttpInterceptor {
  private refreshingToken = false;
  private tokenSubject = new Subject<any>();

  constructor(private injector: Injector) { }

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    return next.handle(req).pipe(tap(event => {

      if (this.shouldIntercept(event)) {
        this.tokenSubject.next(null);
        this.refreshingToken = true;

        const authService = this.injector.get(AuthenticationService);

        const currentToken = authService.getToken();

        console.log('begin renew token');
        
        return authService.renewToken(currentToken).pipe(
          switchMap((newToken: Token) => {
            console.log("newToken Recieved:", newToken.token);
            this.tokenSubject.next(newToken);
            return next.handle(req);
          }),
          finalize(() => { this.refreshingToken = false; })
        )
      }

      return next.handle(req);
    }), catchError(errorResponse => {
      this.refreshingToken = false;

      if (errorResponse.status === 401) {
        console.log('Unauthorised response received.');
        this.injector.get(Router).navigate(['error']);
      }
      return throwError(errorResponse);
    }));
  }

标签： angulartypescriptrxjs

解决方案

假设您的saveToken函数返回一个 observable，您可能看不到任何 API 响应的原因是它tap不会订阅this.saveToken. 尝试使用switchMap// exhaustMap（concatMapIMOswitchMap最有意义，因为如果有新请求到达，它将取消飞行中的请求）。这些运算符将自动订阅内部可观察对象。

推荐阅读