Angular 12实现refresh token时拦截器switchMap内代码不执行求助

排查修复步骤 #

• 1. 修复refreshToken调用传参缺失问题
     你服务层定义的refreshToken方法要求传入token参数，但拦截器中调用时没有传任何参数，会导致请求参数缺失，后端直接报错返回，Observable触发error回调而非next回调，自然不会进入switchMap逻辑。
     修复示例：

return this.authenticationService
  // 补充传入当前过期的token参数
  .refreshToken(token)
  .pipe(
    // 新增错误处理，避免刷新失败后刷新状态锁死
    catchError(err => {
      this.refreshTokenInProgress = false;
      // 可按需补充退出登录、跳转登录页逻辑
      return throwError(() => err);
    }),
    switchMap((authResponse: any) => {
      // 原有逻辑保持不变
    })
  )

• 2. 修复刷新请求拦截跳过逻辑
     你当前判断跳过拦截的逻辑是检查请求体的operationName字段，但你的刷新请求根本没有这个字段，导致刷新请求本身也会被拦截器捕获，检测到token过期后又尝试触发刷新，进入死循环，刷新请求永远发不出去。
     修复示例：

// 替换原有operationName判断逻辑，通过请求地址识别刷新接口
if (req.url.includes('/auth/token/refresh')) {
  return next.handle(req);
}

• 3. 移除刷新请求的过期Authorization头
     你调用刷新接口时还在传入headers: this.getAuthorizationHeader()，会把已经过期的token放到请求头里，大部分后端会直接拦截过期token返回401，导致刷新请求失败。
     修复服务层代码：

public refreshToken(token: string) {
  // 移除headers参数，刷新接口用请求体里的token做校验即可
  return this.http.post<any>(`${this.baseUrl}/auth/token/refresh`, { token });
}

• 4. 新增请求状态调试逻辑
     如果以上修改后问题依然存在，可以在pipe中加tap操作符打印日志，确认请求的触发和返回状态：

return this.authenticationService
  .refreshToken(token)
  .pipe(
    tap({
      next: res => console.log('刷新请求返回成功：', res),
      error: err => console.log('刷新请求返回失败：', err)
    }),
    switchMap(/*原有逻辑保持不变*/)
  )

内容的提问来源于stack exchange，提问作者Ahmad Alfy