Service Worker Cache Busting 与版本参数实践

概述合理的版本参数可避免旧缓存。本文给出 SW 命名与匹配策略。命名与匹配const ASSETS = 'assets-v3';

self.addEventListener('fetch', event => {

const url = new URL(event.request.url);

const v = url.searchParams.get('v');

if (url.pathname.startsWith('/assets/') && v) {

event.respondWith((async () => {

const cache = await caches.open(ASSETS);

const key = new Request(url.origin + url.pathname + '?v=' + v, { headers: event.request.headers });

const cached = await cache.match(key);

if (cached) return cached;

const res = await fetch(event.request);

await cache.put(key, res.clone());

return res;

})());

}

});