角度拦截http错误

Question

我想拦截每个请求和错误响应。

我已经可以拦截请求并在标头中设置令牌，并且可以拦截响应以处理刷新令牌。

但是我找不到拦截HttpErrorResponse的方法。

我尝试了两种方法。一个带有显式 rxjs catchError，另一个带有某种回调：

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    const authToken = this.auth.getToken();
    if (authToken) {
      req = req.clone({ headers: req.headers.set('accesstoken', authToken) });
    }
    return next.handle(req).pipe(
      map((event: HttpEvent<any>) => {
        if (event instanceof HttpResponse) {
          //handle refresh token
        }
        return event;
      },
      catchError((error: any) => {
        if (error instanceof HttpErrorResponse) {
          console.log(error);
          return Observable.throw(error);
        }
      })));
  }

如果我有一个过期的令牌，每个请求都会抛出一个 HttpErrorResponse 但这个解决方案没有捕获它。

这是由服务返回的。拦截器没有 console.log() 的迹象。

服务如下所示：

public getData(): Observable<any> {
    return this.http
        .get<any>(url)
        .pipe(
            map(res => {
                return res;
            }),
            catchError((e): Observable<any> => {
                console.log(e);
                const res: any = {error: e};
                return of(res);
            })
        );
}

然后我尝试了“回调语法”：

return next.handle(req).pipe(
  map((event: HttpEvent<any>) => {
    if (event instanceof HttpResponse) {
      // refresh token
    }
    return event;
  }, (error: any) => {
    if (error instanceof HttpErrorResponse) {
      console.log(error);
    }
  }));

结果与上面相同。控制台中没有任何内容。

我看到有人 (https://medium.com/@aleixsuau/error-handling-angular-859d529fa53a) 在模块中注册了一个 ErrorHandler，但我还没有尝试过。

如何从拦截器中捕获 HttpErrorResponse？

编辑：

我已经尝试过 ErrorHandler 的方式，但仍然无法获取任何日志。然后我从我的服务中删除了catchError，最后记录了一些东西......

我会尝试看看这是否使拦截器工作......如果我必须删除所有我的 catchError 不好玩:(

我在这里做了一个可重现的例子：https://stackblitz.com/edit/angular-m2jc9n

Answer 1

Angular 有一个用于错误处理的钩子 (https://angular.io/api/core/ErrorHandler)。

您可以创建一个实现 angular ErrorHandler 并实现 handleError 方法的服务，您可以在其中记录所有错误。这个错误处理程序不仅会记录 HttpErrorResponse，还会记录所有错误，但您可以过滤掉您需要的错误。

@Injectable()
export class CustomErrorHandler implements ErrorHandler {
    private static isHttpErrorResponse(error): error is HttpErrorResponse {
        return error instanceof HttpErrorResponse;
    }

    handleError(error: any): void {
        if (CustomErrorHandler.isHttpErrorResponse(error)) {
            console.log(error);
        }
    }
}