Register Service Worker in Nuxtjs

Question

I am trying to register service worker in my nuxt application. the problem i am facing is registering the firebase-messaging-sw.js file

if ('serviceWorker' in navigator) {
   navigator.serviceWorker.register('./firebase-messaging-sw.js')
      .then(function(registration) {
          console.log('Registration successful, scope is:', registration.scope);
      }).catch(function(err) {
        console.log('Service worker registration failed, error:', err);
      });
}

Here is the error i received in the console

Messaging: We are unable to register the default service worker. Failed to register a ServiceWorker: A bad HTTP response code (404) was received when fetching the script

user_1627023 · Answer

You don't need to register service worker, it's automatically registered.

Also, I didn't found a way to use v9 modular code inside service worker.

Only v8 code works:

importScripts('https://www.gstatic.com/firebasejs/8.10.1/firebase-app.js')
importScripts('https://www.gstatic.com/firebasejs/8.10.1/firebase-messaging.js')

It may have some bugs with this service worker, after each update it stops to work. Looking for another solution... I will consider replace firebase notification with something different.

Register Service Worker in Nuxtjs

1 Answers