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 |
瀏覽器相容性
載入中…