From 9d55044d4321233f6ffdbada737bccb5894a0f2a Mon Sep 17 00:00:00 2001 From: Adam Soltys Date: Thu, 11 Apr 2024 13:35:06 -0700 Subject: service worker for pwa --- src/service-worker.js | 83 +++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 83 insertions(+) create mode 100644 src/service-worker.js (limited to 'src/service-worker.js') diff --git a/src/service-worker.js b/src/service-worker.js new file mode 100644 index 00000000..a95ff268 --- /dev/null +++ b/src/service-worker.js @@ -0,0 +1,83 @@ +/// +import { build, files, version } from "$service-worker"; + +// Create a unique cache name for this deployment +const CACHE = `cache-${version}`; + +const ASSETS = [ + ...build, // the app itself + ...files, // everything in `static` +]; + +self.addEventListener("install", (event) => { + console.log("SW installed"); + + // Create a new cache and add all files to it + async function addFilesToCache() { + const cache = await caches.open(CACHE); + await cache.addAll(ASSETS); + } + + event.waitUntil(addFilesToCache()); +}); + +self.addEventListener("activate", (event) => { + // Remove previous cached data from disk + async function deleteOldCaches() { + for (const key of await caches.keys()) { + if (key !== CACHE) await caches.delete(key); + } + } + + event.waitUntil(deleteOldCaches()); +}); + +self.addEventListener("fetch", (event) => { + console.log("FETCH") + // ignore POST requests etc + if (event.request.method !== "GET") return; + + async function respond() { + const url = new URL(event.request.url); + const cache = await caches.open(CACHE); + + // `build`/`files` can always be served from the cache + if (ASSETS.includes(url.pathname)) { + const response = await cache.match(url.pathname); + + if (response) { + return response; + } + } + + // for everything else, try the network first, but + // fall back to the cache if we're offline + try { + const response = await fetch(event.request); + + // if we're offline, fetch can return a value that is not a Response + // instead of throwing - and we can't pass this non-Response to respondWith + if (!(response instanceof Response)) { + throw new Error("invalid response from fetch"); + } + + if (response.status === 200) { + cache.put(event.request, response.clone()); + } + + return response; + } catch (err) { + const response = await cache.match(event.request); + + if (response) { + return response; + } + + // if there's no cache, then just error out + // as there is nothing we can do to respond to this request + throw err; + } + } + + event.respondWith(respond()); +}); -- cgit v1.2.3