I am engaged on a Progressive Internet App (PWA) with Firebase for push notifications.
My objective is to show a badge for unread messages on the app icon when notifications are acquired, utilizing the service employee.
Here is the of my service employee code:
importScripts('https://www.gstatic.com/firebasejs/8.10.0/firebase-app.js');
importScripts('https://www.gstatic.com/firebasejs/8.10.0/firebase-messaging.js');
const firebaseConfig = {
apiKey: "...",
authDomain: "...",
projectId: "...",
storageBucket: "...",
messagingSenderId: "...",
appId: "...",
measurementId: "..."
};
let badgeCount = 0;
console.log('employee: [firebase-messaging-sw.js] Loaded');
firebase.initializeApp(firebaseConfig);
const messaging = firebase.messaging();
messaging.onBackgroundMessage((payload) => {
console.log('employee: [firebase-messaging-sw.js] Obtained background message ', payload);
badgeCount++; // Increment badge depend for every message
if (navigator.setAppBadge) {
navigator.setAppBadge(badgeCount).catch((error) => {
console.error('Error setting badge:', error);
});
}
const notificationTitle = payload.notification.title;
const notificationOptions = {
physique: payload.notification.physique,
};
return self.registration.showNotification(notificationTitle, notificationOptions);
});
self.addEventListener('notificationclick', perform (occasion) {
// Deal with notification click on occasion right here
console.log('Notification clicked:', occasion);
});
self.addEventListener('notificationclose', perform (occasion) {
// Deal with notification shut occasion right here
console.log('Notification closed:', occasion);
});
Notifications are efficiently acquired, however the badge depend doesn’t show on iOS gadgets (examined solely on iOS). If I set the app badge on to 99 this additionally works. I believe the”onBackgroundMessage” just isn’t known as if I recive an online push.
What’s the corret method to do that?