Angular6 - GET net::ERR_CONNECTION_REFUSED 的 HttpClient 错误处理

Posted 2023-02-24

【中文标题】Angular6 - GET net::ERR_CONNECTION_REFUSED 的 HttpClient 错误处理

【英文标题】：Angular6 - HttpClient error handling of GET net::ERR_CONNECTION_REFUSED

【发布时间】：2019-05-21 08:51:12

【问题描述】：

在使用 HttpClient 的 Angular6 中，是否有办法捕获 GET net::ERR_CONNECTION_REFUSED 错误/异常？对于典型的 http 请求，我通常会看到 HttpErrorResponse 类型的单个错误/异常......例如，404 Not Found。但是，对于某些不存在端口或远程服务以及网络问题的 http 请求，我在浏览器控制台中看到 2 个错误/异常：

a.) GET https://localhost:8443/sb-template/status-routes net::ERR_CONNECTION_REFUSED ...

然后是我的代码捕获的第二个：

b.) HttpErrorResponse headers: HttpHeaders, status: 0, statusText: "Unknown Error", url: null, ok: false, ...

因此，我可以轻松地捕获/捕获显示第二个错误 HttpErrorResponse 的内容。但是无论如何要捕获/捕获初始错误...

这里的原因是第二个错误 (HttpErrorResponse) 中的消息，非常通用且显示很少： Http failure response for (unknown url): 0 Unknown Error...这可能来自任何数量的问题。

但如果我可以捕获/捕获初始错误...特别是 net::ERR_CONNECTION_REFUSED，这将提供有关可能端口或远程服务关闭的更重要信息。

【问题讨论】：

控制台日志详细信息基于发出它的响应浏览器。您只需根据状态码处理 HttpErrorResponse。

好的，很高兴知道。所以状态码是 0（零）。那么 0 是否表示没有打开端口和/或 URL 资源不可用？还是因为 URL 没有响应，所以状态永远不会设置？

【参考方案1】：

Chromium 网络错误代码列表可以使用chrome://network-errors/ 检查。控制台日志错误代码详细信息由 chrome 浏览器发出。您只需要处理 HttpErrorResponse 并根据状态码设置错误消息。

由于 chrome adblocker 或无效的身份验证 /cert 详细信息或 CORS 问题，可能会返回状态代码零。如果您有权访问服务器 api，则为响应标头设置以下属性，该属性允许服务器接受请求，即使请求来自不同的来源。

Access-Control-Allow-Headers: Content-Type
Access-Control-Allow-Methods: POST, GET, OPTIONS, DELETE
Access-Control-Allow-Origin: *

[*] 启用来自任何地方的跨源请求。这可以限制在特定域或请求的来源。 request.getHeader("Origin")

【讨论】：

我在 Spring Boot 的微服务控制器中添加了 CORS，但没有任何效果，所以可能是 Chrome 阻止了状态码通过。我需要深入研究，但现在，我只需要忍受这个并“假设” status-code=0 是一个网络问题。泰！

如果状态码=0，您将如何获得角度导航到前端的 404 未找到页面/组件。 this.router.navigate 似乎对我不起作用。 @nayakam

@Daybreak status-code = 0 表示由于网络错误，请求在得到响应之前被取消。主要是由于 CORS 问题。

【参考方案2】：

状态代码 0 表示尚未发出请求，这通常是 CORS OPTIONS 调用失败，并且由于这是在 javascript 域之外处理的，因此无法获得详细信息。由于您的错误是 GET 请求，我不确定这是否完全相同，但对于 OPTIONS angular 没有额外的详细信息。