58 lines
1.7 KiB
JavaScript
58 lines
1.7 KiB
JavaScript
const CACHE_NAME = 'gbalance-cache-v1';
|
|
const urlsToCache = [
|
|
'/',
|
|
'/static/manifest.json',
|
|
'/static/icons/icon-192x192.png'
|
|
];
|
|
|
|
self.addEventListener('install', event => {
|
|
event.waitUntil(
|
|
caches.open(CACHE_NAME)
|
|
.then(cache => {
|
|
console.log('Opened cache');
|
|
return cache.addAll(urlsToCache);
|
|
})
|
|
);
|
|
});
|
|
|
|
self.addEventListener('fetch', event => {
|
|
event.respondWith(
|
|
caches.open(CACHE_NAME).then(cache => {
|
|
// 1. 尝试从缓存获取
|
|
return cache.match(event.request).then(responseFromCache => {
|
|
// 2. 同时从网络获取 (后台进行)
|
|
const fetchPromise = fetch(event.request).then(responseFromNetwork => {
|
|
// 3. 网络请求成功，更新缓存
|
|
cache.put(event.request, responseFromNetwork.clone());
|
|
return responseFromNetwork;
|
|
}).catch(err => {
|
|
// 网络请求失败时，可以选择记录错误或不执行任何操作
|
|
console.error('Network fetch failed:', err);
|
|
// 确保即使网络失败，如果缓存存在，我们仍然返回缓存
|
|
// 如果缓存也不存在，则此 Promise 会 reject
|
|
throw err;
|
|
});
|
|
|
|
// 4. 如果缓存存在，立即返回缓存；否则等待网络响应
|
|
// 后台的网络请求仍在进行，用于更新缓存
|
|
return responseFromCache || fetchPromise;
|
|
});
|
|
})
|
|
);
|
|
});
|
|
|
|
self.addEventListener('activate', event => {
|
|
const cacheWhitelist = [CACHE_NAME];
|
|
event.waitUntil(
|
|
caches.keys().then(cacheNames => {
|
|
return Promise.all(
|
|
cacheNames.map(cacheName => {
|
|
if (cacheWhitelist.indexOf(cacheName) === -1) {
|
|
return caches.delete(cacheName);
|
|
}
|
|
})
|
|
);
|
|
})
|
|
);
|
|
});
|