Служба worker.js не обновляет изменения.Только если очищен кеш - PullRequest
Новая
       6

Служба worker.js не обновляет изменения.Только если очищен кеш

0 голосов
/ 30 сентября 2018

Это мое первое приложение PWA с Laravel.Этот код работает, он хорошо регистрируется, но если я делаю изменения в коде, например в HTML, он не получает обновления, и консоль не выдает ошибки, и я не знаю, почему.

Я использую этот код для вызова service-worker.js 

if ('serviceWorker' in navigator ) {
window.addEventListener('load', function() {
    navigator.serviceWorker.register('/service-worker.js').then(function(registration) {
        // Registration was successful
        console.log('ServiceWorker registration successful with scope: ', registration.scope);
    }, function(err) {
        // registration failed :(
        console.log('ServiceWorker registration failed: ', err);
    });
});

}

И это код sw.js 

var cache_name = 'SW_CACHE';
var urlsToCache = [
'/',
'/register'
];
self.addEventListener('install', function(event) {
    event.waitUntil(precache());
});
addEventListener('fetch', function(event) {
    event.respondWith(
    caches.match(event.request)
        .then(function(response) {
        // Cache hit - return response
        if (response) {
            return response;
        }
        var fetchRequest = event.request.clone();
        return fetch(fetchRequest).then(
            function(response) {
            // Check if we received a valid response
            if(!response || response.status !== 200 || response.type !== 'basic') {
                return response;
            }
            var responseToCache = response.clone();
            caches.open(cache_name)
                .then(function(cache) {
                cache.put(event.request, responseToCache);
                });
            return response;
            }
        );
        })
    );
});
var fromCache = function (request) {
    return caches.open(cache_name).then(function (cache) {
    cache.match(request).then(function (matching) {
        return matching || Promise.resolve('no-match');
    });
    });
}
var update = function (request) {
    return caches.open(cache_name).then(function (cache) {
    return fetch(request).then(function (response) {
        return cache.put(request, response);
    });
    });
}
var precache = function() {
    return caches.open(cache_name).then(function (cache) {
    return cache.addAll(urlsToCache);
    });
}

Y также использовал skipWaiting ();метод inner Устанавливает метод, но он вылетает из моего приложения и должен выгружать sw из chrome: // serviceworker-internals /

Ответы [ 2 ]

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

Служебный работник всегда будет использовать существующего работника.Два, что вы можете сделать, это в Chrome есть возможность установить обновление при загрузке

  1. Перейти к InspectorWindow (f12) -> приложение -> и проверить обновление при перезагрузке.

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

    Как эффективно кэшируется API, Использование Service worker в Angular 5 с использованием Angular CLI

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

Это то, что жизненный цикл сервисного работника предполагает: новый сервисный работник не будет работать, если:

  • Окно или вкладки, контролируемые старшим сервисным работником, закрываются и открываются
  • Параметр «Обновление при перезагрузке» отмечен в Chrome devtools

Вот официальное руководство, которое хорошо объясняет: Жизненный цикл Service Worker

...