I am trying to implement Safari Web Push using the document to setup APNS and receive silent push messages on a react app on Safari browser.
At this point, I have added an endpoint to get push packages on calling window.safari.requestPermission. This prompts the user to enable notification and grants the permission and returns with a device token.
I have a server-side node script implemented using node-apn to send a silent push message to the client using a device token. The send function resolves with a successful response.
Sample message packet that I am sending via APNS:
{
"aps": {
"content-available": 1
},
"customData": "custom data",
"topic": "web.push.ID"
}
I am expecting the payload to be delivered to the client through an event. I am trying this with the below function on the web page.
window.addEventListener('push', function (event) {
if (event && event.push) {
const payload = event.push;
console.log('safari received payload in window.addEventListener:', payload);
}
});
However, I do not see any message coming to the client.
Can someone please point me to what I am missing here? Thanks a lot for your help in advance.