html5中window.onerror无法捕获web worker错误,因worker运行在独立线程;需在worker内用self.addeventlistener('error')或'onerror'捕获,并通过postmessage上报主线程处理。

HTML5 中主线程的 window.onerror 默认**无法捕获**后台脚本(如 Web Worker 中)抛出的错误。
主线程 onerror 的作用范围有限
window.onerror 只监听当前 JavaScript 执行环境(即主线程)中未被捕获的同步错误、异步错误(如 setTimeout、Promise 拒绝但未加 .catch)以及资源加载失败(如 script、img 404)。它对 Web Worker 内部发生的错误完全不可见,因为 Worker 运行在独立的全局上下文和线程中,与主线程隔离。
Worker 错误需在 Worker 内部自行捕获
要在 Worker 中捕获错误,必须在其脚本内部使用:
-
self.onerror:捕获同步错误和未处理的异步错误(类似主线程的window.onerror) -
self.addEventListener('error', handler):等价于self.onerror,推荐用事件监听方式 -
self.addEventListener('messageerror', handler):捕获反序列化失败类错误(如传入非法对象)
例如,在 worker.js 中:
self.addEventListener('error', (e) => {
console.error('Worker error:', e.message, e.filename, e.lineno);
// 可通过 postMessage 主动上报给主线程
self.postMessage({ type: 'worker-error', data: e });
});
主线程可接收 Worker 主动上报的错误
Worker 本身不能触发主线程的 onerror,但可通过 postMessage 将错误信息发送回主线程,由主线程监听 worker.onmessage 处理:
- 主线程创建 Worker 后,绑定
worker.addEventListener('message', ...) - Worker 在捕获到错误后调用
self.postMessage({ type: 'error', ... }) - 主线程解析消息,按需记录、告警或降级
这是一种显式、可控的跨线程错误传递机制,而非自动捕获。
注意 Promise 拒绝在 Worker 中的特殊性
Worker 中未处理的 Promise.reject() 不会触发 self.onerror(除非开启 self.addEventListener('unhandledrejection', ...))。现代 Worker 支持该事件:
-
self.addEventListener('unhandledrejection', e => { ... })可捕获未catch的 Promise 错误 - 该事件需显式注册,不默认启用
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!










