通过Chrome中的service-worker.js 24/7接收通知

Question

I've been doing push notifications, when I register the page then test it via curl commands, i received the notification!

However after a while (maybe 1-2 minutes), when I close the tab that the push notifications scope has been registered, then test the notifications again, i cant receive the notifications. This usually happens more in google Chrome in mobiles.

The workaround I did in here is that i need to go to the page of the scoped page first, then when I test the notification again, it now works. Though i cant have this because I need the clients to receive notifications without being on the site all the time.

Here are my push event in service worker

self.addEventListener('push', function(event) {
    var SOME_API_ENDPOINT = "https://somewhre.com/push_notification_api/service_worker_endpoint";

    event.waitUntil(
        fetch(SOME_API_ENDPOINT, {
                method: 'post',      
                headers: {  
                    "Content-type": "application/x-www-form-urlencoded; charset=UTF-8"  
                },  
                body: 'subscription_id=' + subscriptionId
            }).then(function(response) {

            return response.json().then(function(data) {
                var title = data.notification.title;
                var message = data.notification.message;
                var icon = base + "assets/images/logo_notification.png";
                var notificationTag = data.notification.url; 
                // var notificationTag = 'https://google.com'; //data.notification.tag;
                return self.registration.showNotification(title, {
                    body: message,
                    icon: icon,
                    tag: notificationTag
                });
            });
        })
    );
});

How do i make my service workers 24/7 even though i am not in the page of the scope in the registration of SW?

Do I need to use eventListeners 'install', 'activate' and 'fetch'?

Answer 1

Service workers appear to persist but really don't - a new instance spins up in response to events. This will be the case when restarting on mobile to handle a push event, but there are also suggestions that busy service workers should allow multiple instances in parallel.

Your subscriptionId is a global parameter, so it may well be undefined by the time your push event fires.

To fix this you need to retain the subscriptionId in some kind of storage (mayber IndexedDB).

I also think in order for a service worker to persist it needs to have an install event and that event needs to succeed.