// urlB64ToUint8Array is a magic function that will encode the base64 public key // to Array buffer which is needed by the subscription option const urlB64ToUint8Array = base64String => { const padding = '='.repeat((4 - (base64String.length % 4)) % 4) const base64 = (base64String + padding).replace(/\-/g, '+').replace(/_/g, '/') const rawData = atob(base64) const outputArray = new Uint8Array(rawData.length) for (let i = 0; i < rawData.length; ++i) { outputArray[i] = rawData.charCodeAt(i) } return outputArray } // saveSubscription saves the subscription to the backend const saveSubscription = async subscription => { const SERVER_URL = 'http://localhost:4000/save-subscription' const response = await fetch(SERVER_URL, { method: 'post', headers: { 'Content-Type': 'application/json', }, body: JSON.stringify(subscription), }) return response.json() } self.addEventListener('activate', async () => { // This will be called only once when the service worker is activated. try { const Key = urlB64ToUint8Array('BGAFAVqhKY9I5HVQcPsILjCntFlsZwZshFM-OueLLhhkSfp7i0lP0rj41Udja1Vka88A7w2Bw838EjFHo42xemM') const options = { applicationServerKey : Key, userVisibleOnly: true } const subscription = await self.registration.pushManager.subscribe(options) const response = await saveSubscription(subscription) } catch (err) { console.log('Error', err) } }) self.addEventListener('push', function(event) { if (event.data) { console.log('Push event!! ', event.data.text()) } else { console.log('Push event but no data') } })