Last active
March 14, 2017 20:41
-
-
Save AvraamMavridis/8452c4379e12ca1ed5c7594dfbe74349 to your computer and use it in GitHub Desktop.
sw.js
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
importScripts('./cachepolyfill.js'); | |
var CACHE_VERSION = 1; | |
var CACHE = `cache-v${ CACHE_VERSION }`; | |
const assetsToCache = [ | |
// CDNs AND 3rd parties | |
'//cdnjs.cloudflare.com/ajax/libs/socket.io/1.7.2/socket.io.min.js', | |
'//cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js', | |
'//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/css/bootstrap.min.css', | |
// FONTS | |
'/fonts/proximanova-regular-webfont.woff', | |
'/fonts/ProximaNova-Bold.otf', | |
'/fonts/proximanova-semibold-webfont.woff', | |
// LOCAL FILES | |
'/js/ie-unsupported-ver.js', | |
]; | |
// On install, cache some resources. | |
self.addEventListener('install', function(evt) { | |
console.info('SW: The service worker is being installed. Version:', CACHE_VERSION); | |
// Ask the service worker to keep installing until the returning promise | |
// resolves. | |
evt.waitUntil(precache()); | |
}); | |
// On fetch, use cache but update the entry with the latest contents | |
// from the server. | |
self.addEventListener('fetch', function(evt) { | |
// Try cache, if the resource is not there check network | |
evt.respondWith(fromCache(evt.request) | |
.catch(function () { | |
return fromNetwork(evt.request); | |
}) | |
); | |
}); | |
// Open a cache and use `addAll()` with an array of assets to add all of them | |
// to the cache. Return a promise resolving when all the assets are added. | |
function precache() { | |
return caches.open(CACHE).then(function (cache) { | |
return cache.addAll(assetsToCache) | |
.then(function(){ | |
console.info('SW: Assets cached') | |
}) | |
.catch(function(){ | |
console.info('SW: Error on caching assets.') | |
}); | |
}); | |
} | |
// Update consists in opening the cache, performing a network request and | |
// storing the new response data. | |
function update(request) { | |
return caches.open(CACHE).then(function (cache) { | |
return fetch(request).then(function (response) { | |
cache.put(request, response.clone()) | |
.catch(function(){ | |
console.info('SW: Error in putting something on the cache'); | |
}) | |
return response; | |
}); | |
}); | |
} | |
// Time limited network request. If the network fails or the response is not | |
// served before timeout, the promise is rejected. | |
function fromNetwork(request) { | |
return new Promise(function (fulfill, reject) { | |
// Fulfill in case of success. | |
fetch(request).then(function (response) { | |
// Cache images | |
if(request.url.indexOf('/img/') > -1 || request.url.indexOf('cloudfront') > -1 | |
|| request.url.indexOf('hires') > -1){ | |
update(request) | |
.then(fulfill) | |
} | |
else { | |
fulfill(response); | |
} | |
// Reject also if network fetch rejects. | |
}, reject); | |
}); | |
} | |
// Open the cache where the assets were stored and search for the requested | |
// resource. Notice that in case of no matching, the promise still resolves | |
// but it does with `undefined` as value. | |
function fromCache(request) { | |
return caches.open(CACHE).then(function (cache) { | |
return cache.match(request).then(function (matching) { | |
return matching || Promise.reject('no-match'); | |
}); | |
}); | |
} | |
self.addEventListener('activate', function(event){ | |
// Delete previous caches | |
event.waitUntil( | |
self.clients.claim() | |
.then(function() { | |
caches.keys().then(function(cacheNames){ | |
return Promise.all( | |
cacheNames.map(function(cacheName){ | |
if (CACHE.indexOf(cacheName) === -1) { | |
// Delete it | |
return caches.delete(cacheName); | |
} | |
return cacheName; | |
}) | |
); | |
}); | |
}) | |
); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment