web-push - サイトがフォアグラウンドでフォーカスされている場合、プッシュ通知に応答して通知を表示する必要がありますか?

Question

Web プッシュ通知を使用するプログレッシブ Web アプリを構築しており、現在自分のサイトを閲覧しているデスクトップまたはモバイルのユーザーに通知が表示されないようにしたいと考えています。

プッシュ イベントが処理されたときにサイトに常に通知を表示する必要があることは承知していますが、前述のようにサイトが開いていてフォーカスがある場合、通知の表示をスキップできますか?

また、通知を表示するかどうかを決定するときに、上記のことを決定することは可能ですか?

Answer 1

サイトが表示されている場合、通知を表示する必要はありません。

これは次のように実装できます。

self.addEventListener('push', event => {
    return clients.matchAll({ type: 'window' }).then(clients => {
        for (let i = 0; i < clients.length; ++i) {
            if (clients[i].visibilityState === 'visible')
                return;  // there is a visible window
        }

        // continue with showing a notification
    });
});