Javascript Web推送通知js/php

我在web推送通知方面遇到困难。事实上，我的服务人员的注册、用户的订阅（在DB中）和发送工作正常（至少没有明显的错误）。 但是navigator没有收到任何东西。 我和Symfony一起工作

谢谢你，如果你能帮我的话。再见

file.js

    window.onload = function () {

    if (!('serviceWorker' in navigator) || !('PushManager' in window)) {
        console.log("Navigateur incompatible avec les notifications")
        return;
    } else {
        registerServiceWorker().then(function () {

            askPermission().then(function () {
                getNotificationPermissionState().then(function () {
                    subscribeUserToPush().then(function (subscription) {
                        sendSubscriptionToBackEnd(subscription);
                    })
                })
            })
        })
    }
}


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

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

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


function getSWRegistration() {
    return navigator.serviceWorker.register('http://localhost/serviceWorker.js');
}


function registerServiceWorker() {
    return navigator.serviceWorker.register('http://localhost/serviceWorker.js')
        .then(function (registration) {
            console.log(registration)
            console.log('Service worker successfully registered.');
            return registration;
        })
        .catch(function (err) {
            console.error('Unable to register service worker.', err);
        });
}


function askPermission() {
    return new Promise(function (resolve, reject) {
        const permissionResult = Notification.requestPermission(function (result) {
            resolve(result);
        });

        if (permissionResult) {
            permissionResult.then(resolve, reject);
        }
    })
        .then(function (permissionResult) {
            if (permissionResult !== 'granted') {
                throw new Error('We weren\'t granted permission.');
            }
        });
}


function getNotificationPermissionState() {
    if (navigator.permissions) {
        return navigator.permissions.query({name: 'notifications'})
            .then((result) => {
                return result.state;
            });
    }

    return new Promise((resolve) => {
        resolve(Notification.permission);
    });
}


function subscribeUserToPush() {
    return getSWRegistration()
        .then(function (registration) {
            const subscribeOptions = {
                userVisibleOnly: true,
                applicationServerKey: urlBase64ToUint8Array(
                    'publicKey'
                )
            };
            return registration.pushManager.subscribe(subscribeOptions);

        })
        .then(function (pushSubscription) {
            console.log('Received PushSubscription: ', JSON.stringify(pushSubscription));
            return pushSubscription;
        });
}


function sendSubscriptionToBackEnd(subscription) {
    console.log(subscription)
    $.ajax({
        type: "POST",
        url: "{{ path('cr_whiz_sub') }}",
        data: {
            subscription: JSON.stringify(subscription)
        },
        success: function (response) {
            console.log(response);
        }
    })
}

self.addEventListener('push', function(event) {
console.log('[Service Worker] Push Received.');
console.log(`[Service Worker] Push had this data:`);   });

发送通知 使用此捆绑包：

serviceWorker.js

    window.onload = function () {

    if (!('serviceWorker' in navigator) || !('PushManager' in window)) {
        console.log("Navigateur incompatible avec les notifications")
        return;
    } else {
        registerServiceWorker().then(function () {

            askPermission().then(function () {
                getNotificationPermissionState().then(function () {
                    subscribeUserToPush().then(function (subscription) {
                        sendSubscriptionToBackEnd(subscription);
                    })
                })
            })
        })
    }
}


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

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

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


function getSWRegistration() {
    return navigator.serviceWorker.register('http://localhost/serviceWorker.js');
}


function registerServiceWorker() {
    return navigator.serviceWorker.register('http://localhost/serviceWorker.js')
        .then(function (registration) {
            console.log(registration)
            console.log('Service worker successfully registered.');
            return registration;
        })
        .catch(function (err) {
            console.error('Unable to register service worker.', err);
        });
}


function askPermission() {
    return new Promise(function (resolve, reject) {
        const permissionResult = Notification.requestPermission(function (result) {
            resolve(result);
        });

        if (permissionResult) {
            permissionResult.then(resolve, reject);
        }
    })
        .then(function (permissionResult) {
            if (permissionResult !== 'granted') {
                throw new Error('We weren\'t granted permission.');
            }
        });
}


function getNotificationPermissionState() {
    if (navigator.permissions) {
        return navigator.permissions.query({name: 'notifications'})
            .then((result) => {
                return result.state;
            });
    }

    return new Promise((resolve) => {
        resolve(Notification.permission);
    });
}


function subscribeUserToPush() {
    return getSWRegistration()
        .then(function (registration) {
            const subscribeOptions = {
                userVisibleOnly: true,
                applicationServerKey: urlBase64ToUint8Array(
                    'publicKey'
                )
            };
            return registration.pushManager.subscribe(subscribeOptions);

        })
        .then(function (pushSubscription) {
            console.log('Received PushSubscription: ', JSON.stringify(pushSubscription));
            return pushSubscription;
        });
}


function sendSubscriptionToBackEnd(subscription) {
    console.log(subscription)
    $.ajax({
        type: "POST",
        url: "{{ path('cr_whiz_sub') }}",
        data: {
            subscription: JSON.stringify(subscription)
        },
        success: function (response) {
            console.log(response);
        }
    })
}

self.addEventListener('push', function(event) {
console.log('[Service Worker] Push Received.');
console.log(`[Service Worker] Push had this data:`);   });

---

发现了一些东西。在发送通知代码中，在发送过程中出现cURL error 28 timeout。如果你知道那件事，我就接受了。