User Profile

Hello, I'm setting up a PWA with Next.js 13 and Firebase, and I need help with push notifications on iOS. Is there anyone experienced with this? I have notifications configured using the next-pwa service worker, and they work well on Android, but not on iOS. This is my worker/index.ts import { initializeApp } from 'firebase/app'; import { getMessaging, onMessage } from 'firebase/messaging'; import { onBackgroundMessage } from 'firebase/messaging/sw'; export const vapidKey = process.env.VAPID_API_KEY; export const FCM_TOKEN_COLLECTION = 'fcmTokens'; export const FCM_TOKEN_KEY = 'fcmToken' const firebaseConfig = { apiKey: process.env.NEXT_PUBLIC_FIREBASE_API_KEY, authDomain: process.env.NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN, databaseURL: process.env.NEXT_PUBLIC_FIREBASE_DATA_BASE_URL, projectId: process.env.NEXT_PUBLIC_FIREBASE_PROJECT_ID, storageBucket: process.env.NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET, messagingSenderId: process.env.NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID, appId: process.env.NEXT_PUBLIC_FIREBASE_APP_ID, vapidKey: process.env.VAPID_API_KEY, }; const app = initializeApp(firebaseConfig); const messaging = getMessaging(app); onBackgroundMessage(messaging, (payload) => { console.log('[firebase-messaging-sw.js] Received background message ', payload); // Customize notification here if (payload.notification?.title) { const notificationTitle = payload.notification.title; const notificationOptions = { body: payload.notification?.body, icon: '/images/logo-app-4.0.svg', }; self.registration.showNotification(notificationTitle, notificationOptions); } }); onMessage(messaging, (payload) => { console.log('Message received. ', payload); }); and the next.config.js const runtimeCaching = require('next-pwa/cache'); const withPWA = require('next-pwa')({ dest: 'public', register: true, skipWaiting: true, dynamicStartUrl: true, dynamicStartUrlRedirect: '/login', runtimeCaching, disable: prod ? false : true, }); module.exports = withPWA({ reactStrictMode: true, swcMinify: false, experimental: { appDir: true, }, }); and the public/firebase-messaging-sw.js importScripts('https://www.gstatic.com/firebasejs/10.6.0/firebase-messaging.js'); if ('serviceWorker' in navigator) { navigator.serviceWorker.register('../firebase-messaging-sw.js') .then(function (registration) { alert('Registration successful, scope is: registration.scope'); }).catch(function (err) { alert('Service worker registration failed, error:'); }); } firebase.initializeApp({ messagingSenderId: '*************' }) const initMessaging = firebase.messaging() initMessaging.onBackgroundMessage(messaging, (payload) => { console.log('[firebase-messaging-sw.js] Received background message ', payload); // Customize notification here if (payload.notification?.title) { const notificationTitle = payload.notification.title; const notificationOptions = { body: payload.notification?.body, icon: '/images/logo-app-4.0.svg', }; self.registration.showNotification(notificationTitle, notificationOptions); } });