Firebase Cloud HTTP Message from Web

user5803705 :

I have set up a webpage (home.html) that a user can sign into firebase using authentication. Once they authenticate, they are directed to a new page(test.html). Once they are here, I want to be able to send a notification or data message.

I am wondering if anyone can help me with the code to send a notification - any type of notification. I've been on this for 3 days and cannot send a notification from the web!! I can't find any tutorials on this - only people using curls.

I have no idea how to handle the code below, which is supposed to be on how to send a notification to the devices subscribed to a topic. I am guessing that this is all JSON and needs to be put into a JSON object?

Please assume the Initialization is filled in, I removed all info - even though I think that information is supposed to be public.

Thanks for any info!

This is my service worker (so far): firebase-messaging.sw.js

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

  // Initialize Firebase
  var config = {
    apiKey: "",
    authDomain: "",
    databaseURL: "",
    projectId: "",
    storageBucket: "",
    messagingSenderId: ""
  };
  firebase.initializeApp(config);

  const messaging = firebase.messaging();
  messaging.setBackgroundMessageHandler(function(payload){
    const title = "Hello World";
    const options = {
      body: payload.data.status
    };
    return self.registration.showNotification(title, options);
  });

This is the app.js file that goes to the test.html page

  // Initialize Firebase
  var config = {
    apiKey: "",
    authDomain: "",
    databaseURL: "",
    projectId: "",
    storageBucket: "",
    messagingSenderId: ""
  };
  firebase.initializeApp(config);

  // Retrieve Firebase Messaging object.
  const messaging = firebase.messaging();

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

  messaging.onMessage(function(payload){
    console.log('onMessage:', payload);
  });

And the barebones test.html file

<!DOCTYPE html>

<html>
    <head>
        <script src="https://www.gstatic.com/firebasejs/4.3.1/firebase-app.js"></script>
        <script src="https://www.gstatic.com/firebasejs/4.3.1/firebase-messaging.js"></script>
    </head>
    <body> 
        <script src="/scripts/app.js"></script>
    </body>
</html>

user2520818 :

as @Himanshu Chaudhary said. It is not a good practice to push notification from client to client. People when accesing your token, could missuse the notifications. But this beeing said, if you really really want to do that. lets say for testing porpuse, private project ... it is simply a http post from the second client (or better the server) to the client which had enabled the notifications:

var option = {
  method: 'POST',
  headers: new Headers({
    Authorization: "key=AAAAnww...", // your Firebase cloud messaging Server key 
    "Content-Type": "application/json"
  }),
  body: JSON.stringify({
    "notification": {
      "title": "some tilte:",
      "body": "more text",
      "icon": "./src/assets/favicons/logo.png",
      "click_action": deepLinkUrl
    },
    "to": token // the token from 'messaging.getToken(' from the reciving client
  }),
  mode: 'cors',
  cache: 'default'
};
fetch('https://fcm.googleapis.com/fcm/send', option);