Angular HttpClient错误处理困难

Question

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

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失败响应：0未知错误。”非常具有描述性。

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

那么其他错误如超时等呢？

我在哪里可以找到关于此的文档？有没有人想出一种方法来进行一般分析，这样可以给用户提供有意义的信息？

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

Answer 1

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

收到响应，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，因此请求永远不会超出客户端。

Answer 2

This might help you

private handleError(err: HttpErrorResponse) {
    let errorMessage = '';
    if (err.error instanceof Error) {
        // A client-side or network error occurred. 
        errorMessage = `An error occurred: ${err.error.message}`;
    } else {
        // The backend returned an unsuccessful response code.
        // The response body may contain clues as to what went wrong,
        errorMessage = `Server returned code: ${err.status}, error message is: ${err.message}`;
    }
    console.error(errorMessage);
    return Observable.throw(errorMessage);
}