在服务工作者中收听“sync”事件时，不会触发回叫

Question

I am listening to the 'sync' event in my service worker file but NOTHING happens. Even my console.log does not fire

I ensure that i returned a promise in the waitUntil() function.

this is what my main.js file looks like

finalOrder.addEventListener('submit', function(event) {
    event.preventDefault();
    var body = domArrayToObject(event.target)
    showForm();
    if ('serviceWorker' in navigator && 'SyncManager' in window) {
        (navigator.serviceWorker.ready
        .then(worker => {
            return worker.sync.register('write-req')
            .then(function(s){
                localStorage.setItem('req', JSON.stringify(body));
            }).catch(err => console.log(err))
        }).catch(err => console.log(err)))
    } else {
        sendMails(body);
    }
})

this is my sendMails function (urlstring is a firebase function endpoint)

function sendMails(body) {
     return (Promise.all([fetch('urlstring', {
        method: 'POST',
        body: JSON.stringify(body),
        headers:{
            'Content-Type': 'application/json'
        }
    })
    .then(res => res.json())
    .then(response => console.log(res))
    .catch(err => console.log(err)),
    fetch('urlstring', {
        method: 'POST',
        body: JSON.stringify(body),
        headers:{
            'Content-Type': 'application/json'
        }
    })
    .then(res => res.json())
    .then(response => console.log(res))
    .catch(err => console.log(err))]).catch(err => console.log(err)))
}

this is my service worker file

self.addEventListener('sync', ev => {
    console.log('[Yaay Internet Connection]', ev)
    if (ev.tag == 'write-req') {
        console.log('[Service Worker] Syncing new Posts');
        var body = localStorage.getItem('req');
        ev.waitUntil(sendMails(body)
        .then((res) => {
            self.registration.showNotification('Order has been placed!!!', 
            {
                body: 'Your Order has been placed. You will hear from us soon',
                image: '',
                icon: '',
                badge: '',
                actions: [
                    { action: 'add', title: 'add', icon: ''}
                ]
            })
        }));
    }
})

I want to listen to the 'sync' event and fire the callback. Sending the request to the endpoint if there is connection already or it is re established.

Answer 1

结果我所要做的就是使用indexedDB