navigator.serviceWorker.controller始终为null

Question

我有一个问题,在注册serviceWorker后,navigator.serviceWorker.controller始终为null.我从不做强制刷新,只刷新页面.我用谷歌浏览器42.0.2311.152米(32位)测试它.

var currentServiceWorker = null;
navigator.serviceWorker.register(SERVICE_WORKER_URL).then(function(serviceWorkerRegistration { 
  if (navigator.serviceWorker.controller) {
    currentServiceWorker = navigator.serviceWorker.controller;
  } else {
    currentServiceWorker = serviceWorkerRegistration.active;
  }
});

根据这个:

ServiceWorkerContainer接口的控制器只读属性在其状态被激活时返回ServiceWorker对象(ServiceWorkerRegistration.active返回的同一对象).如果请求是强制刷新(Shift +刷新)或者没有活动工作程序,则此属性返回null.(来源:https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerContainer/controller)

navigator.serviceWorker.controller应该返回相同的对象serviceWorkerRegistration.active.但是,.active我得到了积极的工作者,.controller没有.

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

谢谢你,安迪

Answer 1

调试时我要注意的第一件事是你当前的页面是否属于服务工作者的范围.如果您当前的页面不在范围内,则不会对其进行控制(但您注册的服务工作者仍可被视为活动页面).

您正在调用register(SERVICE_WORKER_URL)默认情况下将使用包含服务工作者脚本的目录作为范围.这通常是您想要的,但您需要确保SERVICE_WORKER_URL引用位于您网站根目录的脚本.这样,它就能够控制同一根级别的页面或Web根目录下的目录中的页面.因此,如果您的服务工作者JavaScript文件当前位于/scripts/子目录或类似的目录下,请将其移至根目录.

您可以通过访问chrome://serviceworker-internals/并查看与注册相关的范围来检查服务工作者的当前范围.

Answer 2

尝试在服务工作者中添加它：

self.addEventListener('activate', event => {
    clients.claim();
    console.log('Ready!');
});