0

I am trying to connect my ReactJs app to firebase to implement push notifications. Every time I try to console log the token that I get from firebase, this error always shows up and I don't know how I can solve it. Here is a screenshot of the error :

enter image description here

I added the following lines in my firebase-messaging-sw.js which is located inside my public file and here it is :

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

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);
        });
}

firebase.initializeApp({
    messagingSenderId: "msg_id",
})

const initMessaging = firebase.messaging()

There is also the file firebase.js and its content which I get the data inside the config object from my firebase project which is already registered :

import firebase from "firebase";

const config = {
    apiKey: "my_api_key",
    authDomain: "my_domain",
    databaseURL: "my_database_url",
    projectId: "project_id",
    storageBucket: "storage-bucket",
    messagingSenderId: "msg_id",
    appId: "app_id",
    measurementId: "measure_id"
}

firebase.initializeApp(config);
firebase.analytics();

export default firebase;

And here is my useEffect where I am trying to print the token :

   useEffect(() => {
        const messaging = firebase.messaging();
        messaging.requestPermission().then(() => {
            return messaging.getToken()
        }).then(token => {
            console.log("TOKEN :", token)
        })
    }, [])

I tried many fixes and nothing worked and I still get the same error. I hope that anyone can help me with this. Thanks in advance.

Peter Haddad
  • 78,874
  • 25
  • 140
  • 134
Saif
  • 249
  • 5
  • 15
  • See here https://stackoverflow.com/questions/49566059/service-worker-registration-error-unsupported-mime-type-text-html – designtocode Jul 20 '20 at 09:04
  • @designtocode is it something that we need to handle in the backend or the frontend?! – Saif Jul 20 '20 at 09:16
  • It's the frontend settings on how you load the service worker @saif – designtocode Jul 20 '20 at 09:24
  • @designtocode I tried all the fixes there and nothing worked. There is a solution that needs to be done with ngix to accept that MIME type but I have no clue how to do it. – Saif Jul 20 '20 at 09:27

0 Answers0