CODEWITHSUNDEEP
javascriptfirebasevue.jsvuejs2
Reo93
Reo93

Reputation: 229

Why I getting an error while trying to retrieving token from firebase in Vue js?

I'm trying to implement firebase to my vue.js project but I'm getting error on firebase.messaging.getToken(). Here is the screenshot of my problem

enter image description here

Error:

The script has an unsupported MIME type ('text/html').

Failed to load resource: net::ERR_INSECURE_RESPONSE

Unable to get permission to notify.

And here is my code.

firebase.messaging().requestPermission().then(function () {
  console.log('Notification permission granted.')
  return firebase.messaging().getToken()
    .then(function (currentToken) {
      console.log(currentToken)
    })
}).catch(function (err) {
  console.log('Unable to get permission to notify.', err)
})

Service Workers

enter image description here

Does anyone knows how to solve this problem? I tried in many ways but i could not figure it out. Can you please help me?

Thanks.

Upvotes: 7

Views: 2966

Answers (1)

Taddis
Taddis

Reputation: 156

Try to put the file (or create a file) "firebase-messaging-sw.js" inside the /public folder

inside the firebase-messaging-sw.js copy and paste this (and change YOUR-SENDER-ID) :

// 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/4.8.1/firebase-app.js');
importScripts('https://www.gstatic.com/firebasejs/4.8.1/firebase-messaging.js');

// Initialize the Firebase app in the service worker by passing in the
// messagingSenderId.
firebase.initializeApp({
  'messagingSenderId': 'YOUR-SENDER-ID'
});

// Retrieve an instance of Firebase Messaging so that it can handle background
// messages.

const messaging = firebase.messaging();

Worked for me ( using React )

Upvotes: 6

Related Questions