SharedWorkerGlobalScope: connect 事件
当有新的客户端连接时,在 SharedWorker 的 SharedWorkerGlobalScope 中会触发 connect 事件。
此事件不可取消,也不会冒泡。
语法
在诸如 addEventListener() 之类的方法中使用事件名称,或设置事件处理程序属性。
js
addEventListener("connect", (event) => { })
onconnect = (event) => { }
事件类型
一个 MessageEvent。继承自 Event。
事件属性
此接口还继承了其父级 Event 的属性。
MessageEvent.data只读-
由消息发送者发送的数据。
MessageEvent.origin只读-
一个字符串,表示消息发送者的源。
MessageEvent.lastEventId只读-
一个字符串,表示事件的唯一 ID。
MessageEvent.source只读-
一个
MessageEventSource(可以是 WindowProxy、MessagePort或ServiceWorker对象),表示消息发送者。 MessageEvent.ports只读-
一个
MessagePort对象数组,表示消息发送通道(如果适用,例如在通道消息传递或向共享工作者发送消息时)关联的端口。
示例
此示例展示了一个共享工作线程文件 — 当主线程通过 MessagePort 连接到工作线程时,onconnect 事件处理程序将被触发。该事件对象是一个 MessageEvent。
可以通过事件对象的 ports 参数来引用正在连接的端口;可以为此引用附加一个 onmessage 处理程序来处理通过该端口传入的消息,并使用其 postMessage() 方法将消息发送回主线程。
js
self.onconnect = (e) => {
const port = e.ports[0];
port.onmessage = (e) => {
const workerResult = `Result: ${e.data[0] * e.data[1]}`;
port.postMessage(workerResult);
};
port.start();
};
有关完整的运行示例,请参阅我们的 简单的共享工作线程示例 (运行共享工作线程)。
addEventListener 等效
您也可以使用 addEventListener() 方法来设置事件处理程序
js
self.addEventListener("connect", (e) => {
const port = e.ports[0];
port.onmessage = (e) => {
const workerResult = `Result: ${e.data[0] * e.data[1]}`;
port.postMessage(workerResult);
};
});
规范
| 规范 |
|---|
| HTML # event-workerglobalscope-connect |
| HTML # handler-sharedworkerglobalscope-onconnect |
浏览器兼容性
加载中…