是否有一种全局方法来捕获 javascript 中的网络错误

Posted 2023-03-12

【中文标题】是否有一种全局方法来捕获 javascript 中的网络错误

【英文标题】：Is there a global approach to catch network errors in javascript

【发布时间】：2013-10-06 13:35:03

【问题描述】：

我正在研究通过 javascript 自动检测页面错误的可能性。我发现了几个问题，其中的答案允许您通过window.onerror 全局捕获 Javascript 编译和运行时错误，但没有答案提及浏览器错误控制台中经常报告的其他类型的非 Javascript 错误。我主要对网络错误（无效 URI、SSL 错误、HTTP 错误、超时）和资源解释错误（导致资源解释中止、加载资源解析错误等的类型不匹配）感兴趣。

我检查了performance.getEntries 方法，但我很困惑地发现它似乎不包含导致错误的网络请求（我只在 Chrome 29 中检查...）

我不需要完全的跨浏览器兼容性。只要它适用于某些浏览器，并且不会破坏其他浏览器，就可以了。

【问题讨论】：

我认为它们中的大多数只是javascript无法检测到的警告，因为给出了正常的结果。但是，您可以将自己的处理程序添加到每个请求并手动检查这些内容。

也许可以使用服务人员来做到这一点？

performance.getEntries() 似乎确实返回了失败的网络请求，但没有什么可以将它们与成功的网络请求区分开来。 （见this issue）

【参考方案1】：

window.onerror 处理程序在 Chrome 13+、Firefox 6.0+、Internet Explorer 5.5+、Opera 11.60+ 和 Safari 5.1+ 中捕获 Javascript 错误。 已经有一个 really good answer on *** 提供了很多关于它的信息。不过，它不会捕获资源加载失败。

就其他元素（如图像）而言，jQuery 提供了一个.error() 方法来附加错误事件处理程序，以在图像或外部脚本加载失败时提醒用户。如果您不能使用 jQuery，那么另一种选择是通过 XMLHttpRequest 预加载所有图像/外部资源并监听请求的 status（HTTP 响应代码）（200 OK 或 304 Not Modified 以外的任何内容）是你想要返回错误的东西）。这样做的缺点是，由于必须在页面完全加载之前附加事件处理程序等，因此禁用 JavaScript 的任何人都将看到一个零散的、可能是空白的页面。

无效的 URI 和 HTTP 错误最好在服务器端处理。格式良好的 .htaccess 文件，结合 Apache 的 mod_rewrite（或等效文件）可以为服务器的错误请求提供大量缓冲。

【讨论】：

不幸的是，第二段中提到的方法根本不是全局的，您将不得不重写整个站点。无效的 URI 不能在服务器端处理，因为 URI 无效并且永远不会发送到服务器。如果您拥有服务器，则可以监控 HTTP 错误，但如果您想检查加载第 3 方资源的错误怎么办...

@FabioBeltramini：您不需要重写整个站点。您只需在它前面添加一个脚本，该脚本拦截对本机函数的所有调用 (example)，并监视所有添加到 DOM 的资源。您可以动态添加错误处理程序，而无需接触您的代码。

我认为你根本不需要 jQuery。您可以在

【参考方案2】：

不，我还没有找到一个全局方法，也许除了服务人员。

（请注意，window.onerror 仅捕获 Javascript 中抛出的错误，例如，它不会捕获从 <script src="misspelling.js"></script> 元素加载资源的失败。）

相反，您可以为每个加载资源的元素添加onerror 属性，但您需要在服务器发送的 html 中执行此操作：

<script src="misspelling.js" onerror="alert('js')"></script>
<img src="misspelling.jpg" onerror="alert('img')">
<link rel="stylesheet" href="mispelling.css" onerror="alert('css')">

【讨论】：

如果你在HTML中设置了onerror="throw this"属性，现在你已经将网络错误转换为Javascript错误，可以在window.onerror中捕获。