Web Worker 是浏览器提供的一种 在后台运行 JavaScript 脚本 的机制,它允许你将一些耗时的任务(比如数据处理、计算密集型逻辑)放到主线程之外的线程中运行,从而避免阻塞用户界面(UI)。
Web Worker 就像是在浏览器中开了一个“子线程”,可以跑 JS 脚本,但不会影响主页面的 UI 和交互。
Worker 无法直接访问 DOM、XHR。
出现的错误
在利用web-worker进行大文件切割上传的时候,在web-worker中不小心引入window对象,页面报错,无法正常显示
原因
Worker 无法直接访问 DOM、XHR。 是 浏览器规范决定的,原因很简单:
Web Worker 是运行在独立线程中的,它不属于主线程环境,没有 DOM,也没有全局 window 对象。
| 主线程中对象 | 在 Worker 中的替代 |
|---|---|
window | ❌ 不可用 |
document | ❌ 不可用 |
self | ✅ Worker 的全局对象 |
globalThis | ✅ 也可用 |
解决方法
因为代码中用到的 window 对象和 web-worker 没有关系,所以抽离一下文件就解决了