Service Worker: ошибка из-за ошибки (в Promise) TypeError: схема запроса 'data' не поддерживается - PullRequest
0 голосов
/ 01 октября 2018

Что происходит при первой загрузке веб-сайта, при поиске и кэшировании не возникает никаких проблем.Но при обновлении (обычная перезагрузка) событие Fetch обнаруживает проблему и показывает это в журнале консоли.

Uncaught (в обещании) TypeError: Схема запроса 'data' не поддерживается в self.addEventListener.e.respondWith.fetch.then.caches.open.then.cache

Я понял, что при перезагрузке он получает format data:[<mediatype>][;base64],<data>, что вызывает ошибку в журнале консоли.

// Call Fetch Event
self.addEventListener('fetch', e => {
  console.log('Service Worker: Fetching');
  e.respondWith(
    fetch(e.request)
      .then(res => {
        // Make copy/clone of response
        const resClone = res.clone();
        // Open cahce
        caches.open(cacheName).then(cache => {
          // Add response to cache
          cache.put(e.request, resClone);
        });
        return res;
      })
      .catch(err => caches.match(e.request).then(res => res))
  );
});

Я хочу избежать этой ошибки, но не знаю как.

1 Ответ

0 голосов
/ 01 октября 2018

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

e.respondWith(
  caches.open(cacheName).then(cache => {
    cache.match(e.request).then(cacheResponse => {
      const networkFetch = fetch(e.request).then(networkResponse => {
        cache.put(e.request, networkResponse.clone());
        return networkResponse
      });

      return cacheResponse || networkFetch;
    });
  }).catch(error => {
    console.log('error in cache open: ', error)
  })
) 
...