Angular HttpClient获取正确错误码：如何捕获ERR_CONNECTION_REFUSED

我来帮你梳理这个问题的原因和解决方案：

一、net::ERR_CONNECTION_REFUSED提示的来源 #

这个提示是浏览器的网络层直接输出的，并不是你的console.log(error)打印的。

当API宕机、连接被拒绝时，浏览器底层的XMLHttpRequest（Angular HttpClient就是基于这个API实现的）无法建立有效的HTTP连接，浏览器会直接在控制台输出这个原生的网络错误日志——这属于浏览器的默认行为，和Angular的代码逻辑无关。

而你通过console.log(error)打印的HttpErrorResponse，是Angular对这个原生网络错误的包装：因为没有从服务器拿到任何HTTP状态码（连连接都没建立），所以Angular只能返回status: 0和statusText: "Unknown Error"。

二、如何在组件中获取该错误的详细信息 #

虽然Angular包装后的错误看起来信息有限，但你可以从HttpErrorResponse的error属性或message字段中提取到和浏览器提示对应的错误描述。

修改你的组件订阅代码如下：

this.myServive.getDocument(myValue).subscribe(
  response => { console.log('请求成功:', response); },
  error => {
    console.log('Angular捕获的错误:', error);
    // 针对网络连接类错误的处理
    if (error.error instanceof ProgressEvent) {
      // 这里的error.message会包含浏览器的错误描述，比如Chrome中会显示类似"Http failure response for http://localhost.../documents/123: 0 Unknown Error"
      // 如果你需要更精准的判断，可以结合message内容或其他属性
      console.log('网络连接错误详情:', error.message);
      
      // 也可以通过检查error.name来确认错误类型
      if (error.name === 'HttpErrorResponse' && error.status === 0) {
        console.log('推测为连接被拒绝或网络不可用');
      }
    }
  }
);

需要注意的是：不同浏览器对这个错误的描述格式可能略有差异，但核心信息（比如连接被拒绝）都会包含在message字段里。另外，浏览器本身输出的net::ERR_CONNECTION_REFUSED提示是无法通过Angular代码屏蔽的，这是浏览器的原生日志行为。

内容的提问来源于stack exchange，提问作者tweetysat