Initial commit

web/static/service-worker.js

@@ -0,0 +1,57 @@
+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);
+          }
+        })
+      );
+    })
+  );
+});