PWA - проблема с загрузкой кэша для сайта Prestashop

Question

(извините за мой плохой английский)

Я настоящий новичок в PWA, и я должен заставить работника службы кэшировать все элементы веб-страниц (изображения, CSS, JS и т. Д.). Не могу кешировать в статике, потому что там тысячи картинок, сайт динамический.

Дополнительная информация, сайт Prestashop.

В настоящее время у меня есть это в моем HTML:

<script>
    // This is the "Offline copy of pages" service worker

    // Add this below content to your HTML page, or add the js file to your page at the very top to register service worker

    // Check compatibility for the browser we're running this in
    if ("serviceWorker" in navigator) {
        if (navigator.serviceWorker.controller) {
            console.log("[PWA Builder] active service worker found, no need to register");
        } else {
            // Register the service worker
            navigator.serviceWorker
                    .register("sw.js", {
                        scope: "./"
                    })
                    .then(function (reg) {
                        console.log("[PWA Builder] Service worker has been registered for scope: " + reg.scope);
                    });
        }
    }
</script>

А у меня в сервисе (sw.js):

var CACHE = 'network-or-cache';


self.addEventListener('install', function(evt) {
    console.log('The service worker is being installed.');


    evt.waitUntil(precache());
});


self.addEventListener('fetch', function(evt) {
    console.log('The service worker is serving the asset.');


    evt.respondWith(fromNetwork(evt.request, 400).catch(function () {
        return fromCache(evt.request);
    }));
});


function precache() {
    return caches.open(CACHE).then(function (cache) {
        return cache.addAll([
            '/themes/caverne_rocket/assets/css/theme.css',
            '/themes/core.js',
            '/themes/caverne_rocket/assets/js/theme.js',
            '/',
            '/themes',
            '/img'
        ]);
    });
}


function fromNetwork(request, timeout) {
    return new Promise(function (fulfill, reject) {


        var timeoutId = setTimeout(reject, timeout);


        fetch(request).then(function (response) {
            clearTimeout(timeoutId);
            fulfill(response);


        }, reject);
    });
}


function fromCache(request) {
    return caches.open(CACHE).then(function (cache) {
        return cache.match(request).then(function (matching) {
            return matching || Promise.reject('no-match');
        });
    });
}

Я просмотрел несколько уроков, протестировал несколько кодов, и это лучшее, что у меня есть на данный момент.

Однако у меня проблема:

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

Как будто сайт пытается загрузить кеш, которого у него нет, или что-то в этом роде. У кого-нибудь есть идея? (или просто улучшить мой работник службы).

Спасибо!