Web Worker为Web内容在后台线程中运行脚本提供了一种简单的方法。线程可以执行任务而不干扰用户界面。此外，他们可以使用XMLHttpRequest执行 I/O (尽管responseXML和channel属性总是为空)。一旦创建， 一个worker 可以将消息发送到创建它的JavaScript代码, 通过将消息发布到该代码指定的事件处理程序（反之亦然）。
同源限制：分配给 Worker 线程运行的脚本文件，必须与主线程的脚本文件同源。
DOM 限制：Worker 线程所在的全局对象，与主线程不一样，无法读取主线程所在网页的 DOM 对象，也无法使用document、window、parent这些对象。但是，Worker 线程可以navigator对象和location对象。
通信联系：Worker 线程和主线程不在同一个上下文环境，它们不能直接通信，必须通过消息完成。
脚本限制：Worker 线程不能执行alert()方法和confirm()方法，但可以使用 XMLHttpRequest 对象发出 AJAX 请求。
文件限制：Worker 线程无法读取本地文件，即不能打开本机的文件系统（file://），它所加载的脚本，必须来自网络。后面我们允许会做处理。
Worker 线程无法读取本地文件，即不能打开本机的文件系统（file://），它所加载的脚本，必须来自网络。所以我们得起一个项目。使用http-server最简单
安装：
> cnpm i -g http-server
使用：
> http-server
我们新建一个文件夹名叫worker，里面新建三个文件分别是
index.html main.js worker.js
新建一个worker线程很简单，只需：
var worker = new Worker('worker.js')main.js:
var worker = new Worker('./worker.js')
console.log('worker running')
worker.addEventListener('message',e => {
console.log('main: ', e.data);
})
// 也可使用：
// worker.onmessage = (e)=>{
// console.log('main: ', e.data);
// }
worker.postMessage('hello worker,I am from main.js')worker.js:
console.log('worker task running')
onmessage = (e)=>{
console.log('worker task receive', e.data);
// 发送数据事件
postMessage('Hello, I am from Worker.js');
}在worker文件夹下，命令行输入http-server,启动项目，用浏览器打开，看控制台：
worker running worker task running worker task receive hello worker,I am from main.js main: Hello, I am from Worker.js
从上面可以看到，worker通过onmessage来监听数据，通过postMessgae来发送数据
worker.terminate();
worker.addEventListener('error', (e) => {
console.log('main error', 'filename:' + e.filename + 'message:' + e.message + 'lineno:' + e.lineno;
});event.filename: 导致错误的 Worker 脚本的名称；
event.message: 错误的信息；
event.lineno: 出现错误的行号；
main.js
var worker = new Worker('./worker1.js');worker1.js
console.log("I'm worker1")
importScripts('worker2.js', 'worker3.js');
// 或者
// importScripts('worker2.js');
// importScripts('worker3.js');worker2.js
console.log("I'm worker2")worker3.js
console.log("I'm worker3")https://caniuse.com/#feat=webworkers
兼容性还不是很乐观，不过在移动端的兼容性还不错
声明：本网页内容旨在传播知识，若有侵权等问题请及时与本网联系，我们将在第一时间删除处理。TEL:177 7030 7066 E-MAIL:11247931@qq.com
Copyright © 2019-2024 51dongshi.com 版权所有
违法及侵权请联系：TEL:177 7030 7066 E-MAIL:11247931@qq.com 本站由北京市万商天勤律师事务所王兴未律师提供法律服务
