Service Worker · Safari · WebKit · Chromium · 遠端 Mac · 2026
2026 年遠端 Mac 前端發布驗收：
Service Worker 更新策略、Safari 快取差異與灰度回滾對照表及三步清單
2026.04.15
前端／發布工程
約 8 分鐘閱讀
適用：PWA／離線殼層或預載上線的前端與發布負責人。僅 Chromium 自測易低估 Safari／WebKit 的更新節奏與快取可見性。下文含可執行決策（skipWaiting／clients.claim、版本與快取前綴）、對照表、三步與灰度回滾。延伸：部署與 Safari 驗證、CSP 驗收、部署前冒煙、Inspector FAQ。
01 差異表
將 SW 生命週期與Cache Storage視為契約；下列矩陣供評審與值班交接，並與 CSP 驗收併勾。
| 主題 | Safari／WebKit | Chromium |
|---|---|---|
| 更新偵測節奏 | 背景凍結會延後 waiting；以重新整理＋時間窗複驗，勿假設部署即全員更新。 |
DevTools「Application」較直觀；仍建議無痕模擬新客戶端。 |
| 快取可見性 | 「儲存空間」與 Inspector 需交叉比對；scope 錯置時常像舊殼層。 | Cache 樹狀成熟；留意第三方 SW與分區儲存。 |
| skipWaiting 體感 | 舊客戶端可能較久；搭配UI 提示或受控重新載入驗收。 | 類似；驗證多分頁是否僅部分進新版本。 |
| clients.claim | 受文件載入影響；真機檢首屏 HTML與殼層 fetch 是否同源、同 scope。 | 訊息較多；Preserve log 觀察導覽邊界 fetch。 |
灰度與回滾對照（摘錄）
| 訊號／情境 | 建議動作（CDN／HTML） | SW／快取層 |
|---|---|---|
| 錯誤率升、僅新殼層 | 關閉灰度標頭或回退上一個靜態目錄。 | 停止呼叫 skipWaiting；保留舊快取前綴供比對。 |
| 離線白屏擴散 | 確認入口 HTML 與 sw.js 仍 200；檢查版本號是否寫死錯誤。 |
暫以 self.registration.unregister() 僅作緊急止血選項並記錄影響面。 |
| 驗證通過、準備全量 | 同步上線新資產與指紋檔名。 | 啟用 skipWaiting 或推送 UI「重新整理以更新」；排程清理過期 caches 名稱。 |
02 發布前驗證
版本號：於 sw.js／建置注入BUILD_ID（如短 SHA），主應用與殼層顯示同字串以利工單截圖。快取前綴建議 myapp-<major>-<buildId>-；破壞性變更時遞增 major以免混桶。
skipWaiting：可接受舊分頁暫留舊版→ install 後延後 skipWaiting，改 UI 觸發。需盡快統一殼層且已測多分頁→ 再呼叫並記錄風險自評（表單、付款等）。
clients.claim：僅在首屏須立刻由新 SW 攔截時啟用；大量 inline 與 SW 並行時請 Safari 真機看競態，必要時延後至 activate 尾端。
三步清單（可勾選）
03 遠端真機驗證流程
於 遠端 Mac同機並跑 Safari／Chromium，工單附截圖、BUILD_ID、儲存空間面板以縮短復現成本。
- ①環境：時區／DNS 與 QA 對齊；關閉會注入額外 SW 的擴充套件。
- ②Safari：清除網站資料後，Inspector 看主控台／網路，並在「儲存空間」對快取前綴。細節見 Inspector FAQ。
- ③Chromium：無痕開同一預發布 URL；Application → Service Workers 檢
waiting與 Skip waiting；HAR／錄影去敏留存。 - ④簽核：兩端
BUILD_ID、是否skipWaiting、首導覽與強制重新整理各一組 Network 摘要。
04 FAQ
部署後馬上全員都是新 SW 嗎？
否。舊分頁可停留舊客戶端；以遙測看殼層版本占比，勿只看 CDN 命中。
為何 Safari 看起來「比較慢更新」？
背景凍結與少重新整理會延後；時間窗複測並 UI 明示更新。
快取前綴改了但舊條目仍在？
常態；activate 內白名單刪除，灰度期勿全清以免離線真空。
CSP 會影響 SW 嗎？
會，特別是 connect-src、worker-src；請與 CSP 驗收文併跑同一組標頭。