Как предложить перезагрузку страницы, когда работник службы обновляется после обновления страницы? - PullRequest
Новая
       15

Как предложить перезагрузку страницы, когда работник службы обновляется после обновления страницы?

0 голосов
/ 03 июня 2019

В настоящее время я использую последнюю версию Workbox 4.3.1 с workbox-window, я предлагаю пользователям перезагрузить страницу, прослушивая событие waiting, я использую код, предоставленный на Расширенные рецепты страница документации Workbox.

Код на странице: 

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();
}

Код в файле рабочего сервиса: 

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

IЯ проверил его, и он работает отлично, я могу показать пользователю снек-бар и сообщить ему, что есть обновление, и когда они его принимают, сервисному работнику отправляется сообщение SKIP_WAITING для вызова skipWaiting().

Давайте предположим, что пользователь не принял приглашение перезагрузки и обновил страницу или перешел на другую страницу, новый работник службы будет ждать и не активироваться, и это нормальное поведение, но мой вопрос заключается в том, как я могупоказать пользователю эту перезагрузку, если он обновился или перешел на другую страницу?Похоже, что событие waiting происходит только один раз.

...