Angular HttpClient 错误处理困难答案

【问题标题】：Angular HttpClient error handling difficultAngular HttpClient 错误处理困难
【发布时间】：2018-06-26 23:14:13
【问题描述】：

关于新 HttpClient 的 Angular 文档 https://angular.io/guide/http 有一个“获取错误详细信息”部分，其中显示了如下示例。我已经修改了 cmets 以记录我的观察结果，哪些基本错误类最终会出现在哪里。

http
.get<ItemsResponse>('/api/items')
.subscribe(
  data => {...},
  (err: HttpErrorResponse) => {
    if (err.error instanceof Error) {
      // we never seem to get here
      console.log('An error occurred:', err.error.message);
    } else {
      // no network connection, HTTP404, HTTP500, HTTP200 & invalid JSON
      console.log(`Backend returned code ${err.status}, body was: ${err.error}`);
    }
  }
);

因此，至少 3 种完全不同的错误类别（网络、http、响应解析）出现在单个通道中，并且对于每种类型，都必须在 HttpErrorResponse 的另一部分中搜索实际原因。

一个只能识别一个类别，通过标准错误代码的HTTP错误。但是其他两种呢？

当我拔下我的网络插头时，我得到了非常有说服力的 err.message = "Http failure response for (unknown url): 0 Unknown Error."非常具有描述性。

当新的内部 JSON 解析失败时，它表示存在语法错误 - 但不是在哪个位置/字符（由 JSON.parse() 返回）。另见here

超时等其他错误呢？

我在哪里可以找到这方面的文档？有没有人想出一种方法来对此进行普遍分析，以便向用户提供有意义的信息？

Win 上 Chrome 中的 Angular 5.2，后端：ASP.NET4.6.1 纯 IHttpHandler

【问题讨论】：

标签： json angular error-handling httpclient

【解决方案1】：

我不得不查看Angular source code 以了解可能的错误情况。错误对象将始终为HttpErrorResponse，但其error 属性可能因情况而异。以下是使用默认XHRBackend 和'json' 的默认responseType 时可能发生的情况：

收到的响应带有指示错误的 HTTP 状态代码（不是 200-299）：

HttpErrorResponse.error 将是解析为 JSON 的正文或如果解析失败，则将正文作为文本。

收到带有良好 HTTP 状态代码 (200-299) 的响应，但正文无法解析为 JSON：

HttpErrorResponse.error 将是一个类型为 HttpJsonParseError 的对象，具有两个属性：

error：解析错误（Error 类型）
text：正文

由于 XHR 网络错误而未收到响应：

HttpErrorResponse.error 将是一个 XHR ProgressEvent，类型设置为 'error'。（在旧版本的 TypeScript 中，它可能被错误地键入为 ErrorEvent。）

注意：Angular 在发出请求时不会设置超时，也不会注册超时事件处理程序。默认 XHR 超时为 0，因此请求永远不会在客户端超时。

【讨论】：

谢谢 eppsilon。非常详尽的答案。部分由于错误处理的不透明性，我同时切换到了裸 async .. await fetch() 并对此感到满意。