为何window.addEventListener("error")有时仅返回"Script error."无详细信息?
问题描述
我最初以为这只是Chrome的bug,但在Firefox中测试后发现也有类似怪异行为,甚至event.message里都是一模一样的"Script error."字符串,所以我怀疑这是不是和规范相关的问题。
我原本以为下面代码里的每个测试(我故意给构造函数传无效值)都应该在window.addEventListener("error", ...)处理器中生成相同的ErrorEvent(只有行号等信息不同),但正如代码块注释所示,它们的表现各不相同。
<script> window.addEventListener("error", function(e) { console.error("window error handler:", e); }) </script> <!-- 注:这是https://codemirror.net/codemirror.js的不可变快照,txt扩展名不影响问题,用js扩展名也会出现同样情况,只是因为github不允许上传js文件才用了txt --> <script src="https://github.com/user-attachments/files/17729754/codemirror6-november-13-2024.txt"></script> <script> let { EditorView } = CM["@codemirror/view"]; </script> <script> new EditorView(null); // 示例1:仅返回"Script error." </script> <script type="module"> new EditorView(null); // 示例2:仅返回"Script error." </script> <script type="module"> await new Promise(r => setTimeout(r, 10)); new EditorView(null); // 示例3:仅返回"Script error." </script> <script> (async function() { new EditorView(null); // 示例4:完全没有触发window错误事件?? })(); </script> <script type="module"> let { EditorView } = await import("https://esm.sh/@codemirror/view@6.4.1"); new EditorView(null); // 示例5:✅ 生成带有实际错误信息的错误事件 </script> <!-- 注:这里用了data url,但我测试过用实际服务器托管文件也会得到相同结果 --> <script src="data:text/plain,window.foo=function(a){a.b.c}"></script> <script> foo(1); // 示例6:✅ 生成带有实际错误信息的错误事件 // 补充:在Firefox中,这个data URL版本会返回"Script error.",但换成服务器URL版本后,行为和Chrome一致。 // Chrome在两种情况下都能给出"正确"的结果。 </script>
说明
- 我最初以为这和模块脚本有关,但最后一个例子说明并非如此。
- 我曾猜测示例4可能需要
window.addEventListener("unhandledrejection", ...)处理器,但尝试后并没有收到任何事件。 ErrorEvent还包含filename属性,可以指出引发错误的脚本(但没有行号、调用栈等信息)。
额外背景
我正在开发一款开发者工具,通过监听页面上的错误事件帮助开发者理解错误的原因和来源。我无法控制页面上的代码,因此需要无需改写代码就能获取错误详情的方案。
因此,“你只需避免以XYZ形式编写代码/导入”这类方案对我来说并不适用。
补充说明
(加粗仅为便于快速浏览,并非强调)
- 相关内容指出这可能是跨域脚本加载时的安全考量。但奇怪的是,有回答显示,即使示例中的github.com脚本没有合适的CORS头,给脚本添加
defer属性仍能访问错误消息(因此并非defer默认使用crossorigin)。
内容的提问来源于stack exchange,提问作者joe
相关产品推荐
相关产品推荐

