Update sw.js

sw.js

@@ -9,7 +9,7 @@ let cachedFiles = [
 
 // install: 必要ファイルをプリキャッシュ
 self.addEventListener('install', (event) => {
-  self.skipWaiting();
+  self.skipWaiting(); // 新しいSWを即アクティベート
   event.waitUntil(
     caches.open(CACHE_NAME).then(async cache => {
       console.log('キャッシュを追加中:', cachedFiles);
@@ -22,7 +22,7 @@ self.addEventListener('install', (event) => {
   );
 });
 
-// activate: 古いキャッシュを削除
+// activate: 古いキャッシュを削除 & clients.claim()で即制御
 self.addEventListener('activate', (event) => {
   event.waitUntil(
     caches.keys().then(keys => Promise.all(
@@ -35,25 +35,22 @@ self.addEventListener('activate', (event) => {
   );
 });
 
-// fetch: HTML は network-first、それ以外は cache-first（メディアはキャッシュ優先）
+// fetch: HTMLはnetwork-first、それ以外はcache-first
 self.addEventListener('fetch', (event) => {
   const req = event.request;
   const accept = req.headers.get('accept') || '';
 
-  // ナビゲーション/HTML リクエストは network-first
+  // HTMLナビゲーションは network-first
   if (accept.includes('text/html')) {
     event.respondWith(
       (async () => {
         try {
           const networkResponse = await fetch(req);
-          // 成功したらキャッシュを更新して返す（オプション）
           const copy = networkResponse.clone();
           const cache = await caches.open(CACHE_NAME);
-          // キャッシュのキーは pathname/query をそのまま使うと安全です
-          await cache.put(req, copy).catch(()=>{/* ignore */});
+          await cache.put(req, copy).catch(() => { /* ignore */ });
           return networkResponse;
         } catch (err) {
-          // ネットワーク失敗時はキャッシュを返す。なければ /index.html をフォールバック
           const cacheResp = await caches.match(req);
           return cacheResp || caches.match('/index.html');
         }
@@ -62,24 +59,21 @@ self.addEventListener('fetch', (event) => {
     return;
   }
 
-  // それ以外（メディアや静的ファイル）は cache-first
+  // その他（メディア・静的ファイル）はcache-first
   event.respondWith(
     caches.match(req).then(async cacheResp => {
       if (cacheResp) return cacheResp;
       try {
         const networkResp = await fetch(req);
-        // 必要なら動的にキャッシュする（例えば静的アセットのみ）
-        // 以下はメディアを動的にキャッシュしない例（容量対策）
         return networkResp;
       } catch (err) {
-        // オフラインでキャッシュも無い場合は失敗レスポンスを返す
         return new Response('Network error and no cache', { status: 504 });
       }
     })
   );
 });
 
-// message: 動的にキャッシュリストを入れ替える（必要に応じて）
+// message: 動的にキャッシュリストを入れ替える
 self.addEventListener('message', (event) => {
   if (event.data?.type === 'CACHE_FILES') {
     const files = event.data.files || [];
@@ -110,4 +104,9 @@ self.addEventListener('message', (event) => {
       })()
     );
   }
+
+  // SKIP_WAITINGメッセージで即反映
+  if (event.data?.type === 'SKIP_WAITING') {
+    self.skipWaiting();
+  }
 });