NotSupportedError: Failed to get ServiceWorkerRegistration objects: The user denied permission to use Service Worker

Viewed 1177

How to handle service worker registration failed error when user has denied permissions for service worker?

I am getting this error after implementing servicer worker in my react app:

NotSupportedError: Failed to get ServiceWorkerRegistration objects: The user denied permission to use Service Worker.

I have wrapped service worker code into a if condition to check if browser cookies are enabled.

if(navigator.cookieEnabled){
  serviceWorker.register()
}

But I am still getting this error for several users.

Apart from that, I am getting a service worker script to fail errors for some users even when service worker registration is successfull.

TypeError: Failed to update a ServiceWorker: ServiceWorker script evaluation failed

OR

TypeError: Failed to update a ServiceWorker for scope ('https://example.com/') with script ('https://example.com/sw.js'): ServiceWorker script evaluation has failed

below is service worker js file:

import { initializeFirebaseonSWRegistration } from '../firebase';


function startRegistering(config) {
  try {
    const swUrl = `${window.location.origin}/sw.js`;
    navigator.serviceWorker.ready.then(
      navigator.serviceWorker
        .register(swUrl)
        .then(function(registration) {
          registration.update();
          // Successful registration
          if (config.onRegistered) {
            config.onRegistered();
          }

          try {
            initializeFirebaseonSWRegistration(registration);
          } catch (error) {
            console.log(
              `API's required to use the firebase SDK not supported, error: ${error}`
            );
          }
          if (config.onMessagingActivated) {
            config.onMessagingActivated();
          }
          console.log(
            'Hooray. Registration successful, scope is:',
            registration.scope
          );
        })
        .catch(function(err) {
          // Failed registration, service worker won’t be installed
          console.log(
            `Whoops. Service worker registration failed, error:`,
            err
          );
        }

      navigator.serviceWorker.getRegistrations().then(function(registrations) {
        for (const registration of registrations) {
          if (registration.active !== null) {
            if (registration.active.scriptURL !== swUrl) {
              registration.unregister();
            }
          }
        }
    })
  } catch (error) {
    console.log(
      `Something went wrong in service worker registration, error:${error}`
    );
  }
}

export function register(config = {}) {
  if ('serviceWorker' in navigator && navigator.cookieEnabled) {
    window.addEventListener('load', () => {
      startRegistering(config);
    });
  }
}

export function unregister() {
  if ('serviceWorker' in navigator) {
    navigator.serviceWorker.ready.then(registration => {
      registration.unregister();
    });
  }
}

As you can see I have wrapped service worker registration code in try catch the error should be caught in catch block but instead it gets logged on error logging app bugsnag.

If someone could point out what could be the reasons for these two errors it would be great.

0 Answers
Related