труба catchError не работает при обновлении токена в перехватчике - PullRequest
Новая
       22

труба catchError не работает при обновлении токена в перехватчике

1 голос
/ 01 июля 2019

Возможно, это глупый вопрос, но я создал перехватчик, где я ловлю, если ответ не получается с кодом 401 и обновляет токен с помощью API. он работает нормально, но я также хочу отловить ошибку, если по какой-то причине обновление токена API также не удается, здесь код 

@Injectable()
export class TokenInterceptor implements HttpInterceptor {

    constructor(private authService: AuthService) { }

    isRefreshingToken: boolean = false;
    tokenSubject: BehaviorSubject<string> = new BehaviorSubject<string>(null);

    intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpSentEvent | HttpHeaderResponse | HttpProgressEvent | HttpResponse<any> | HttpUserEvent<any> | any> {

        return next.handle(this.addTokenToRequest(request, this.authService.getJWT()))
            .pipe(
                catchError(err => {
                    if (err instanceof HttpErrorResponse) {
                        switch ((<HttpErrorResponse>err).status) {
                            case 401:
                                return this.handle401Error(request, next);
                            case 400:
                                return <any>this.authService.logout();
                        }
                    } else {
                        return throwError(err);
                    }
                }));
    }

    private addTokenToRequest(request: HttpRequest<any>, token: string): HttpRequest<any> {
        return request.clone({ setHeaders: { Authorization: `Bearer ${token}` } });
    }

    private handle401Error(request: HttpRequest<any>, next: HttpHandler) {

        if (!this.isRefreshingToken) {
            this.isRefreshingToken = true;

            // Reset here so that the following requests wait until the token
            // comes back from the refreshToken call.
            this.tokenSubject.next(null);

            return this.authService.refreshToken()
                .pipe(
                    switchMap((refreshToken: any) => {
                        console.log('here');
                        if (refreshToken) {
                            this.tokenSubject.next(refreshToken.token);
                            this.authService.setJWT(refreshToken.token);
                            this.authService.setRefreshToken(refreshToken.refreshToken);
                            // localStorage.setItem('currentUser', JSON.stringify(user));
                            return next.handle(this.addTokenToRequest(request, refreshToken.token));
                        }else{

                        }

                        return <any>this.authService.logout();
                    }),
                    catchError(err => {
                        console.log('here', err);
                        return <any>this.authService.logout();
                    }),
                    finalize(() => {
                        console.log('here');
                        this.isRefreshingToken = false;
                    })
                );
        } else {
            this.isRefreshingToken = false;

            return this.tokenSubject
                .pipe(filter(token => token != null),
                    take(1),
                    switchMap(token => {
                        return next.handle(this.addTokenToRequest(request, token));
                    }));
        }
    }
}

уведомление в строке, где вызывается return this.authService.refreshToken(), не доходит до catchError, если refreshToken() не удается

Я понимаю, что он может достигнуть catchError только тогда, когда исходный запрос потерпит неудачу. поэтому в сервисе я попытался отловить ошибку из обновления API токена, код ниже: 

refreshToken(): Observable<any> {
    let jwt = this.getJWT();
    let refreshToken = this.getRefreshToken();

    debugger;
    return this.http.post<any>(this.api.REFRESH_TOKEN, { refreshToken: refreshToken, expiredToken: jwt })
      .pipe(
        map(result => {
          console.log('here');
          debugger;
          return result;
        }),
        catchError(e => {
          debugger;
          console.log(e, 'here');
          return null;
        })
      );
  }

он даже не достигнет этой точки, если API-интерфейс обновления токена завершится неудачно, мой вопрос заключается в том, как отловить ошибку из API-интерфейса обновления токена и перенаправить пользователя на вход в систему. Спасибо.

1 Ответ

1 голос
/ 01 июля 2019

Вы должны переместить свой блок catchError в switchMap, это не очень хороший метод обработки ошибок, чтобы поместить catchError на первый уровень канала Observable, если catchError на первомуровень метода Observable pipe, оператор finalize будет называться 

.pipe(switchMap((refreshToken: any) => {
      console.log('here');
      if (refreshToken) {
       this.tokenSubject.next(refreshToken.token);
       this.authService.setJWT(refreshToken.token);
       this.authService.setRefreshToken(refreshToken.refreshToken);
       // localStorage.setItem('currentUser', JSON.stringify(user));
       return next.handle(this.addTokenToRequest(request, refreshToken.token)).pipe(
           catchError(err => {
               console.log('here', err);
               return <any>this.authService.logout();
            })
       );
     }
     else{}

     return <any>this.authService.logout();
}),

 finalize(() => {
 console.log('here');
 this.isRefreshingToken = false;
})
...