Сервисный работник не возвращает файл из кеша - PullRequest
Новая
       27

Сервисный работник не возвращает файл из кеша

0 голосов
/ 18 мая 2018

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

С помощью функции предварительного кэширования я записываю некоторые файлы в кеш следующим образом: 

function precache() {
return caches.open(CACHE).then(function(cache) {
    return cache.addAll([
        'index.html',
        'js/script.js',
        'img/bg.png',
        'img/logo.svg',
        ...
    ]);
});
}

(я пытался кэшировать с и без "/" перед путями и даже с абсолютными путями. Не имеет значения)

В Cache Storage Chrome содержимое всех этих файловименно так, как и должно быть.Но когда я пытаюсь обслуживать файлы из кэша при перезагрузке страницы, ни один из запросов не совпадает с кешем, все они отклоняются, даже когда я все еще в сети. 

self.addEventListener('fetch', function(evt) {
    evt.respondWith(
        caches.match(evt.request).then(function(response) {
            if(response){
                return response;
            } else {
                reject('no result');
            }
        }).catch(function(){
            if(evt.request.url == 'https://myurl.com'){
                return caches.match('/index.html');
            }
        });
    )
});

Индекс.HTML-код из функции catch обрабатывается правильно и, в свою очередь, запрашивает другие файлы, например /js/script.js.Эти запросы отображаются в консоли следующим образом:

Request {method: 'GET', url: 'https://myurl.com/js/script.js', ... referrer:' https://myurl.com'}

Но они не возвращают ответ, только такое уведомление показывает:

FetchEvent для "https://myurl.com/js/script.js" привел к ответу сетевой ошибки:объект, который не был Ответом, был передан в responseWith ().

Я что-то здесь упускаю?

Ответы [ 2 ]

0 голосов
/ 09 марта 2019

У меня была такая же проблема, и она, кажется, была решена с помощью параметра ignoreVary:true.В документации прямо указано, что параметр cacheName игнорируется Cache.match()

0 голосов
/ 19 мая 2018

Благодаря ссылке от Rajit https://developer.mozilla.org/en-US/docs/Web/API/Cache/match Я обнаружил, что функция caches.match() принимает объект параметров.

Я обновил эту строку в моем сервисном работнике до 

caches.match(evt.request,{cacheName:CACHE,ignoreVary:true}).then(function(response) {

, поэтому он включает имя кэша и игнорирует сопоставление заголовка VARY, а теперь возвращает правильные файлы.

...