Estaba tratando de implementar Firebase Web Push Notifications en mi sitio web. He estado tratando de trabajar con firebase (versión web 9)

Estoy usando la versión: 9.8.1

Al implementar onBackgroundMessage, obtuve lo siguiente:

 onBackgroundMessage.ts:33 Uncaught FirebaseError: Messaging: This method is available in a service worker context. (messaging/only-available-in-sw). at onBackgroundMessage$1 (onBackgroundMessage.ts:33:25) at onBackgroundMessage (api.ts:170:10)

alguien puede ayudar

A continuación se muestra lo que he escrito.

 <script type="module"> import { initializeApp } from "https://www.gstatic.com/firebasejs/9.8.1/firebase-app.js"; import { getAnalytics } from "https://www.gstatic.com/firebasejs/9.8.1/firebase-analytics.js"; import { getToken, onMessage } from "https://www.gstatic.com/firebasejs/9.8.1/firebase-messaging.js"; import { getMessaging,onBackgroundMessage } from "https://www.gstatic.com/firebasejs/9.8.1/firebase-messaging-sw.js"; const firebaseConfig = { apiKey: "xxxxxxx", authDomain: "xxxxxxx", projectId: "xxxxxxx", storageBucket: "xxxxxxx", messagingSenderId: "xxxxxxx", appId: "xxxxxxx", measurementId: "xxxxxxx" }; const app = initializeApp(firebaseConfig); const analytics = getAnalytics(app); const messaging = getMessaging(app); getToken(messaging, { vapidKey: 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx' }).then((currentToken) => { if (currentToken) { console.log(currentToken); } else { alert('No registration token available. Request permission to generate one'); } }).catch((err) => { console.log('An error occurred while retrieving token. ', err); }); onMessage(messaging, (payload) => { console.log('Message received. ', payload); }); onBackgroundMessage(messaging, (payload) => { console.log('[firebase-messaging-sw.js] Received background message ', payload); if (!(self.Notification && self.Notification.permission === 'granted')) { return; } self.registration.showNotification(payload.data.title, { body: payload.data.body, icon: 'icon-512x512.png', badge: '/favicon.ico', tag: 'renotify', renotify: true, }) .then(() => self.registration.getNotifications()) .then(notifications => { setTimeout(() => notifications.forEach(notification => notification.close()), 3000); }); }); </script>

¿Qué he hecho mal?