使用“ navigator.serviceWorker.controller.postMessage”，它将始终“ TypeError：无法读取null的属性'postMessage'”

Question

我有一个问题，在注册serviceWorker之后，“ navigator.serviceWorker.controller”始终为空。

我想使用“ postMessage”向服务工作者发送一些消息，但是“ navigator.serviceWorker.controller”始终返回null，并显示错误“ TypeError：无法读取null的'postMessage'属性”。

有时我可以使用“ navigator.serviceWorker.controller.postMessage”，但是有时“ navigator.serviceWorker.controller”返回null，我不确定如何处理此问题...

我已经进行了一些研究，但仍然无法解决我的问题...

您对这种情况有什么想法吗？

谢谢，特里

这是我创建的测试页。 https://terrylee7788.github.io/test_web_worker.html

Answer 1

使用navigator.serviceWorker.ready

navigator.serviceWorker.ready.then(function(serviceWorkerRegistration) {
  // Let's see if you have a subscription already
  return serviceWorkerRegistration.pushManager.getSubscription();
})
.then(function(subscription) {
  if (!subscription) {
    // You do not have subscription
  }
  // You have subscription.
  // Send data to service worker
  navigator.serviceWorker.controller.postMessage({'data': dataToServiceWorker});

})