service-worker - ページの更新後に Service Worker が更新されたときにページの再読み込みを提供するにはどうすればよいですか?

Question

私は現在、最新のワークボックス バージョン 4.3.1 を使用しています。イベントworkbox-windowをリッスンしてユーザーにページのリロードを提供しています。ワークボックス ドキュメントの高度なレシピwaitingページで提供されているコードを使用しています。

ページ上のコード:

if ('serviceWorker' in navigator) {
  const wb = new Workbox('/sw.js');

  // Add an event listener to detect when the registered
  // service worker has installed but is waiting to activate.
  wb.addEventListener('waiting', (event) => {
    // `event.wasWaitingBeforeRegister` will be false if this is
    // the first time the updated service worker is waiting.
    // When `event.wasWaitingBeforeRegister` is true, a previously
    // updated same service worker is still waiting.
    // You may want to customize the UI prompt accordingly.

    // Assumes your app has some sort of prompt UI element
    // that a user can either accept or reject.
    const prompt = createUIPrompt({
      onAccept: async () => {
        // Assuming the user accepted the update, set up a listener
        // that will reload the page as soon as the previously waiting
        // service worker has taken control.
        wb.addEventListener('controlling', (event) => {
          window.location.reload();
        });

        // Send a message telling the service worker to skip waiting.
        // This will trigger the `controlling` event handler above.
        // Note: for this to work, you have to add a message
        // listener in your service worker. See below.
        wb.messageSW({type: 'SKIP_WAITING'});
      },

      onReject: () => {
        prompt.dismiss();
      }
    })
  });

  wb.register();
}

Service Worker ファイルのコード:

self.addEventListener('message', (event) => {
  if (event.data && event.data.type === 'SKIP_WAITING') {
    self.skipWaiting();
  }
});

私はそれをテストしましたが、問題なく動作しています。ユーザーにスナックバーを表示して、更新があることをユーザーに知らせることができます。ユーザーが受け入れるとSKIP_WAITING、Service Worker に電話するようメッセージが送信されますskipWaiting()。

ユーザーがリロード プロンプトを受け入れず、ページを更新したか、別のページに移動したと仮定しましょう。新しい Service Worker は待機したままになり、アクティブ化されません。これは通常の動作ですが、私の質問は、このリロードをどのように表示できるかです。ユーザーが別のページを更新したり、別のページに移動した場合にプロンプ​​トを表示しますか? waitingイベントは一度だけ発生するようです。