Почему сервисный работник не кэширует файл js - PullRequest
0 голосов
/ 28 мая 2019

SW кэширует файл изображения, но не JS (размер 0 байт)


    /*serviceWorker*/
    if ('serviceWorker' in navigator) {
        navigator.serviceWorker
            .register('service-worker.js', { scope: '/' })
            .then(function(registration) {
                console.log("Service Worker Registered");
            })
            .catch(function(err) {
                console.log("Service Worker Failed to Register", err);
            })

    };

    const CACHE = 'cache-only-v1';
    const timeout = 400;

    self.addEventListener('install', (event) => {
        event.waitUntil(
        caches.open(CACHE).then((cache) => {
            return cache.addAll([
                '/sys/Raycaster/3d.js',
                '/sys/js/popmotion.global.min.js',
                '/sys/js/anime.min.js',
                'sys/b/bgFeedback.jpg',
                '/sys/b/ic.svg',
                '/sys/b/ani/img_ani_1.webp',
                '/sys/b/ani/img_ani_2.webp',
                '/sys/b/ani/img_ani_3.webp',
                '/sys/printProd/p.webp',
                '/sys/printProd/p2.webp',
                '/sys/printProd/p3.webp',
                '/sys/printProd/p4.webp',
                '/sys/printProd/p5.webp',
                '/sys/printProd/p6.webp',
                '/sys/printProd/p7.webp',
                '/sys/printProd/p8.webp',
                '/sys/printProd/p9.webp',
                '/sys/printProd/p10.webp',
                '/sys/printProd/p11.webp',
                '/sys/printProd/p12.webp',
                '/sys/sliderInSlider/01_el.webp',
                '/sys/sliderInSlider/02_dv.webp',
                '/sys/sliderInSlider/05_snth.webp',
                '/sys/sliderInSlider/06_ton.webp',
                '/sys/sliderInSlider/07_pty.webp',
                '/sys/sliderInSlider/08_lyu.webp',
                '/sys/sliderInSlider/09_kar.webp'
                ]);
            })
        );
    });

Изображение здесь: https://f.usemind.org/img/2019-05-28_143451.jpg

1 Ответ

0 голосов
/ 28 мая 2019

Информация, отображаемая в Chrome DevTools, основана на Response Headers и иногда не отражает реальность. Ваши js-файлы кэшируются, но в нем нет Content-Lenght в Headers.

для проверки вы можете сделать:

caches.open(CACHES)
.then( cache => cache.match('/sys/js/popmotion.global.min.js'))
.then( res =>res.text())
.then( js => console.log(js))

Этот код проверит ваши кэши на наличие popmotion.global.min.js и отобразит его содержимое.

...