Angular：拦截 HTTP 错误并继续链

我想将某些 HTTP 错误代码视为非错误，并正常处理它们的响应。所以我尝试添加一个HttpInterceptor捕获 500 个状态代码，并返回原始响应（Angular 将其放入error.error):

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    return next.handle(req).pipe(
      catchError((error: HttpErrorResponse) => {
        if (error.status === 500) {
          return of(error.error);
        } else {
          return throwError('server error');
        }
      })
    );
  }

但是，如果出现错误，我通过管道传输到 http 请求的任何内容都不会被执行。例如，如果我这样做，日志语句就不会发生：

this.http.get(...).pipe(
  tap(console.log)
)

我怎样才能做到这一点？

这是一个sample https://stackblitz.com/edit/call-http-request-in-angular-6-kuuuof...它从不记录 AppComponent 的“得到结果”。

自 Angular http 模块以来，您的链停止工作filters https://github.com/angular/angular/blob/698b0288bee60b8c5926148b79b5b93f454098db/packages/common/http/src/client.ts#L510从拦截器收到的消息：

const res$: Observable<HttpResponse<any>> = <Observable<HttpResponse<any>>>events$.pipe(
        filter((event: HttpEvent<any>) => event instanceof HttpResponse));

正如你所看到的，你应该返回流HttpResponse类如：

import { HttpResponse, ... } from '@angular/common/http';
...

if (error.status === 404) {
  console.log('caught', error.error);

  return of(new HttpResponse({
    body: error.error
  }));
}

叉式堆栈闪电战 https://stackblitz.com/edit/call-http-request-in-angular-6-fx9sxj?file=src%2Fapp%2Ferror-interceptor.ts