Событие извлечения не выполняется при первой загрузке страницы в сервисном работнике, потому что клиент не зарегистрирован - PullRequest
0 голосов
/ 26 ноября 2018

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

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

мой образец приложения, размещенный здесь https://ajeeshc.github.io/#/comments

Мой рабочий файл сервиса доступен в здесь

завершенорасположение демо-кода здесь

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

ниже - регистрационный код моего работника службы.

if ('serviceWorker' in navigator) {
  navigator.serviceWorker
    .register('service-worker.js', { scope: './' })
    .then(function (registration) {
      console.log("Service worker registered - from the 24 ", registration)
      registration.addEventListener('updatefound', () => {
        newWorker = registration.installing;
        newWorker.addEventListener('statechange', () => {
          switch (newWorker.state) {
            case 'installed':
              if (navigator.serviceWorker.controller) {

                showUpdateBar();
              }
              break;
          }
        });
      });
    })
    .catch(function (err) {
      console.log("Service Worker Failes to Register", err)
    })

  navigator.serviceWorker.addEventListener('message', function (event) {
    document.getElementById("cache-generic-msg").style.display = "block";
    console.log("Got reply from service worker: " + event.data);
  });

  let refreshing;
  navigator.serviceWorker.addEventListener('controllerchange', function () {
    if (refreshing) return;
    window.location.reload();
    refreshing = true;
  });

}

1 Ответ

0 голосов
/ 05 декабря 2018

после нескольких исследований я нашел то, что мне здесь не хватало.с моим кодом при первой загрузке сервисный работник не регистрируется на клиенте.Это не может вызвать любое событие извлечения.если вы видите вкладку приложения, вы можете проверить, зарегистрирован клиент или нет.если он зарегистрирован, у вас будет имя там, иначе оно будет пустым enter image description here

Теперь, как зарегистрировать клиент при первой загрузке, используйте

self.clients.claim ()

Пожалуйста, найдите код ниже

self.addEventListener('activate', (event) => {
    console.info('Event: Activate');
    event.waitUntil(
        self.clients.claim(),
        caches.keys().then((cacheNames) => {
            return Promise.all(
                cacheNames.map((cache) => {
                    if (cache !== cacheName) {
                        return caches.delete(cache);
                    }
                })
            );
        })
    );
});
...