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

【问题标题】：Changing application server key in push manager subscription在推送管理器订阅中更改应用程序服务器密钥
【发布时间】：2017-09-01 07:05:16
【问题描述】：

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

【问题讨论】：

检查w3c.github.io/push-api/#dfn-push-subscription

标签： push-notification service-worker firebase-notifications

【解决方案1】：

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

【讨论】：

你能详细说明一下吗？我无法确切了解在哪里可以获得订阅对象。
看这里：developer.mozilla.org/en-US/docs/Web/API/PushSubscription（示例代码）

【解决方案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;
}

【讨论】：

【解决方案3】：

就我而言，我设法通过清除缓存和 cookie 来解决它

【讨论】：

您的答案可以通过额外的支持信息得到改进。请edit 添加更多详细信息，例如引用或文档，以便其他人可以确认您的答案是正确的。你可以找到更多关于如何写好答案的信息in the help center。