4

I am sending notification from Firebase console to web application (Firebase). When I am sending a POST request from POSTMAN, I am able to navigate to the URL when I click on the notification. But when I am sending it from Firebase console I am not able to open the URL. Also, I need to add my logo as my Icon to the notification.

POSTMAN

{
          "notification": {
          "title": "Push notification test",
          "body": "It works! ",
       "icon": "https://soft-ing.info/img/firebase.png",
    "click_action": "https://google.com"
  },
  "to": "dLXCbmVCh5Y:APA91bGmFN7BUsKqwWFokyoBsoph6k4EhBQEflwJLFrPaUzTceYhAPYfFf8LqTRBVJGCA0gWS_0k0DUCeJBa7jdopIyjFQNprtp3lkQgLmUNRUibLIIMxAuBZeXuHTqaU-BA4QwbekN6"
}

Service Worker File Code

messaging.setBackgroundMessageHandler(function(payload) {
    console.log('[firebase-messaging-sw.js] Received background message ', payload);
    // Customize notification here
    const notificationTitle = payload.data.title;//'Background Message Title';
    const notificationOptions = {
        body: payload.data.body,//'Background Message body.',
        icon: payload.data.icon,
        image : payload.data.image,
        data:{
            time: new Date(Date.now()).toString(),
            click_action : payload.data.click_action
        }
    };

return self.registration.showNotification(notificationTitle,notificationOptions);
});

self.addEventListener("notificationclick", (event) => {
  event.waitUntil(async function () {
      const allClients = await clients.matchAll({
          includeUncontrolled: true
      });
      let chatClient;
      let appUrl = 'https://www.google.com';
      for (const client of allClients) {
      //here appUrl is the application url, we are checking it application tab is open
          if(client['url'].indexOf(appUrl) >= 0) 
          {
              client.focus();
              chatClient = client;
              break;
          }
      }
      if (!chatClient) {
          chatClient = await clients.openWindow(appUrl);
      }
  }());
});
Doug Stevenson
  • 297,357
  • 32
  • 422
  • 441

1 Answers1

0

There's some discrepancy in the above two snippets you shared. In your case body: payload.data.body should be body: payload.notification.body, you need to do similarly for other places in service worker since that's how you are sending the request.

Nimit Bhargava
  • 458
  • 4
  • 10