progressive web apps - PWApush notifications to trigger phone call - Stack Overflow

admin管理员组

文章数量:1123931

I want to give the user the option to make a phone call via a push notification. The notification is something like:

const options = {
    body: data.message,
    icon: 'icon.png',
    badge: 'badge.png',
    actions: [
        {
            action: 'call',
            title: `Call ${data.phone}`,
            type: 'button',
        },
    ],
};
self.registration.showNotification(data.title, options)

so currently I'm getting the notification and its button "call", though sometimes the button is hidden(is there an option to make it visible - maybe via removing the body?), but pressing the button or pressing the notification itself does not trigger a phone call. I've tried:

// option 1
window.open(`tel: 555555`, '_self');

// option 2
self.clients.matchAll({ type: 'window', includeUncontrolled: true }).then(clients => {
    clients.forEach(client => {
        client.focus().then(() => {
            client.postMessage({ type: 'CALL_PHONE', phone: data.phone });
        });
    });
});
// this goes to the PWA page that again has:
navigator.serviceWorker.ready.then(registration => {
    navigator.serviceWorker.addEventListener('message', event => {
        if (event.data && event.data.type === 'CALL_PHONE') {
            const phoneNumber = event.data.phone;
            window.open(`tel:${phoneNumber}`, '_self');
        }
    });
});

but neither is working. Any suggestions how to proceed? I'm ok with the notification opening the PWA with a custom URL that I can just add the button there, but so far can't trigger a page to open from it as well

Also, next to my custom button I'm also getting a "block" button - can this be removed so that it's not clicked by mistake?

本文标签： progressive web appsPWApush notifications to trigger phone callStack Overflow