integrate firebase cloud messaging in quasarv1.9 !

Paolo Massenzana

hi all, i’m try to integrate web cloud messaging in quasar app.
i follow some procedures online and this is the step i do :

STEP 1 WORK!
Create boot file with i import firebase , firestore etc,
Inizialize firebase
export variabiles

STEP 2 NOT WORK!
i create a vuex store file where i get token from firebase and it work (chrome ask me correctly the permission for notification)
i create a file name firebase-messaging-sw.js and in quasar conf with webpack plugin > cfg.plugins.push(new CopyWebpackPlugin([{ from: ‘src/firebaseTools/’, to: ‘’ }]));

i see the service worker running in chrome application tab but when i try to send a notify form firebase not arrive.

help me plz!

Paolo Massenzana

UPDATE:
i used firebase 7.13, if downgrade to 5.6 foregroundnotification works , background notification no , i think the problem is in the service worker … quasat not see thaht

ArkIv

Can any of this help?
quasar 1.11.2
// server nodejs

const admin = require("firebase-admin");  // npm

var serviceAccount = require("./key_firebase.json"); //  Private Key 
    - To generate a private key file for your service account:
    - In the Firebase console, open Settings > Service Accounts.
    - Click Generate New Private Key, then confirm by clicking Generate Key.
    - Securely store the JSON file containing the key.

admin.initializeApp({
  credential: admin.credential.cert(serviceAccount),
  databaseURL: "https://<<ProjectName>>.firebaseio.com"
});
// -------------------------------------------------------------
var registrationToken ="SfDeDN2Aw5iUBn9UHcx....."  // client ,? ( for test )
var message = {
  data: {
    title: "TitleHello",
    body: "Hello World",
    icon: "/statics/icons/icon-128x128.png",
    image: "/statics/dom_300.png",
    . . . . . . 
   }
  },
  //token: registrationToken  // if token from client
  topic: "allUsers"  // if for topic
};

// Send a message to the device corresponding to the provided
admin
  .messaging()
  .send(message)
  .then(response => {
    // Response is a message ID string.
    console.log("Successfully sent message:", response);
  })
  .catch(error => {
    console.log("Error sending message:", error);
  });

// sample if topic

. . . . (req,res){ 
let idTokens = [req.body.idToken];
 admin
   .messaging()
   .subscribeToTopic(idTokens, "allUsers")  // idTokens  From the client,   allUsers - name topic
        .then(function(response) {
 . . .

workboxPluginMode: “InjectManifest”,

// custom-service-worker,js

importScripts("https://www.gstatic.com/firebasejs/7.14.2/firebase-app.js");
importScripts( "https://www.gstatic.com/firebasejs/7.14.2/firebase-messaging.js");
 // Your web app's Firebase configuration  ->  console firebase  Firebase SDK snippet
  var firebaseConfig = { .. }

firebase.initializeApp(firebaseConfig);
const messaging = firebase.messaging();
messaging.setBackgroundMessageHandler(function(payload) {
  let notifi = payload.data;
  const notificationTitle = notifi.title; //"Background Message Title";
  const notificationOptions = {
    actions: [
      {
        action: "https://google.ru",
        title: "click me"
      }
    ],
    body: notifi.body,
    icon: notifi.icon,
    image: notifi.image,
    requireInteraction: true // Do not clean message
  };
  return self.registration.showNotification(
    notificationTitle,
    notificationOptions
  );
});

. . .

???
self.addEventListener( "notificationclick",  function(event) {
. . .

// register-service-worker.js

import { register } from "register-service-worker";  // help npm ( includes to quasar ?)
. . . 
register(process.env.SERVICE_WORKER_FILE, {
  registrationOptions: { scope: "./" },
  ready(registration) {
 . . . 
firebase.initializeApp(firebaseConfig);
const messaging = firebase.messaging();
  messaging.useServiceWorker(registration); // Your sw (service-worker,js -> custom-service-worker.js)  instead   firebase-messaging-sw.js
. . .
 messaging.onMessage(payload => {
  ... .. .. registration.showNotification(title, options)
})  // no sw, no background
. . . get token
 messaging
        .getToken()
        .then(idToken=> {
          if (idToken) { -> axios to server, for logics to topics
, 
}

jitendra16

useServiceWorker is deprecated

diadal

this may be late just incase use this https://github.com/diadal/firebase

alexmalcova

No More Posting New Topics!

integrate firebase cloud messaging in quasarv1.9 !