如何變更 PWA 的圖示、捷徑、顏色和其他中繼資料
安裝 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 詳細資訊,另外還會說明資訊清單的上次更新時間、更新頻率等等。
如要手動排定更新資訊清單的時程,覆寫計時器和本機資訊清單的步驟如下:
- 將裝置接上電源,並確認裝置已連上 Wi-Fi。
- 請使用 Android 工作管理員關閉 PWA,然後使用 Android 設定中的「應用程式」面板強制停止 PWA。
- 在 Chrome 中開啟
about://webapks
,然後按一下 PWA 的「更新」按鈕。「更新狀態」會變更為「待處理」。 - 啟動 PWA,並確認 PWA 已正確載入。
- 請使用 Android 工作管理員關閉 PWA,然後使用 Android 設定中的「應用程式」面板強制停止 PWA。
PWA 通常會在幾分鐘內更新,更新完成後,「更新狀態」應會變更為「成功」
參考資料
- Android 版 Chrome 的
UpdateReason
列舉