无法 post 向服务人员发送消息，因为控制器值为空

Question

我正在尝试在 service worker 的帮助下使 website 离线可用，以缓存页面所需的文件。我试图让用户控制他希望缓存哪些图像。

为此，我使用函数 sendMessage

 function sendMessage(msg){
  navigator.serviceWorker.controller.postMessage(msg);
}

其中消息包含与用户希望缓存或取消缓存的图像相关的数据。

服务工作者包含消息事件的事件侦听器：

this.addEventListener('message', function(event){
var data = event.data;
caches.open('v1').then(function(cache){
    if(data.add==1)
        return cache.add(data.url);
    else
        cache.delete(data.url).then(function(response)      
    {
     console.log(response)});
     console.log(event);
    }
 )})

我面临的问题是控制器总是null。

Answer 1

问题是您的 Service Worker 已注册，但它未激活且尚未控制您的页面。

如果你想让你的 service worker 变得活跃，你可以在 install 事件处理程序中调用函数 skipWaiting。

如果您希望您的服务人员在页面激活后立即控制该页面，您可以使用 activate 事件处理程序中的 Clients.claim 函数。

您可以在 ServiceWorker Cookbook Immediate Claim recipe 中查看示例。

无法 post 向服务人员发送消息，因为控制器值为空

unable to post message to service worker because controller value is null

javascript

caching

service-worker