Last active
November 20, 2021 13:12
-
-
Save huysentruitw/24b23ec49ebd38c9ff891ffb83f06088 to your computer and use it in GitHub Desktop.
service-worker.js for medium article about Blazor WASM PWA
This file contains 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
// Caution! Be sure you understand the caveats before publishing an application with | |
// offline support. See https://aka.ms/blazor-offline-considerations | |
self.importScripts('./service-worker-assets.js'); | |
self.addEventListener('install', event => event.waitUntil(onInstall(event))); | |
self.addEventListener('activate', event => event.waitUntil(onActivate(event))); | |
self.addEventListener('fetch', event => event.respondWith(onFetch(event))); | |
const cacheNamePrefix = 'offline-cache-'; | |
const cacheName = `${cacheNamePrefix}${self.assetsManifest.version}`; | |
const offlineAssetsInclude = [ /\.dll$/, /\.pdb$/, /\.wasm/, /\.html/, /\.js$/, /\.json$/, /\.css$/, /\.woff$/, /\.png$/, /\.jpe?g$/, /\.gif$/, /\.ico$/, /\.blat$/, /\.dat$/ ]; | |
const offlineAssetsExclude = [ /^service-worker\.js$/ ]; | |
async function onInstall(event) { | |
console.info('Service worker: Install'); | |
// Activate the new service worker as soon as the old one is retired. | |
self.skipWaiting(); | |
// Fetch and cache all matching items from the assets manifest | |
const assetsRequests = self.assetsManifest.assets | |
.filter(asset => offlineAssetsInclude.some(pattern => pattern.test(asset.url))) | |
.filter(asset => !offlineAssetsExclude.some(pattern => pattern.test(asset.url))) | |
.map(asset => new Request(asset.url, { integrity: asset.hash })); | |
await caches.open(cacheName).then(cache => cache.addAll(assetsRequests)); | |
} | |
async function onActivate(event) { | |
console.info('Service worker: Activate'); | |
// Delete unused caches | |
const cacheKeys = await caches.keys(); | |
await Promise.all(cacheKeys | |
.filter(key => key.startsWith(cacheNamePrefix) && key !== cacheName) | |
.map(key => caches.delete(key))); | |
} | |
async function onFetch(event) { | |
let cachedResponse = null; | |
if (event.request.method === 'GET') { | |
// For all navigation requests, try to serve index.html from cache | |
// If you need some URLs to be server-rendered, edit the following check to exclude those URLs | |
const shouldServeIndexHtml = event.request.mode === 'navigate'; | |
const request = shouldServeIndexHtml ? 'index.html' : event.request; | |
const cache = await caches.open(cacheName); | |
cachedResponse = await cache.match(request); | |
} | |
return cachedResponse || fetch(event.request); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment