After disconnecting from the internet, my service worker is generating the following error:
(unknown) #3016 An unknown error occurred when fetching the script
This is what my service worker code looks like:
var version = 'v1'
this.addEventListener('install', function(event){
event.waitUntil(
caches.open(version).then(cache => {
return cache.addAll([
'https://fonts.googleapis.com/icon?family=Material+Icons',
'https://fonts.googleapis.com/css?family=Open+Sans:400,600,300',
'./index.html'
])
})
)
})
this.addEventListener('fetch', function(event) {
event.respondWith(
caches.match(event.request).then(function(resp) {
// if it's not in the cache, server the regular network request. And save it to the cache
return resp || fetch(event.request).then(function(response) {
return caches.open(version).then(function(cache) {
cache.put(event.request, response.clone())
return response
})
})
})
)
})
The service worker file is located at the root directory, alongside a manifest that is imported in index.html like this:
<link rel="manifest" href="/manifest.json">
I import the service worker in my entry js file. And register it right after.
require('tether-manifest.json')
import serviceWorker from 'sw'
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register(serviceWorker)
.then(() => {
// registration worked
}).catch(error => {
throw new Error(error)
})
}
The registration process goes smoothly, the error only occurs when going offline.
I am using webpack with React, and the following configuration is used to copy my sw.js file to the dist folder:
loaders: [
{ // Service worker
test: /sw\.js$/,
include: config.src,
loader: 'file?name=[name].[ext]'
},
{ // Manifest
test: /manifest\.json$/,
include: config.src,
loader: 'file?name=[name].[ext]'
}
]
The error message does not provide any insight into the cause of the issue.
Does anyone have suggestions on how to resolve this?