Почему браузер загружает работника сервиса при выходе из сети и вызывает "При извлечении скрипта произошла неизвестная ошибка"?

Question

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

    // If the browser supports serviceWorker, and we haven't registered any - we'll register our: sw.js ..
if ('serviceWorker' in navigator && !navigator.serviceWorker.controller) {
    navigator.serviceWorker.register('/sw.js').then(function(registrationObj) {
        console.log('Registration object: ', registrationObj);
    }).catch(function(error) {
        // serviceWorker registration failed ..
        console.log('Registration failed with ' + error);
    });
} else {
    console.log('Service worker already registered. Skip registration.')
};

Я вижу, что мои активы появляются в кеше приложения. Тогда я иду к Application вкладку в Chrome, выберите Service Workersнажмите offline и обновите страницу. Страница открывается нормально, но я получаю это в консоли браузера:

http://www.screencast.com/t/1uodUTHM5ig

и это в отладчике Service Worker:

http://www.screencast.com/t/zmqHMi9RJ

Answer 1

Возможно, потому что у вас нет сервисного работника в кеше (и вполне естественно, что он не должен быть кэширован в первую очередь.), Поэтому он возвращается к стандартному процессу выборки http и завершается ошибкой, когда приложение находится в автономном режиме.

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

Ваш сценарий сервисного работника, вероятно, имеет такую ​​структуру;

    event.respondWith(
        caches.match(event.request).then(function (response) {
            if (response) {
                return response;
            }
            // request for service worker .js file falls here as it is not in the cache
            // this fails of course since the app is offline
            return fetch(event.request).then(function (response) {
                return response;
            });
        })
    );