Skip to content

Instantly share code, notes, and snippets.



Created Jun 5, 2019
What would you like to do?
self.addEventListener('install', function(event){
return cache.addAll([ // add the links to assests you want to cache
//This is the "Offline page" service worker
// make sure to create a page called offline.html
//Install stage sets up the offline page in the cache and opens a new cache
self.addEventListener('install', function(event) {
var offlinePage = new Request('offline.html');
fetch(offlinePage).then(function(response) {
return'offline-v4').then(function(cache) {
console.log(' Cached offline page during Install'+ response.url);
return cache.put(offlinePage, response);
//If any fetch fails, it will show the offline page.
//Maybe this should be limited to HTML documents?
self.addEventListener('fetch', function(event) {
fetch(event.request).catch(function(error) {
console.error( 'Network request Failed. Serving offline page ' + error );
return'offline-v4').then(function(cache) {
return cache.match('offline.html');
//This is a event that can be fired from your page to tell the SW to update the offline page
self.addEventListener('refreshOffline', function(response) {
return'offline-v4').then(function(cache) {
console.log('Offline page updated from refreshOffline event: '+ response.url);
return cache.put(offlinePage, response);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.