JS可通过Blob+URL.createObjectURL()创建行内Web Worker,绕过同源限制:1.将Worker逻辑写为字符串;2.转为Blob并生成URL;3.用该URL实例化Worker通信;4.终止后需调用terminate()和revokeObjectURL()清理资源。

JS 中可以通过 Blob + URL.createObjectURL() 创建行内 Web Worker,绕过“必须是同源脚本 URL”的限制,无需单独的 JS 文件。
1. 构造 Worker 脚本内容为字符串
把 Worker 的逻辑写成字符串(注意:不能直接引用外部变量或闭包,Worker 是独立上下文):
const workerCode = `
self.onmessage = function(e) {
const result = e.data * 2;
self.postMessage({ doubled: result });
};
`;2. 创建 Blob 并生成可执行 URL
将脚本字符串转为 Blob,再用 URL.createObjectURL() 得到一个生命周期绑定的 blob URL:
const blob = new Blob([workerCode], { type: 'application/javascript' });
const workerUrl = URL.createObjectURL(blob);3. 实例化 Worker 并通信
用该 URL 初始化 Worker,之后和普通 Worker 一样使用:
const worker = new Worker(workerUrl);
<p>worker.onmessage = function(e) {
console.log('Received from worker:', e.data); // { doubled: 42 }
};</p><p>worker.postMessage(21); // 发送数据4. 清理资源(重要)
Worker 终止后,应手动释放 blob URL,避免内存泄漏:
- 调用
worker.terminate()停止 Worker - 调用
URL.revokeObjectURL(workerUrl)销毁 URL 引用
worker.terminate(); URL.revokeObjectURL(workerUrl);
注意:Blob URL 只在当前文档生命周期内有效;页面刷新即失效。这种方式适合动态、一次性或配置驱动的 Worker 场景,比如按需编译、临时计算、沙箱化执行等。


















