在通知点击时打开已安装的 PWA

Question

I'm actually open a new window when user clicks a notification generated by the backend, this works fine on browser, because it open a new tab when the browser is opened or open a new window if not.

But if i have an installed PWA, on notification click it open a new browser window an not opens the PWA.

here is my notificationclick event code:

if the PWA is open, i call focus() and then navigate(url), but if the PWA is closed i can't open the PWA and then call the focus and navigate functions.

event.waitUntil(clients.matchAll({
        type: "window"
    }).then(function (clientList) {
        console.log('clientList: ', clientList);
        if (data.WebUrl) {
            for (var i = 0; i < clientList.length; i++) {
                var client = clientList[i];
                console.log('client: ', JSON.stringify(client), client);
                if ('focus' in client) {
                    client.focus();
                    // try to navigate to the url in the focused client
                    client.navigate(data.WebUrl).then((response) => {
                        event.notification.close();
                    });
                    break;
                }
                else {
                    clients.openWindow(data.WebUrl);
                    event.notification.close();
                }
            }
        }
    }));

if there a way to open the PWA programatically?

Answer 1

I was finally able to achieve what I wanted with the following:

event.waitUntil(clients.matchAll({
    type: "window",
    includeUncontrolled: true
}).then(function (clientList) {
    if (data.WebUrl) {
        let client = null;

        for (let i = 0; i < clientList.length; i++) {
            let item = clientList[i];

            if (item.url) {
                client = item;
                break;
            }
        }

        if (client && 'navigate' in client) {
            client.focus();
            event.notification.close();
            return client.navigate(data.WebUrl);
        }
        else {
            event.notification.close();
            // if client doesn't have navigate function, try to open a new browser window
            return clients.openWindow(data.WebUrl);
        }
    }
}));