Worker:message 事件
注意:此功能在 Web Workers 中可用,但 Service Workers 除外。
當 Worker 的父級從其 Worker 接收到訊息時(即,當 Worker 使用 DedicatedWorkerGlobalScope.postMessage() 傳送訊息時),會在 Worker 物件上觸發 message 事件。
此事件不可取消,也不會冒泡。
語法
在諸如 addEventListener() 之類的方法中使用事件名稱,或設定事件處理程式屬性。
js
addEventListener("message", (event) => { })
onmessage = (event) => { }
事件型別
一個 MessageEvent。繼承自 Event。
事件屬性
此介面還繼承了其父級 Event 的屬性。
MessageEvent.data只讀-
由訊息傳送者傳送的資料。
MessageEvent.origin只讀-
一個字串,表示訊息傳送者的源。
MessageEvent.lastEventId只讀-
一個字串,表示事件的唯一 ID。
MessageEvent.source只讀-
一個
MessageEventSource(可以是 WindowProxy、MessagePort或ServiceWorker物件),表示訊息傳送者。 MessageEvent.ports只讀-
一個
MessagePort物件陣列,表示訊息傳送通道(如果適用,例如在通道訊息傳遞或向共享工作者傳送訊息時)關聯的埠。
示例
此程式碼建立一個新的 Worker,並使用 addEventListener() 監聽來自它的訊息。
js
const worker = new Worker("static/scripts/worker.js");
worker.addEventListener("message", (event) => {
console.log(`Received message from worker: ${event.data}`);
});
或者,也可以使用 onmessage 事件處理程式屬性來監聽。
js
const worker = new Worker("static/scripts/worker.js");
worker.onmessage = (event) => {
console.log(`Received message from worker: ${event.data}`);
};
Worker 使用 self.postMessage() 傳送訊息。
js
// static/scripts/worker.js
self.postMessage("I'm alive!");
規範
| 規範 |
|---|
| HTML # event-message |
瀏覽器相容性
載入中…