const CACHE_NAME = 'Spothole'; const CACHE_URLS = [ 'index.html', './', 'apidocs', 'apidocs/openapi.yml', 'about', 'css/style.css', 'js/code.js', 'img/logo.png', 'img/favicon.ico', 'img/icon-32.png', 'img/icon-192.png', 'img/icon-512.png', 'fa/css/fontawesome.min.css', 'fa/css/solid.min.css', 'fa/webfonts/fa-solid-900.ttf', 'fa/webfonts/fa-solid-900.woff2' ]; self.addEventListener('fetch', (event) => { // Is this an asset we can cache? const url = new URL(event.request.url); const isCacheableRequest = CACHE_URLS.includes(url.pathname); if (isCacheableRequest) { // Open the cache event.respondWith(caches.open(CACHE_NAME).then((cache) => { // Go to the network first, cacheing the response return fetch(event.request.url).then((fetchedResponse) => { cache.put(event.request, fetchedResponse.clone()); return fetchedResponse; }).catch(() => { // If the network is unavailable, get from cache. return cache.match(event.request.url); }); })); } else { // Not a cacheable request, must be a call to the API, so no cache involved just go to the network } });