JS 中怎么监听 Worker 线程的 error 事件捕获脚本异常-js教程-PHP中文网

主线程的 worker.onerror 只能捕获初始化类错误，无法捕获 worker 内部运行时 js 错误；后者需在 worker 内用 self.onerror 或 try/catch + postmessage 主动捕获并结构化传递。

js 中怎么监听 worker 线程的 error 事件捕获脚本异常

主线程中监听 Worker 的 error 事件，只能捕获 Worker 初始化失败、脚本加载失败、解析错误等底层异常，**无法捕获 Worker 内部运行时抛出的 JS 错误（比如 ReferenceError、TypeError）**。这类运行时异常默认不冒泡，必须在 Worker 内部主动捕获并显式传出来。

主线程：监听 worker.onerror 处理初始化类错误

适用于脚本未找到、语法错误、CORS 加载失败等场景：

chartjs-reporter

此技能用于在用户需要将结构化数据（查询结果、CSV 摘要、JSON 记录或 Python 字典/列表）转换为独立的 HTML 页面时使用。

下载

使用 worker.onerror 或 worker.addEventListener('error', ...)
该事件的 event 对象包含 filename、lineno、message 等基础信息，但没有完整 Error 实例
示例：

const worker = new Worker('worker.js');
worker.onerror = function(e) {
  console.error('Worker 加载/初始化失败:', {
    message: e.message,
    filename: e.filename,
    lineno: e.lineno
  });
};

Worker 内部：必须主动捕获运行时异常

因为 Worker 没有 window，不能用 window.onerror，应使用以下方式之一：

全局 self.onerror：捕获同步错误和未处理的异步错误（如定时器、fetch 回调中抛出的异常），返回 true 可抑制控制台输出
显式 try/catch + postMessage：对关键逻辑块包裹，更可控；推荐在入口逻辑、onmessage 处理函数中使用

// worker.js
self.onerror = function(message, filename, lineno, colno, error) {
  self.postMessage({
    type: 'error',
    payload: {
      name: error?.name || 'Error',
      message: error?.message || message,
      stack: error?.stack,
      filename,
      lineno,
      colno,
      timestamp: Date.now()
    }
  });
  return true;
};

主线程：接收并区分错误消息

Worker 内部发来的错误需通过 message 事件接收，再根据约定格式识别处理：

统一用 { type: 'error', payload: {...} } 结构发送，避免与业务消息混淆
收到后可新建 Error 实例辅助调试（虽无法还原原始堆栈帧，但保留关键字段）
示例：

worker.onmessage = function(e) {
  if (e.data.type === 'error') {
    const { payload } = e.data;
    const err = new Error(payload.message);
    err.name = payload.name;
    err.stack = payload.stack;
    err.filename = payload.filename;
    console.error('Worker 运行时错误:', err);
    // 上报监控系统、触发告警等
  } else {
    // 处理正常业务消息
  }
};