Chrome 扩展：如何 trap/handle 全局内容脚本错误？

Question

在 Chrome 扩展中，有没有办法全局 trap/handle Javascript 发生在内容脚本中的错误？（例如用于提交给 Javascript 错误跟踪服务，例如 bugsnag)

理想情况下，我会在内容脚本的顶部设置一个全局 window.onerror 处理程序。但它在 Chrome 40 中无法正常工作：错误被捕获，但提供的信息是无用的：'Script error' 的消息并且没有 url、lineNumber、column 或带有堆栈的错误对象。

我创建了一个测试扩展来显示内容脚本的这种破坏行为。详情如下。有趣的发现：

window.onerror 在后台脚本中正常工作，有完整的错误信息
window.onerror 也可以 see the error thrown by an extension content script （但错误也不包含任何有用的信息）

为 Chrome 扩展内容脚本重现被破坏的 window.onerror。

在新文件夹中，创建 manifest.json、content-script.js 和 background-script.js。然后通过 Window > Extensions > Load unpacked Extension.

加载到 Chrome

要查看内容脚本错误的破坏 window.onerror 信息，请重新加载网页并查看 devtools 控制台

manifest.json

{
    "name": "Chrome extension content-script errors test",
    "manifest_version": 2,
    "version": "0.0.1",
    "background": {
      "scripts": [ "background-script.js" ]
    },
    "content_scripts": [{
        "matches": ["<all_urls>"],
        "js": ["content-script.js"]
    }]
}

内容-script.js

window.onerror = function (errorMsg, url, lineNumber, column, errorObj) {
    console.log('Caught content script error');
    console.log('errorMsg: ' + errorMsg);
    console.log('url: ' + url);
    console.log('lineNumber: ' + column);
    console.log('column: ' + column);
    console.log('errorObj follows:');
    console.log(errorObj);
    return true;
};

console.log('I am a content script, about to throw an error');
throw new Error('Is this error caught?');

背景-script.js

window.onerror = function (errorMsg, url, lineNumber, column, errorObj) {
    console.log('Caught background script error');
    console.log('errorMsg: ' + errorMsg);
    console.log('url: ' + url);
    console.log('lineNumber: ' + column);
    console.log('column: ' + column);
    console.log('errorObj follows:');
    console.log(errorObj);
    return true;
};

//To see nice window.onerror behaviour for background script..
//Uncomment 2 lines below, reload extension, and look at extension console
//console.log('I am a background script, about to throw an error');
//throw new Error('Is this error caught?');

Answer 1

查看 TraceKit，这是我们在公司使用的所有前端错误记录。如果您将它与 javascript 客户端库结合使用以获取您最喜欢的日志记录服务，那么您就大功告成了。

Answer 2

问这个问题 5 个月后，我现在非常确信目前没有一种简单的方法来解决内容脚本中发生的全局 trap/handle Javascript 错误。因此，

我创建了一个 Chrome 错误报告：window.onerror should contain useful info for thrown error in extension content script。欢迎提出有用的意见。
如果您需要全局捕获内容脚本错误，最好的办法是假设 window.onerror 目前在内容脚本中被破坏。相反，将所有 Javascript 代码包装在 try-catch 块中，这样您就可以访问有用的错误信息。这比听起来更棘手，因为您必须同时处理同步代码（简单）和异步回调代码（更棘手）。先看看这个article，祝你好运！

Answer 3

在 https://github.com/barbushin/javascript-errors-notifier/blob/master/content.js - it's source code of JavaScript Errors Notifier 扩展中查看 Chrome 扩展内容脚本最完整的错误处理。

Chrome 扩展：如何 trap/handle 全局内容脚本错误？

Chrome extension: how to trap/handle content-script errors globally?

javascript

google-chrome

google-chrome-extension

为 Chrome 扩展内容脚本重现被破坏的 window.onerror。

manifest.json

内容-script.js

背景-script.js