Previously registered users don't receive chrome push after using notification payload - javascript

I have recently been facing a problem regarding a web-push notification system via service worker.
After upgrading our service worker's javascript to use the payload sent along with the push data in the event, all the users that registered to our push notification service prior to the service worker modification do not receive the notifications anymore.
I was able to observe that there seems to be an encryption problem at sending the push notification to the google API to then be forwarded to the user's chrome device.
What confuses me is that, while updating a service worker (i.e. in the install event) the subscription (returned by self.registration.pushManager.getSubscription()) object doesn't change, so I don't really undersand why would there be a problem to send the notification if the user information provided by the chrome api remains the same.
Could it also be because of a chrome upgrade that somehow changed the way to encrypt push data?
Have you guys faced the same problem ? Do you have any leads on where could the problem come from ?
Thanks in advance :)

I will be under the assumption here that
upgrading our service worker's javascript
means that there is a substantial change in your SW code and how it handles caching and stuff. My guess there is how you wrote the SW code and Check out this answer. I haven't tried it our yet. But it sounds like a viable solution.

Related

How to receive and handle Chrome notifications/push-notification?

I just want to write a small script that does Foo() whenever I receive a push notification from my browser(chrome). I tried to find some stuff out there but all I found was how to send said notifications, but I only want to receive them. Anybody can lead me in the right direction?
I do not own the backend that sends the notifications
There is no frontend, its notification from the browser
I am currently trying with a browser extension, but cant access the notification. I do not know if browser extension is the way to go, that should be clear from my initial post.
If the question is about intercepting notifications that are generated on the web page with the Notification API, this answer explains how: Intercept HTML5 Web Notifications in a browser environment
To sum it up, it consists in the creation of a Proxy as a wrapper of the native Notification in order to hook into its constructor and execute arbitrary code.
If the question is about intercepting Push Notifications then it is impossible because they are based on the Service worker. You can't hook into the service worker, and you can't register your own service worker without overriding the existing one (which will break the web page), as stated in the documentation:
If there is an existing service worker available, the new version is
installed in the background, but not yet activated — at this point it
is called the worker in waiting. It is only activated when there are
no longer any pages loaded that are still using the old service
worker. As soon as there are no more pages to be loaded, the new
service worker activates (becoming the active worker).

How to handle offline messages in React-Native using NodeJS and SocketIO

I am currently using SocketIO and NodeJS to handle messages. However the problem is that when the user becomes offline there's no way that the other user will receive the message.
The solution I came up with was to store the message in the database.
But a new problem arise, when fetching the message and push notification.
If I do fetch for "n" minutes in the server when the app is in background/inactive. There will be a lot of request in the server, and I personally think that it is inefficient. and also it drains the battery.
What is the proper way how to handle fetching the messages from database or pushing notification in app without making too much request in "n" minutes and draining too much power?
You need to save the last sync time in the App. And whenever app comes from background/Inactive state. You need to call an API with this time. This API will give you all the messages and the Push notification which has comes after the last sync time. In this way, With one API call, you will be able to get all the messages and push notifications. I had used this approach to syncing my data in one of my app.
My suggestion is to implement a system of background jobs in the API, checking when there is a new notification to be launched, or with the notification already ready waiting to be launched in the queue. You can search for queue manager like Bull, Bee-Queue.
To launch push notification in the closed/inactive app, you can use a service like OneSignal or Firebase.
I implemented this a few weeks ago and did it this way.
API = Node.js, Bull Queue
App = React Native, OneSignal
Going back to this question if somebody stumbled upon this question.
The best way to handle offline messages regardless if you are using NodeJS/MongoDB, etc. is to store it on server's database. Then call an API that fetches the the messages which is equal to user's ID whenever the mobile app comes to foreground.
If your problem is that you needed notification and you are using
react-native-push-notifications / react-native-push-notification-ios
Then you should use the data notification to include the message on notification parameter on the server's side(Assuming that you are using Firebase Cloud Messaging). With this way you can directly save the message on the mobile's database.

PWA - How to send push notifications to all subscribed users

I would like to set up a notifications system to be used when a new update of my progressive web app is available.
The pwa uses react and has node (with express) as the backend.
I followed google's guide to push notifications (link) and everything works fine when sending a push message from the devTools' service workers tab.
The problem is that the guide ends there and i would like to be able to send a notification to every subscribed user.
I tried to look for a solution and i found out that Firebase Cloud Messaging could do what i need, but when i tried to implement it i got a bit confused as it seems quite different from what I've done in the guide mentioned above.
I've also looked at other guides here and there but they don't do what i need and some of them doesn't even work.
Can someone please explain me what should i do the get that result?
Thanks in advance for the help, i hope my question isn't too stupid '^^

Can a service worker update the cache without an open tab?

I want to give the user a speed feel when he accesses my website. If I cache the initial page in service worker, then I can achieve it. But I am having the following doubts.
Is there any way to update that cache even user does not have any tabs with my website?
Is there any memory limitation?
1) Not in a simple way - your Service Worker is suspended until something wakes it up, for example the user opening your app. Or the push message. So you might run your cache update flow in a push message handler and send the push to all subscribed users whenever the update should happen. But you have to be aware that there are limitations of how many pushes can the app receive and/or how long the handler can run.
"Normally" this is done when the new Service Worker version is installing and requires reload (or manual handling) to take effect.
2) Yes, the general storage limit applies. It is OS-specific and you can query for the estimate with Quota Estimation API (Chrome only by now).

How to send web notification using OneSignal js

I'm new in OneSignal, and after cofigure my OneSignal, I want to send notification via my script using OneSignal API, can anyone help me? I doesn't have any idea for this, I have read the API referrence but I don't know how to start this.
Notifications can be sent through the OneSignal REST API, as documented here: https://documentation.onesignal.com/reference#create-notification
In general notifications should be sent from your server code, and not your client code. This is because sending a notification usually requires a private API key for security, and this key must be kept secret. You can find examples of how to do this in various languages near the bottom of the page linked above.

Categories

Resources