更改推送管理器订阅中的应用程序服务器密钥

Question

我使用 Service Worker 实现了网络推送通知。我使用特定的应用程序服务器密钥收集了用户订阅。假设如果我们更改应用服务器密钥，那么当我们使用“reg.pushManager.getSubscription()”获取订阅时，我们将获得使用旧应用服务器密钥创建的旧订阅信息。如何处理这种情况？如何从用户那里获取新订阅？

Answer 1

使用获取订阅reg.pushManager.getSubscription()并检查当前订阅是否使用新的应用服务器密钥。如果没有，则unsubscribe()在现有订阅上调用函数并再次重新订阅。

Answer 2

正确启动 Service Worker 并获得权限后，调用navigator.serviceWorker.ready以访问该*.pushManager对象。

从这个对象中，我们调用另一个 Promise 来获取pushSubscription我们真正关心的对象。

如果用户从未订阅过，否则我们pushSubscription会null从中获取密钥并检查它是否不同，如果是这种情况，我们会取消订阅用户并再次订阅他们。

var NEW_PUBLIC_KEY = 'XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX';
    
Notification.requestPermission(function (result) {
    if (permissionResult == 'granted'){
        subscribeUser();
    }
});
    
function subscribeUser() {
    navigator.serviceWorker.ready
    .then(registration => {
        registration.pushManager.getSubscription()
        .then(pushSubscription => {
            if(!pushSubscription){
                //the user was never subscribed
                subscribe(registration);
            }
            else{
                //check if user was subscribed with a different key
                let json = pushSubscription.toJSON();
                let public_key = json.keys.p256dh;
                
                console.log(public_key);
                
                if(public_key != NEW_PUBLIC_KEY){
                    pushSubscription.unsubscribe().then(successful => {
                        // You've successfully unsubscribed
                        subscribe(registration);
                    }).catch(e => {
                        // Unsubscription failed
                    })
                }
            }
        });
    })
}

function subscribe(registration){
    registration.pushManager.subscribe({
        userVisibleOnly: true,
        applicationServerKey: urlBase64ToUint8Array(NEW_PUBLIC_KEY)
    })
    .then(pushSubscription => {
        //successfully subscribed to push
        //save it to your DB etc....
    });
}

function urlBase64ToUint8Array(base64String) {
    var padding = '='.repeat((4 - base64String.length % 4) % 4);
    var base64 = (base64String + padding)
        .replace(/\-/g, '+')
        .replace(/_/g, '/');

    var rawData = window.atob(base64);
    var outputArray = new Uint8Array(rawData.length);

    for (var i = 0; i < rawData.length; ++i) {
        outputArray[i] = rawData.charCodeAt(i);
    }
    return outputArray;
}