Not able to integrate firebase notifications in my application (javascript / angular)

Question

I am facing an issue while integrating with firebase, I can successfully intiatize messaging, and can show the popup to ask user for permissions to show notifications, but after that I cannot get the token for the user.

When I see the log, I notice that there is following error in console logs

firebase.initializeApp(config);
      const messaging = firebase.messaging();


      messaging.requestPermission().then(function (permission) {
        var token = messaging.getToken();
        alert(token);
        token.then(function (cToken) {
          alert(cToken);
        });
      });

core.js:15724 ERROR Error: Uncaught (in promise): FirebaseError: 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. (messaging/failed-serviceworker-registration). FirebaseError: 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. (messaging/failed-serviceworker-registration). at firebase.js:1 at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:391) at Object.onInvoke (core.js:17299) at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:390) at Zone.push../node_modules/zone.js/dist/zone.js.Zone.run (zone.js:150) at zone.js:910

Timbo McCool Timbo McCool · Accepted Answer · 2019-09-18T12:27:21

If you're using the angular service worker through the angular service worker package you need to register your service worker in your app.module.ts.

import { ServiceWorkerModule } from '@angular/service-worker';

and then in imports add imports: [ ServiceWorkerModule.register('ngsw-worker.js', { enabled: environment.production })]

Not able to integrate firebase notifications in my application (javascript / angular)

2 Answers