app/static/service-worker.js

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);
          }
        })
      );
    })
  );
});