Created
August 25, 2022 05:49
-
-
Save MHuiG/a423c0a953ed5645840a651c33dcd60c to your computer and use it in GitHub Desktop.
blog/source/sw.js
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
importScripts('https://cdn.jsdelivr.net/npm/workbox-cdn@5.1.3/workbox/workbox-sw.js'); | |
workbox.setConfig({ | |
modulePathPrefix: 'https://cdn.jsdelivr.net/npm/workbox-cdn@5.1.3/workbox/' | |
}); | |
const { core, precaching, routing, strategies, expiration, cacheableResponse, backgroundSync } = workbox; | |
const { CacheFirst, NetworkFirst, NetworkOnly, StaleWhileRevalidate } = strategies; | |
const { ExpirationPlugin } = expiration; | |
const { CacheableResponsePlugin } = cacheableResponse; | |
const cacheSuffixVersion = '-000010', // 缓存版本号 极端重要,修改静态文件后发布网页一定要修改缓存版本号 | |
maxEntries = 100; | |
self.addEventListener('activate', (event) => { | |
event.waitUntil( | |
caches.keys().then((keys) => { | |
return Promise.all(keys.map((key) => { | |
if (!key.includes(cacheSuffixVersion)) return caches.delete(key); | |
})); | |
}) | |
); | |
}); | |
core.setCacheNameDetails({ | |
prefix: 'volantis', // 极端重要 自己拟定一个名字 | |
suffix: cacheSuffixVersion | |
}); | |
core.skipWaiting(); | |
core.clientsClaim(); | |
precaching.cleanupOutdatedCaches(); | |
/* | |
* Precache | |
* - Static Assets | |
*/ | |
precaching.precacheAndRoute( // 极端重要 定义首次缓存的静态文件 如果开启CDN需要修改为CDN链接 | |
[ | |
{ url: '/css/first.css', revision: null }, | |
{ url: '/css/style.css', revision: null }, | |
{ url: '/js/app.js', revision: null }, | |
], | |
); | |
/* | |
* Cache File From CDN | |
* | |
* Method: CacheFirst | |
* cacheName: static-immutable | |
* cacheTime: 30d | |
*/ | |
// cdn.jsdelivr.net - cors enabled | |
routing.registerRoute( | |
/.*cdn\.jsdelivr\.net/, | |
new CacheFirst({ | |
cacheName: 'static-immutable' + cacheSuffixVersion, | |
fetchOptions: { | |
mode: 'cors', | |
credentials: 'omit' | |
}, | |
plugins: [ | |
new ExpirationPlugin({ | |
maxAgeSeconds: 30 * 24 * 60 * 60, | |
purgeOnQuotaError: true | |
}) | |
] | |
}) | |
); | |
// m7.music.126.net - cors enabled | |
routing.registerRoute( | |
/.*m7\.music\.126\.net/, | |
new CacheFirst({ | |
cacheName: 'static-immutable' + cacheSuffixVersion, | |
fetchOptions: { | |
mode: 'cors', | |
credentials: 'omit' | |
}, | |
plugins: [ | |
new ExpirationPlugin({ | |
maxAgeSeconds: 30 * 24 * 60 * 60, | |
purgeOnQuotaError: true | |
}) | |
] | |
}) | |
); | |
/* | |
* No Cache | |
* | |
* Method: networkOnly | |
*/ | |
routing.registerRoute( | |
/.*baidu\.com.*/, | |
new NetworkOnly() | |
); | |
/* | |
* Others img fonts | |
* Method: staleWhileRevalidate | |
*/ | |
routing.registerRoute( | |
// Cache image fonts files | |
/.*\.(?:png|jpg|jpeg|svg|gif|webp|ico|eot|ttf|woff|woff2|mp3)/, | |
new StaleWhileRevalidate() | |
); | |
/* | |
* Static Assets | |
* Method: staleWhileRevalidate | |
*/ | |
routing.registerRoute( | |
// Cache CSS files | |
/.*\.(css|js)/, | |
// Use cache but update in the background ASAP | |
new StaleWhileRevalidate() | |
); | |
/* | |
* sw.js - Revalidate every time | |
* staleWhileRevalidate | |
*/ | |
routing.registerRoute( | |
'/sw.js', // 本文件名 | |
new StaleWhileRevalidate() | |
); | |
/* | |
* Default - Serve as it is | |
* networkFirst | |
*/ | |
routing.setDefaultHandler( | |
new NetworkFirst({ | |
networkTimeoutSeconds: 3 | |
}) | |
); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment