FirebaseError: Messaging: We are unable to register the default service worker. Failed to register a ServiceWorker for scope ('http://localhost:3000/firebase-cloud-messaging-push-scope') with script ('http://localhost:3000/firebase-messaging-sw.js'): A bad HTTP response code (404) was received when fetching the script. (messaging/failed-service-worker-registration). about firebase-js-sdk HOT 6 CLOSED

@Jmyerzzz, service worker doesn't yet support modularization. To use the latest version of the SDK, please use the compat version when importing the script. With that, I'll be closing the ticket now. If the issue persists, feel free to comment and reopen this issue.

/**
 * Here is is the code snippet to initialize Firebase Messaging in the Service
 * Worker when your app is not hosted on Firebase Hosting.

 // Give the service worker access to Firebase Messaging.
 // Note that you can only use Firebase Messaging here. Other Firebase libraries
 // are not available in the service worker.
 importScripts('https://www.gstatic.com/firebasejs/10.11.1/firebase-app-compat.js');
 importScripts('https://www.gstatic.com/firebasejs/10.11.1/firebase-messaging-compat.js');

from firebase-js-sdk.

One quick check first: if you start up your dev server and navigate in your browser to http://localhost:3000/firebase-messaging-sw.js, do you get a 404?

from firebase-js-sdk.

Hi @Jmyerzzz, I'm unable to reproduce the same behavior you're experiencing. But to add from what hsubox76 said. Usually this error is thrown because of runtime error in the sw script. If you could provide us a minimal repro, it'll help us out to a faster resolution. Thanks!

from firebase-js-sdk.

Actually, to clarify, the 404 error is not thrown because of an error in the sw script, but if the sw script isn't there at all, i.e., if you navigate there using your browser's url field, you get a 404. There's a different error thrown if there's an error in the sw script that ends with the string "ServiceWorker script evaluation failed".

from firebase-js-sdk.

Thanks for the help here, I was able to resolve this by adding to my webpack config

plugins: [
    new CopyPlugin({
      patterns: [
        {
          from: path.resolve(__dirname, './public/firebase-messaging-sw.js'),
          to: path.resolve(__dirname, './build/firebase-messaging-sw.js'),
        },
      ],
    }),
  ],

The error I'm now running into is SyntaxError: Cannot use import statement outside a module (at firebase-messaging-sw.js:1:1). I can resolve this by changing the file extension to .mjs in that webpack config but it then seems messaging doesn't work because firebase is expecting that specific file name.

I know this error is separate from the issue reported, so lmk if I should open a new one

from firebase-js-sdk.

It looks like the initial issue was already solved. I'll be closing this issue now. If you encounter another issue, feel free to create a new one.

from firebase-js-sdk.