Добавьте приглашение «Обновление доступно, пожалуйста, обновите» в PWABuilder Cache-first сервисный работник - PullRequest
Новая
       140

Добавьте приглашение «Обновление доступно, пожалуйста, обновите» в PWABuilder Cache-first сервисный работник

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

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

Эти реализации являются хорошим примером:

  1. Демонстрация работника сервиса от Mozilla

  2. Подход № 3 в этой статье .

Я использую сервис-кеша, предоставленный PWABuilder. Он работает хорошо, но не предлагает пользователю доступных обновлений.

Я пытался скопировать код из статей выше, но не смог заставить его работать.

Вот репо работника службы, которого я сейчас использую.

Код, который я пытаюсь добавить в сценарий рабочего сервиса: 

addEventListener('message', messageEvent => {
  if (messageEvent.data === 'skipWaiting') return skipWaiting();
});

Скрипт, который я пытаюсь добавить на веб-страницу: 

/ reload once when the new Service Worker starts activating
var refreshing;
navigator.serviceWorker.addEventListener('controllerchange',
  function() {
    if (refreshing) return;
    refreshing = true;
    window.location.reload();
  }
);
function promptUserToRefresh(reg) {
  // this is just an example
  // don't use window.confirm in real life; it's terrible
  if (window.confirm("New version available! OK to refresh?")) {
    reg.waiting.postMessage('skipWaiting');
  }
}
listenForWaitingServiceWorker(reg, promptUserToRefresh);

Если я просто добавлю этот код к работнику сервиса и веб-странице с уважением, работник сервиса будет работать нормально. Но подсказка обновления не работает.

Я получаю эту ошибку в консоли: 

Uncaught ReferenceError: reg is not defined
    at (index):231

1 Ответ

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

Что ж, ваша проблема не обязательно связана с работниками сервиса :). Если вы внимательно посмотрите на сообщение об ошибке (показанное в консоли), вы увидите, что оно явно говорит вам переменнуювызываемый рег не определен .Другими словами, где-то в вашем коде вы пытаетесь сослаться на переменную с именем «reg», но «reg» там не существует.

Кажется, что код, вставленный в ваш вопрос, не являетсяВ общем, но я подозреваю, что проблема заключается здесь: 

listenForWaitingServiceWorker(reg, promptUserToRefresh);

В любом случае, сообщение об ошибке говорит вам, что проблема возникает в строке 231 в вашем HTML-файле, так что проверьте это.

...