I am trying to implement push notifications for web.I have succesfully managed to display background notification. But on clicking it, the notification does not open the window or link I want.Rather, the function just does not fire.
Below is the code of my firebase-messanging-sw.js file.
self.addEventListener('notificationclick', function(event) {
console.log('[firebase-messaging-sw.js] Notification click received.');
event.notification.close();
const path = event.notification?.data?.url || '/';
// const fullUrl = 'http://localhost:3000' + path;
event.waitUntil(
clients.openWindow(path)
.catch(err => console.error('Error opening window:', err))
);
});
importScripts('https://www.gstatic.com/firebasejs/8.4.1/firebase- app.js');
importScripts('https://www.gstatic.com/firebasejs/8.4.1/firebase- messaging.js');
const firebaseConfig = {
apiKey: "***",
authDomain: "***",
projectId: "***",
storageBucket: "***",
messagingSenderId: "***",
appId: "***",
measurementId: "***"
};
firebase.initializeApp(firebaseConfig);
const messaging = firebase.messaging();
messaging.onBackgroundMessage(function(payload) {
console.log('[firebase-messaging-sw.js] Received background message ', payload);
const notificationTitle = payload.data?.title || 'New Notification';
const notificationOptions = {
body: payload.data?.body || 'You have a new message',
icon: '/firebase-logo.png',
badge: '/badge-icon.png',
data: {
url: payload.data?.url || '/',
},
actions: [
{
action: 'open',
title: 'Open App'
}
]
};
self.registration.showNotification(notificationTitle, notificationOptions);
});
The 'notification click' function is just not firing.Nothing gets printed on the console when I click on the notification. I have tried everything mentioned on internet-
- tried opening a different link(youtube.com)
- tried moving the 'notification click' function on top
- checked that service worker is registered and running.
please tell me any fix for this or anyhting that I may have missed.