为什么ServiceWorkerRegistration回调在服务工作者成功注册后没有响应？

Question

我使用以下脚本注册服务工作者,并想检查此服务工作者是否支持推送？仅仅是为了测试目的我打印'打印服务工作者',但它没有打印到控制台.请帮助我触发我错的地方？

function register()
{
    if ('serviceWorker' in navigator)
    {
        navigator.serviceWorker.register('service-worker.js', {scope: scope}).then(initialiseState);
    } 
    else {
        console.warn('Service workers aren\'t supported in this browser.');
    }
}

function initialiseState() 
{ 
navigator.serviceWorker.ready.then(function(serviceWorkerRegistration)
        {  console.log('Print Service worker');});
}

提前感谢

Answer 1

首先,解释为什么你没有看到你期望的日志记录:

除非您self.clients.claim()在服务工作人员内部打电话,否则在导航期间最初注册时不会控制当前网页.至于navigator.serviceWorker.ready承诺,直到有一个控制页面的服务工作者才解决它.把这两个放在一起,我不希望你console.log()第一次访问页面时执行,但我希望在后续访问时(如果服务工作者正确安装).

有一个使用示例,self.clients.claim()如果您希望让您的服务工作者在您第一次在那里导航时控制页面.

至于你的实际问题,如果你觉得需要功能检测服务工作者推送支持,你应该能够检查一个对象'pushManager' in registration在哪里,就像一个解析registration的ServiceWorkerRegistration对象navigator.serviceWorker.register().没有必要等到您的页面由服务工作者控制.所以这应该工作:

if ('serviceWorker' in navigator) {
  navigator.serviceWorker.register('service-worker.js').then(function(registration) {
    if ('pushManager' in registration) {
      // The service worker supports push
    } else {
      // The service worker doesn't support push
    }
  });
} else {
  // The browser doesn't support service workers
}