javascript - ServiceWorker 中 SharedWorker 端口的等价物？

Question

SharedWorker 使用 Message Port 与 ParentWorker 交换消息。

父工

var port = new SharedWorker('/worker.js').port;
port.onmessage = function(e){
    console.log(e.data);
};
port.start();
port.postMessage("Hello Shared Worker. I'm Mr. Tab");

共享 worker (worker.js)

onconnect = function(e){
    var port = e.ports[0];
    port.onmessage = function(e){
        console.log(e.data);
    };
    port.start();
    port.postMessage("Hello Mr. Tab. I'm Shared Worker.");
};

Service Worker 呢？有没有类似SharedWorker端口的？

Answer 1

这是它的行为方式:

// in the page:
navigator.serviceWorker.controller.postMessage("Hi!");

// in the ServiceWorker:
self.onmessage = function(event) {
  event.source; // instance of Client
  event.data; // "Hi!"
  // reply
  event.source.postMessage("Hey!");
};

// back in the page:
navigator.serviceWorker.onmessage = function(event) {
  event.source; // instance of ServiceWorker
  event.data; // "Hey!"
};

在撰写本文时，Chrome 目前根据早期规范将 postmessages 从 ServiceWorker 发送到 Window 到 window.onmessage。此外，event.source 为空。

如果您同时需要解决方案，请传入您自己的 MessageChannel。在 https://jakearchibald.github.io/isserviceworkerready/demos/postMessage/ 查看演示