How to implement push notification in KaiOS app - kaios

Question

I am trying to implement push notification in KaiOS app. I simply follow below links.
W3C Push API
Push API introduction
Service Worker Cookbook - Web Push Payload
After follow all links the push is working in browser but not in KaiOS app.
If anybody have any sample code or documents please share.
Any help will be appriciated.

Answer 1

1) First, add this permission in manifest.webapp
"permissions": {
"serviceWorker":{
"description": "required for handle push."
},
"push":{
"description": "New update push."
},
"desktop-notification": {
"description": "New content update notification for the user."
}
}
2) service worker file sw.js code
self.addEventListener('push', function(event) {
event.waitUntil(
self.registration.showNotification('My Push', {
body: 'Push Activated',
})
);
});
self.addEventListener('activate', e => {
self.clients.claim();
});
3) Add service worker on app start
registerSW : function() {
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('./sw.js').then(function(reg) {
console.log('Service Worker Registered!', reg);
reg.pushManager.getSubscription().then(function(sub) {
if (sub === null) {
} else {
console.log('Subscription object: ', sub);
}
});
}).catch(function(e) {
console.log('SW reg failed');
});
}
}
4) Call service worker by any dom element like button
registerServiceWorker: function() {
Notification.requestPermission().then(function(permission) {
if (permission === 'granted') {
if ('serviceWorker' in navigator) {
navigator.serviceWorker.ready.then(function(reg) {
reg.pushManager.subscribe({
userVisibleOnly: true
}).then(function(sub) {
console.log('Endpoint URL: ', sub.endpoint);
}).catch(function(e) {
if (Notification.permission === 'denied') {
console.warn('Permission for notifications was denied');
} else {
console.error('Unable to subscribe to push', e);
}
});
})
}
}
});
}
That's it.

Answer 2

I had same problem as this, but I followed this simple web push notification method,
https://medium.com/#seladir/how-to-implement-web-push-notifications-in-your-node-react-app-9bed79b53f34
as well as I fixed that issue and now It work properly. please don't forget to add permissions like below into the manifest.webapp file.
"permissions": {
"serviceworker": {
"description": "Needed for assocating service worker"
},
"desktop-notification": {
"description": "Needed for creating system notifications."
},
"notifications": {},
"push": {
"description": "Required for being updated with new goals in soccer matches"
},
"geolocation": {
"description": "Marking out user location"
},
"alarms": {
"description": "Scheduling alarms"
}
},
and as well as please refer this kaios documention for run the applicaion on kaios device.
https://developer.kaiostech.com/getting-started/build-your-first-hosted-app/pwa-to-hosted-app