if ('serviceWorker' in navigator) {
     console.log('Service Worker is supported');
     navigator.serviceWorker.register('sw.js').then(function(reg) {
       console.log(reg);
            reg.pushManager.subscribe({
                userVisibleOnly: true
            }).then(function(sub) {
                var endpoint = sub.endpoint;
                console.log('endpoint:', sub.endpoint);
            });
     }).catch(function(err) {
       console.log(':(', err);
     });
    }

This is my simple example of a serviceWorker registration. When I load the page for the first time, I get the error:

Uncaught (in promise) DOMException: Subscription failed - no active Service Worker

If I reload this page all goes fine. In Mozilla I don't have this bug. Why can't the serviceWorker be registered in the first onload?

if ('serviceWorker' in navigator) {
     console.log('Service Worker is supported');
     navigator.serviceWorker.register('sw.js').then(function(reg) {
       console.log(reg);
            reg.pushManager.subscribe({
                userVisibleOnly: true
            }).then(function(sub) {
                var endpoint = sub.endpoint;
                console.log('endpoint:', sub.endpoint);
            });
     }).catch(function(err) {
       console.log(':(', err);
     });
    }

This is my simple example of a serviceWorker registration. When I load the page for the first time, I get the error:

Uncaught (in promise) DOMException: Subscription failed - no active Service Worker

If I reload this page all goes fine. In Mozilla I don't have this bug. Why can't the serviceWorker be registered in the first onload?

• javascript
• service-worker

1 Answer 1

In order to receive push events, you need a successfully installed service worker. You're asking for the subscription before a service worker has been successfully installed, so it fails. Otherwise it would appear like your push subscription worked, but the registration (and therefore your subscription) get thrown away if the only worker fails to install.

navigator.serviceWorker.ready is a promise that resolves once there's a registration with an active (sucessfully installed) worker. It resolves with the registration, so it works well here.

navigator.serviceWorker.ready.then(reg => reg.pushManager.subscribe(…))