必须加crossorigin属性且服务端返回匹配的Access-Control-Allow-Origin响应头,onerror才能获取完整错误信息;否则仅显示“Script error.”,filename和lineno为空。

crossorigin 属性不加,onerror 只能拿到 "Script error."
浏览器出于安全限制,跨域脚本出错时默认屏蔽详细信息,window.onerror 收到的 message 固定是 "Script error.",filename 和 lineno 也为空。这不是 bug,是规范行为。
必须同时满足两个条件才能解锁详细错误:
- 脚本标签加上
crossorigin属性(值可以是"anonymous"或"use-credentials") - 服务端响应头中包含
Access-Control-Allow-Origin(且不能为*,当使用use-credentials时还必须带Access-Control-Allow-Credentials: true)
用 crossorigin="anonymous" 是最常用且安全的选择
crossorigin="anonymous" 表示不发送 Cookie 和认证凭据,服务端只需返回 Access-Control-Allow-Origin: https://your-site.com(明确指定源,不能用 *),就能让 onerror 拿到完整错误信息。
示例写法:
立即学习“前端免费学习笔记(深入)”;
<script src="https://cdn.example.com/app.js" crossorigin="anonymous"></script>
对应服务端响应头需包含:
Access-Control-Allow-Origin: https://your-site.com
注意:Access-Control-Allow-Origin: * 在 crossorigin 存在时无效 —— 浏览器会直接拒绝暴露错误详情。
crossorigin="use-credentials" 要求更严格,慎用
如果脚本依赖 Cookie 或 HTTP 认证(比如内部 CDN 需要登录态),才考虑 crossorigin="use-credentials"。此时服务端必须同时返回:
-
Access-Control-Allow-Origin: https://your-site.com(仍不能是*) Access-Control-Allow-Credentials: true
漏掉任一,脚本加载失败或错误仍被屏蔽。而且 onerror 的 colno 和 error 对象(如堆栈)依然可能为空 —— 这取决于浏览器和资源是否支持 Source Map 及 CORS 共享。
onerror 回调里怎么取到真正的错误信息?
加了正确配置后,window.onerror 的参数顺序是:(message, source, lineno, colno, error)。其中 error 是 Error 实例,可读取 error.stack;source 是脚本 URL;lineno/colno 是真实位置。
典型注册方式:
window.onerror = function(message, source, lineno, colno, error) {<br> console.log('Real error:', error?.stack || message);<br> console.log('At:', source, 'line', lineno, 'col', colno);<br> return false; // 阻止默认错误提示<br>};
注意:如果脚本本身有 try/catch 或 catch 了 Promise rejection,这些不会触发 onerror —— 它只捕获未处理的同步脚本错误和跨域脚本加载/执行异常。
真正容易被忽略的是:哪怕所有配置都对,Chrome 有时仍不暴露 error 对象里的 stack(尤其压缩后无 Source Map),这时只能靠 message + lineno 定位,别指望它总等于本地开发环境的表现。



















