Как мне заставить этот ответный перехватчик работать в Angular? - PullRequest
0 голосов
/ 02 марта 2019

У меня есть следующий код для HttpInterceptor, но я не могу заставить его часть перехватчика ответа работать:

import { Injectable } from '@angular/core';
import {HttpErrorResponse, HttpEvent, HttpHandler, HttpInterceptor, HttpRequest, HttpResponse} from '@angular/common/http';
import { Observable } from 'rxjs';
import { UserService } from './user.service';
import { tap, map } from 'rxjs/operators';


@Injectable()
export class CustomHttpInterceptor implements HttpInterceptor {
  constructor(private user: UserService) {}

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    if (!localStorage.getItem('token')) {
      const modified = req.clone();
      return next.handle(modified)
        .pipe(
          tap(event => {
            if (event instanceof HttpErrorResponse) {
              if (event.status === 401) {
                this.user.logout();
              }
            }
          })
        );
    } else {
      const modified = req.clone({setHeaders: {'Authorization': 'JWT ' + localStorage.getItem('token')}});
      return next.handle(modified)
        .pipe(
          tap(event => {
            if (event instanceof HttpErrorResponse) {
              if (event.status === 401) {
                this.user.logout();
              }
            }
          })
        );
    }

  }
}

Часть, где он обрабатывает ответ, не работает.В основном я пытаюсь проверить, был ли возвращен 401, а затем автоматически выйти из системы, если был 401.

1 Ответ

0 голосов
/ 02 марта 2019

Вам нужно будет использовать catch, чтобы специально перехватить ответ об ошибке.

RxJS 5 и ниже (или RxJS 6+ с rxjs-compact, установленным для совместимости):

next.handle(modified).catch(errorResponse => { 
  // do something
})

RxJS 6+ без rxjs-compact:

catch было удалено, поскольку это зарезервированное ключевое слово в JS.

next.handle(modified).pipe(
  catchError(errorResponse => { 
  // do something
  }))

Или, если вы все еще хотите использовать pipeи tap, tap имеет три необязательных параметра: следующий обратный вызов, обратный вызов ошибки и полный обратный вызов.

next.handle(modified).pipe(
  tap(
    event => { 
      if (event instanceof HttpResponse)
        console.log('request succeeded');
    },
    error => {
      if (error instanceof HttpErrorResponse) {
        console.log('request failed');
      }
    }
  ));
...