設定「Trusted Web Activities」可能有些複雜,尤其是當您只想顯示網站時。本指南將引導您建立使用 Trusted Web Activities 的基本專案,並涵蓋所有相關注意事項。
閱讀完本指南後,您將瞭解:
- 使用 Bubblewrap 建構使用受信任的網路活動且通過驗證的應用程式。
- 瞭解何時會使用簽署金鑰。
- 能夠判斷 Android 應用程式建構時使用的簽章。
- 瞭解如何建立基本的數位資產連結檔案。
如要依循本指南,您必須:
- 開發電腦上已安裝 Node.js 10 以上版本
- 已連線並設定好用於開發的 Android 手機或模擬器 (如果使用實體手機,請啟用 USB 偵錯功能)
- 開發手機上支援受信任的網路活動的瀏覽器
- 您要在受信任網路活動中查看的網站
透過信任的網頁活動,Android 應用程式就能在沒有任何瀏覽器 UI 的情況下,啟動全螢幕瀏覽器分頁。這項功能僅限於你擁有的網站,你必須設定 Digital Asset Links 才能證明這一點。我們稍後會詳細說明。
啟動可信任的網頁活動時,瀏覽器會檢查 Digital Asset Links 的檢查作業,這稱為驗證。如果驗證失敗,瀏覽器就會改為以自訂分頁顯示網站。
安裝及設定 Bubblewrap
Bubblewrap 是一組 Node.js 程式庫和指令列工具 (CLI),可協助開發人員使用信任的網路活動,在 Android 應用程式中產生、建構及執行漸進式網頁應用程式。
您可以使用下列指令安裝 CLI:
設定環境
初次執行 Bubblewrap 時,系統會自動下載並安裝必要的外部依附元件。建議您讓這項工具執行此操作,確保依附元件設定正確無誤。請參閱 Bubblewrap 說明文件,瞭解如何使用現有的 Java Development Kit (JDK) 或安裝的 Android 指令列工具。
初始化並建構專案
如要初始化包裝 PWA 的 Android 專案,請執行 init 指令:
Bubblewrap 會讀取 Web Manifest,要求開發人員確認要在 Android 專案中使用的值,然後使用這些值產生專案。專案產生完成後,請執行以下命令產生 APK:
執行
建構步驟會輸出名為 app-release-signed.apk
的檔案。您可以將這個檔案安裝在開發裝置上進行測試,也可以上傳至 Play 商店發布。
Bubblewrap 提供指令,可在本機裝置上安裝及測試應用程式。將開發裝置連接至電腦後,執行以下操作:
或者,您也可以使用 adb 工具。
注意:**adb**
指令列工具位於 **android_sdk/platform-tools/**
的 Android 指令列工具中。
應用程式現已可用於裝置啟動器。開啟應用程式時,您會看到網站是以「自訂分頁」的形式啟動,而非「受信任的網路活動」,這是因為我們尚未設定 Digital Asset Links 驗證程序,但首先要...
Bubblewrap 的圖形使用者介面 (GUI) 替代方案
PWA Builder 提供圖形使用者介面,可使用 Bubblewrap 程式庫產生信任的網路活動專案。如要進一步瞭解如何使用 PWA Builder 建立可開啟 PWA 的 Android 應用程式,請參閱這篇文章。
簽署金鑰注意事項
Digital Asset Links 會考量 APK 所使用的簽署金鑰,而驗證失敗的常見原因是使用錯誤的簽名。(請注意,驗證失敗代表網站會以自訂分頁的形式啟動,並在網頁頂端顯示瀏覽器 UI)。Bubblewrap 建構應用程式時,系統會在 init
步驟中建立 APK,並在其中設定金鑰。不過,當您在 Google Play 發布應用程式時,系統可能會為您建立另一個金鑰,具體取決於您選擇如何處理簽署金鑰。進一步瞭解簽署金鑰,以及與 Bubblewrap 和 Google Play 的關聯性。
設定素材資源連結檔案
Digital Asset Links 主要包含指向您應用程式的檔案,以及應用程式中指向您網站的中繼資料。
建立 assetlinks.json
檔案後,請上傳至網站。well-known/assetlinks.json
相對於根目錄),以便瀏覽器能正確驗證您的應用程式。請參閱數位資產連結深入解析,進一步瞭解數位資產連結與簽署金鑰的關係。
檢查瀏覽器
受信任的網路活動會嘗試採用使用者預設的瀏覽器。如果使用者的預設瀏覽器支援「Trusted Web Activities」,系統就會啟動該瀏覽器。如果沒有,系統會選擇任何已安裝的瀏覽器,只要該瀏覽器支援 Trusted Web Activities 即可。最後,預設行為會改為使用自訂分頁模式。
也就是說,如果您要對信任的網路活動進行偵錯,請務必使用您認為的瀏覽器。您可以使用下列指令查看目前使用的瀏覽器:
後續步驟
希望您在按照本指南操作後,已成功啟用可靠的網路活動,並具備足夠的知識,能夠在驗證失敗時進行偵錯。如果沒有,請參閱更多 網頁開發人員適用的 Android 概念,或針對這些文件在 GitHub 回報問題。
接下來,建議您先為應用程式建立圖示。完成以上步驟後,您就可以考慮將應用程式部署至 Play 商店。