我使用这个新的HttpInterceptor模块开发了一个角度5拦截器,并且它正确地工作了一半 . 为了详细说明,我的服务器端API提供了令牌刷新服务,因此这里是所需的过程:对于每个http请求,拦截器将承载令牌添加到请求中 . 如果它以401状态失败,则首先拦截器使用内部服务刷新承载令牌,然后使用新的访问令牌重新发送原始请求,并且只有当它失败时,我们才会被重定向到登录页面 .

我已经为我的拦截器编写了以下代码,它的工作原理很多:它将承载令牌添加到请求中,如果有401,它使用内部服务刷新承载令牌 . 但由于某种原因,它不会使用新刷新的令牌重新发送请求,基本上这部分代码会被“忽略”:

import { Injectable } from '@angular/core';
import {
  HttpRequest,
  HttpHandler,
  HttpResponse,
  HttpErrorResponse,
  HttpEvent,
  HttpInterceptor
} from '@angular/common/http';
import { AuthService } from './auth.service';
import { Observable } from 'rxjs/Observable';


@Injectable()
export class TokenInterceptor implements HttpInterceptor {

  constructor(public auth: AuthService) {}

  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    console.log("Interceptor engaged: " + this.auth.getAccessToken());

    request = request.clone({
      setHeaders: {
        Authorization: `Bearer ${this.auth.getAccessToken()}`
      }
    });

    return next.handle(request).do((event: HttpEvent<any>) => {
      if (event instanceof HttpResponse) {
        console.log("first: ", event);
      }
    }, (err: any) => {
      if (err instanceof HttpErrorResponse) {
        if (err.status === 401 || err.status === 500) {
            console.log("attempting refresh.");
            return this.auth.refreshToken()
            .subscribe(
                d => 
                {
                    console.log("refresh success");
                    request = request.clone({
                        setHeaders: {
                            Authorization: `Bearer ${this.auth.getAccessToken()}`
                        }
                    });
                    return next.handle(request).do((event2: HttpEvent<any>) => {
                        console.log("***");
                        if (event2 instanceof HttpResponse){
                            console.log("second: ", event2)
                        }
                    }, (err2: any) => {
                        console.log("###");
                        if (err2 instanceof HttpErrorResponse){
                            console.log("Also where you redirect to login...");
                        }
                    });
                },
                d =>
                {
                    console.log("here is when you redirect...");
                    return Observable.throw(err);

                }
            )
        }
      }
    });
  }
}

我真的可以使用一些帮助来解释为什么第二个 return next.handle(request).do... 被完全忽略了 . 谢谢!