如何在KaiOS应用中实现推送通知

Question

我正试图在KaiOS应用程序中实现推送通知。我只是遵循下面的链接。

• W3C推送API
• 推送API游戏攻略
• 服务工作者Cookbook - Web推送有效载荷

跟踪所有链接后，push在浏览器中工作，但在KaiOS应用程序中不起作用。如果任何人有任何样本代码或文件，请分享。

任何帮助都将是学徒。

Answer 1

1)首先，在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)服务工作者文件sw.js代码

self.addEventListener('push', function(event) {
    event.waitUntil(
        self.registration.showNotification('My Push', {
            body: 'Push Activated',
        })
    );
});

self.addEventListener('activate', e => {
    self.clients.claim();
});

3)在应用程序启动时添加服务人员

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)通过任何dom元素(如按钮)调用服务工作人员。

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);
                        }
                    });
                })
            }
        }
    });
}

就这样。

Answer 2

我也遇到了同样的问题，但是我遵循了这个简单的web推送通知方法，

https://medium.com/@seladir/how-to-implement-web-push-notifications-in-your-node-react-app-9bed79b53f34

我也解决了这个问题，现在它正常工作了。请不要忘记在manifest.webapp文件中添加下面这样的权限。

"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"
    }
},

同时，请参考这份kaios文档，以便在kaios设备上运行应用程序。

https://developer.kaiostech.com/getting-started/build-your-first-hosted-app/pwa-to-hosted-app