PushPad：站点刷新后订阅被删除

Question

我已经集成了 PushPad 并设法使其适用于静态推送。现在我想将它与一些 PHP 和 Javascript 函数结合起来使其动态化。这是我的代码：

<script>
    (function(p,u,s,h,x){p.pushpad=p.pushpad||function(){(p.pushpad.q=p.pushpad.q||[]).push(arguments)};h=u.getElementsByTagName('head')[0];x=u.createElement('script');x.async=1;x.src=s;h.appendChild(x);})(window,document,'https://pushpad.xyz/pushpad.js');

    //Install Pushpad
    pushpad('init', myprojectnumber);
    alert("Pushpad initialised");
    //Check subscribe-status
    pushpad('status', function (isSubscribed, tags){
        //User is already subscribed
        if (isSubscribed){
            alert("Already subscribed");
        //User has not subscribed
        }else{
            alert("Not subscribed");
            //Check in database if this logged-in-user has already subscribed with 5 different devices, if not generate UID and UID_SIGNATURE
            var username = $('#username_show').html();

            alert('Username: ' + username);
            $.ajax
            ({                                        
                type: "POST",
                data: {username: username},
                dataType: "json",
                url: "setNotifications.php",
                cache: false,
                success: function(data)
                {
                    alert("Ajax successfull. UID generated.");

                    if (data.uid != 0){
                        //Set UID and UID-SIGNATURE
                        pushpad('uid', data.uid, data.uid_signature);
                        alert('UID:' + data.uid);
                        //Subscribe
                        pushpad('subscribe', function(isSubscribed){
                            if (isSubscribed){
                                alert("Subscribed");
                            }else{
                                alert("Notifications blocked");
                            }

                        });
                    //Already 5 devices subscribed
                    }else{
                        alert("Already 5 devices");
                    }
                },
                error: function()
                {
                    alert('Error');
                }
            });
        }
    });
</script>

初看起来一切正常。如果我第一次访问该站点，所有警报都会弹出，直到 "UID"-警报。然后 Chrome 要求我接受推送通知。我单击允许，然后弹出警报 "Subscribed"。

如果我现在刷新网站，一切都会重复直到 "Subscribed"-alert（但不再要求我允许 Chrome 推送通知）。我本以为警报 "Already subscribed" 应该出现，因为我之前订阅过，但它没有。

如果有人能提供帮助，我们将不胜感激:-)

Answer 1

问题是 status returns 当前用户 (uid) 的订阅状态。您只为订阅设置了 uid，状态不知道。

这就是您的代码中发生的情况：

用户实际订阅了推送通知
您刷新页面
status 检查是否有对 uid = null 的订阅（不是实际的用户 id，因为还没有设置！）
它 returns 错误，因为没有 uid = null
再次触发订阅流程

解决方案是将所有 Pushpad 代码移到 AJAX 成功回调中。所以你的顺序如下：

推板('init')
您的 ajax 回调
成功后，您使用 pushpad('uid')
推板('status')
在 pushpad('status') 回调中使用 pushpad('subscribe')

顺便说一句，为什么要使用 AJAX 回调来获取 uid？如果在您呈现包含 Pushpad 代码的页面时用户已登录您的网站，您可能已经知道 uid（例如用户电子邮件或数据库中的用户 ID）。你可以做类似 pushpad('uid', '<?= $uid ?>', '<?= $uid_signature ?>');

PushPad：站点刷新后订阅被删除

PushPad: Subscribe is removed after site refresh

google-chrome

push-notification

web-push

push-api

pushpad