Why are my PushSubscriptions expiring so quickly?

Question

I followed this tutorial to implement push notifications in my web app, and while they work, they stop working very quickly. It seems to handle the first couple of notifications well, but after that, sometimes when less than five minutes has gone by, the subscription expires, according to my back-end. I get an error code of 410 from the push service which the tutorial says is meant to indicate that the subscription expired.

This is crazy, how can a subscription expire in less than five minutes? I searched up my issue and it seems no one else has had this problem, some even saying that subscriptions can last years!

I tried implementing an event listener in my service worker for the "pushsubscriptionchange" event, but according to Serginho's answer, Chrome did not implement that event as of 2019, and I don't think that's changed since then.

Oh, and while Chrome can handle the subscription (but only once/twice as explained above), Firefox doesn't even do anything. I feel like I'm going crazy. If I test the push subscription feature itself using this site, however, it works in Firefox! and Chrome! What are they doing that I'm not? They show the exact same code as the tutorial I linked above.

What even can I do at this point? I've considered perhaps creating an interval with setInterval() and just resubscribing the user every second or so, but I don't think that'll work.

Any help would be appreciated.

Sitar

This issue is hunting me for more than a year now. The same issue. I tested with cron-jobs to send me push notifications and it only works the first day. It gets expires and useless in the following days. Any update? – Godmother

Answer 1

You absolutely need to handle the pushsubscriptionchange in your service worker. Otherwise when a subscription expires and is replaced with a new one you will lose it.

Chrome and most browsers actually trigger that event (I don't know where you read something different). I am sure that it is triggered because on our push service we receive thousands of hits per hour from that event.

Take a look at our service worker if you need inspiration on how to implement that event. Then on your server you simply replace the old subscription with the new one.

Nonperformance

Hey @Nonperformance I am trying to listen to pushsubscriptionchangeand then consoling it, but it is not working for us I have tried Edge,chrome,opera. – Porscheporsena

I followed every single suggestion and none of them worked. Never hits anything from pushsubsriptionchange. I do not know what you did to trigger it, but chrome doesn't support it. bugs.chromium.org/p/chromium/issues/detail?id=646721 – Godmother

Are you using google gcm or other providers like onesignal? – Godmother

Chrome currently does not implement pushsubscriptionchange: chromestatus.com/feature/6242325854420992 – Limit

Answer 2

Are you doing a hard refresh in your browser by any chance? We have recently been working on a Web Push integration and had some issues with hard refreshes, which as developers we do continually to ensure our latest app is running in the browser.

A Hard Refresh i.e. Ctrl + F5 or Command + R not only forces a cache refresh, but it also expires your Push Subscriptions for the App, AND causes your service worker to not be registered. see Register service worker after hard refresh for example.

If you are actively testing your application, subscribing to PUSH notifications, passing your Push Subscription to your back end, and then hard refreshing your application, then you are expiring your subscriptions.

If this is the case, you can handle the hard refresh. You need to detect whether your service worker has been registered. If not, perform a soft reload, which will register your service worker.

You also need to be communicating the Push Subscription to the back end more frequently.

In our UI application, an Angular SPA, we subscribed to the SWPush.PushSubscription so when that PushSubcription changes we push it to our back end API.

This ensures that whatever the user does, hard refreshes, managing notification settings through the browser settings etc our application always has the latest Push Subscription for the user.

Misbegotten

Answer 3

I followed this tutorial to implement push notifications in my web app, and while they work, they stop working very quickly. It seems to handle the first couple of notifications well, but after that, sometimes when less than five minutes has gone by, the subscription expires, according to my back-end.

I don't think it's possible that the subscription is expiring in less than five minutes. In fact, as far as I can tell, subscriptions never expire in Firefox or Chrome.

I get an error code of 410 from the push service which the tutorial says is meant to indicate that the subscription expired.

An HTTP 410 Gone error indicates that the subscription no longer exists — which is not the same as indicating that it has expired. There are other ways that a subscription might cease to exist; for example:

• The pushSubscription object has an unsubscribe() method [MDN link], and if you call that in your site JavaScript, then the push subscription will be removed.
• Push notifications only work if the user allows them to. If the user revokes a site's permission to send them, then the push subscription will be removed.

I don't know if either of those is plausible in your setup. I recommend adding as much logging as possible to your client-side code, to try to narrow down where this might be going wrong.

Ambitendency