Chrome 如何處理網頁應用程式資訊清單的更新

如何變更 PWA 的圖示、捷徑、顏色和其他中繼資料

Adriana Jara
François Beaufort
François Beaufort
GitHub
Pete LePage

安裝 PWA 後，瀏覽器會使用網頁應用程式資訊清單中的資訊做為應用程式名稱、應用程式應使用的圖示，以及啟動應用程式時應開啟的網址。但是，如果需要更新應用程式捷徑或嘗試新的主題顏色，該怎麼辦？這些變更反映在瀏覽器的時機與方式為何？

在大多數情況下，變更應會在資訊清單更新後，在 PWA 啟動後的一或兩天內反映。

Chrome 電腦版更新

當 PWA 在瀏覽器分頁中啟動或開啟時，Chrome 會判斷上次檢查本機資訊清單是否有變更。如果資訊清單自瀏覽器上次啟動後尚未經過檢查，或是在過去 24 小時內未進行檢查，Chrome 就會對資訊清單發出網路要求，然後與本機副本進行比對。

如果在資訊清單中選取屬性已變更 (請參閱下方清單)，Chrome 會將新的資訊清單排入佇列，並在所有視窗關閉後安裝新資訊清單。安裝完成後，新資訊清單的所有欄位 (name、short_name 和 icons 除外) 都會更新。

哪些屬性會觸發更新？

  • display (詳情請見下方)
  • scope
  • shortcuts
  • start_url
  • theme_color
  • file_handlers

更新「display」欄位後會有什麼影響？

如果您將應用程式的顯示模式從 browser 更新為 standalone，現有使用者更新後，應用程式並不會在視窗中開啟。網頁應用程式有兩個顯示設定，分別來自資訊清單 (由您控制)，以及由使用者控管的視窗/瀏覽器分頁設定。系統一律會尊重使用者的偏好設定。

測試資訊清單更新

chrome://web-app-internals 頁面 (適用於 Chrome 85 以上版本) 包含裝置已安裝所有 PWA 的相關詳細資訊，有助您瞭解資訊清單的上次更新時間、更新頻率等等。

如要手動強制 Chrome 檢查更新的資訊清單，可以使用指令列標記 --disable-manifest-update-throttle 啟動 Chrome，或重新啟動 Chrome (使用 about://restart)，這會重設計時器，讓 Chrome 在下次啟動 PWA 時檢查更新的資訊清單。接著啟動 PWA。關閉 PWA 後，應使用新的資訊清單屬性進行更新。

參考資料

Google Chrome Android 版更新

PWA 啟動時，Chrome 會判斷上次檢查本機資訊清單是否有變更。如果資訊清單在過去 24 小時內未經過檢查，Chrome 就會為資訊清單排程網路要求，然後將要求與本機副本進行比對。

如果資訊清單中選取的屬性已變更 (請見下方清單)，Chrome 會將新的資訊清單加入佇列，而 PWA 的所有視窗都關閉後，裝置就會接上電源並連上 Wi-Fi，Chrome 就會向伺服器要求更新的 WebAPK。更新完成後，系統會使用新資訊清單的所有欄位。

哪些屬性會觸發更新？

  • background_color
  • display
  • orientation
  • scope
  • shortcuts
  • start_url
  • theme_color
  • web_share_target

如果 Chrome 無法從伺服器取得更新後的資訊清單，每次檢查之間的間隔時間可能會增加至 30 天。

測試資訊清單更新

about://webapks 頁面內含裝置上安裝的所有 PWA 詳細資訊，另外還會說明資訊清單的上次更新時間、更新頻率等等。

如要手動排定更新資訊清單的時程，覆寫計時器和本機資訊清單的步驟如下：

  1. 將裝置接上電源，並確認裝置已連上 Wi-Fi。
  2. 請使用 Android 工作管理員關閉 PWA，然後使用 Android 設定中的「應用程式」面板強制停止 PWA。
  3. 在 Chrome 中開啟 about://webapks，然後按一下 PWA 的「更新」按鈕。「更新狀態」會變更為「待處理」。
  4. 啟動 PWA，並確認 PWA 已正確載入。
  5. 請使用 Android 工作管理員關閉 PWA，然後使用 Android 設定中的「應用程式」面板強制停止 PWA。

PWA 通常會在幾分鐘內更新，更新完成後，「更新狀態」應會變更為「成功」

參考資料