Worker 错误、取消与回收

本节把 Worker 的正常消息、脚本异常和主动终止分成三条可观察路径。

const worker = new Worker('worker.js')
worker.addEventListener('message', event => console.log('result', event.data))
worker.addEventListener('error', event => console.log('worker error', event.message))
worker.postMessage({ type: 'run' })

把 worker.js 中的一行改成语法错误观察 error，再调用 worker.terminate() 验证终止后不再收到结果。

机制拆解

Worker 错误有三条责任链：脚本加载/执行错误走 error，协议级失败走 message 中的错误类型，页面离开时由创建者调用 terminate()。只有监听 error 不足以判断业务失败是否已回复。

边界与失败路径

• 所有权：监听器、observer、worker、连接、缓存和焦点都有创建者与释放时机；页面隐藏、路由离开和元素移除时都要验证。
• 宿主差异：SSR、Web Worker、Shadow DOM、跨文档、跨源和辅助技术不会共享同一套全局对象与事件路径。
• 错误分类：取消、超时、权限拒绝、协议错误、配额不足和浏览器不支持应分别进入可观察状态。
• 安全边界：用户输入、URL、HTML、消息和持久化数据不能仅因为来自同源或类型正确就视为可信。

可运行实验

分别让 Worker 返回 { type: "error" }、抛出脚本异常、在返回前被 terminate()；记录 message、error 和无结果三种状态，确认清理后不会继续写页面。

实验记录要包含运行时、输入步骤、预期输出、实际日志和未覆盖的宿主差异。

练习

1. 分别触发正常 message、协议 error 和脚本 error，记录三种状态。
2. 在收到结果前调用 terminate，断言页面不再更新结果。
3. 说明监听器、Worker 和页面卸载之间的清理责任。 查看本节答案

下一步

完成练习后回到本章概览，按下一篇继续；遇到跨章节故障，先回到本节的所有权与宿主边界。