Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
// Core assets
let coreAssets = [];
// On install, cache core assets
self.addEventListener('install', function (event) {
// Cache core assets
event.waitUntil(caches.open('app').then(function (cache) {
for (let asset of coreAssets) {
cache.add(new Request(asset));
}
return cache;
}));
});
// Listen for request events
self.addEventListener('fetch', function (event) {
// Get the request
let request = event.request;
// Bug fix
// https://stackoverflow.com/a/49719964
if (event.request.cache === 'only-if-cached' && event.request.mode !== 'same-origin') return;
// HTML files
// Network-first
if (request.headers.get('Accept').includes('text/html')) {
event.respondWith(
fetch(request).then(function (response) {
// Create a copy of the response and save it to the cache
let copy = response.clone();
event.waitUntil(caches.open('app').then(function (cache) {
return cache.put(request, copy);
}));
// Return the response
return response;
}).catch(function (error) {
// If there's no item in cache, respond with a fallback
return caches.match(request).then(function (response) {
return response || caches.match('/offline.html');
});
})
);
}
// CSS & JavaScript
// Offline-first
if (request.headers.get('Accept').includes('text/css') || request.headers.get('Accept').includes('text/javascript')) {
event.respondWith(
caches.match(request).then(function (response) {
return response || fetch(request).then(function (response) {
// Return the response
return response;
});
})
);
return;
}
// Images
// Offline-first
if (request.headers.get('Accept').includes('image')) {
event.respondWith(
caches.match(request).then(function (response) {
return response || fetch(request).then(function (response) {
// Save a copy of it in cache
let copy = response.clone();
event.waitUntil(caches.open('app').then(function (cache) {
return cache.put(request, copy);
}));
// Return the response
return response;
});
})
);
}
});
@timeowilliams
Copy link

timeowilliams commented Mar 1, 2022

Thanks for sharing this!

However, I am getting errors in the console that coreID and imgID is not defined:

Screen Shot 2022-02-28 at 7 56 01 PM

@cferdinandi
Copy link
Author

cferdinandi commented Mar 10, 2022

@timeowilliams good catch! Just pushed a fix for a few naming issues that deviated from the article. Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment