整合指南

André Cipriani Bandarra

注意：注意：較簡單 Trusted Web Activities 的快速入門指南 現已推出。

設定「信任的網路活動」時，不要求開發人員建立 Java 程式碼，但 Android Studio 是 這通常代表交易 不會十分要求關聯語意本指南使用 Android Studio 3.3 版建立。參閱安裝方式說明文件。

建立信任的網路活動專案

使用受信任的網路活動時，專案必須指定 API 16 以上級別。

注意： 本節會引導您在 Android 上設定新專案 如果您已熟悉這項工具，可直接跳到 取得「信任的網路活動資料庫」一節。

開啟 Android Studio，然後按一下「Start a new Android Studio project」。

Android Studio 會提示您選擇活動類型。由於受信任的網路活動會使用 支援資料庫提供的活動，選擇「新增無活動」，然後按一下 按一下「下一步」。

接下來，精靈會提示專案設定。請參考 每個欄位的簡短說明：

• 名稱：應用程式在 Android 啟動器。
• Package Name：裝置上 Android 應用程式的專屬識別碼 Play 商店和 Android 裝置。查看 說明文件 ，進一步瞭解建立套件的相關規定和最佳做法 為 Android 應用程式名稱
• Save location：Android Studio 會在檔案中建立專案的位置 有些人會將 Cloud Storage 視為檔案系統 但實際上不是
• Language：專案無須編寫任何 Java 或 Kotlin 程式碼。 選取 Java 做為預設值。
• 最低 API 級別：支援資料庫至少需要 API 級別 16。 選取上述任何版本的 API 16。

我們不會使用免安裝應用程式，因此請不要勾選剩餘的核取方塊 或 AndroidX 成果，然後按一下「Finish」。

取得值得信賴的網路活動支援資料庫

如要在專案中設定 Trusted Web Activity 程式庫，您必須編輯應用程式 建構檔案在「Project Navigator」中找到「Gradle Scripts」部分。 有兩個名為 build.gradle 的檔案，可能比較有點混淆， 有助於找出正確的名稱

我們要尋找的檔案是旁邊有模組 Module 的 名稱。

Trusted Web Activities 程式庫使用的 Java 8 功能 第一個變更會啟用 Java 8將 compileOptions 區段新增到 「android」部分的底部，如下所示：

android {
        ...
    compileOptions {
       sourceCompatibility JavaVersion.VERSION_1_8
       targetCompatibility JavaVersion.VERSION_1_8
    }
}

下一步會將「信任的網路活動支援資料庫」加入專案。新增 dependencies 區段的依附元件：

dependencies {
    implementation 'com.google.androidbrowserhelper:androidbrowserhelper:2.2.0'
}

Android Studio 會顯示要求再次同步處理專案的提示。 按一下「Sync Now」連結並進行同步處理。

啟動受信任的網路活動

設定 Trusted Web Activity 的方式，是編輯 Android 應用程式資訊清單。

在「Project Navigator」中，展開「app」部分，然後 manifests 並按兩下 AndroidManifest.xml 即可開啟檔案。

由於我們要求 Android Studio 不要在專案中加入任何活動 建立後，資訊清單就會空白，而且僅包含應用程式標記。

在 application 標記中插入 activity 標記，即可新增信任的網路活動：

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    package="com.example.twa.myapplication">

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme"
        tools:ignore="GoogleAppIndexingWarning">
        <activity
            android:name="com.google.androidbrowserhelper.trusted.LauncherActivity">

           <!-- Edit android:value to change the url opened by the Trusted Web Activity -->
           <meta-data
               android:name="android.support.customtabs.trusted.DEFAULT_URL"
               android:value="https://airhorner.com" />

           <!-- This intent-filter adds the Trusted Web Activity to the Android Launcher -->
           <intent-filter>
               <action android:name="android.intent.action.MAIN" />
               <category android:name="android.intent.category.LAUNCHER" />
           </intent-filter>

           <!--
             This intent-filter allows the Trusted Web Activity to handle Intents to open
             airhorner.com.
           -->
           <intent-filter>
               <action android:name="android.intent.action.VIEW"/>
               <category android:name="android.intent.category.DEFAULT" />
               <category android:name="android.intent.category.BROWSABLE"/>

               <!-- Edit android:host to handle links to the target URL-->
               <data
                 android:scheme="https"
                 android:host="airhorner.com"/>
           </intent-filter>
        </activity>
    </application>
</manifest>

新增至 XML 的標記均為標準 Android 應用程式資訊清單。 「受信任的網路」包含兩項相關資訊 活動：

1. meta-data 標記會告訴受信任的網路活動應開啟哪個網址。變更 將 android:value 屬性改為您要開啟的 PWA 網址。於 本例中為 https://airhorner.com
2. 第二個 intent-filter 標記可讓信任的網路活動攔截 Android 開啟 https://airhorner.com 的意圖。android:host 屬性 在 data 標記內，必須指向受信任的網路活動所開啟的網域。

注意： 在這個階段執行專案時，「Custom」分頁的網址列 還是顯示在畫面頂端。這不是錯誤。

下一節將說明設定方式 Digital AssetLinks ，以便驗證網站和應用程式之間的關係，並移除網址列。

移除網址列

「可信任的網路活動」需要 Android 應用程式之間建立關聯 和需要移除網址列的網站

這項關聯是透過以下方式建立： Digital Asset Links 您必須以這兩種方式建立關聯 到網站 和 從網站到應用程式

你可以將應用程式設為網站驗證，並將 Chrome 設為略過 從網站到應用程式驗證 以便偵錯

建立應用程式與網站的關聯

開啟字串資源檔案 app > res > values > strings.xml，然後新增 以下為《Digital AssetLinks》聲明：

<resources>
    <string name="app_name">AirHorner Trusted Web Activity</string>
    <string name="asset_statements">
        [{
            \"relation\": [\"delegate_permission/common.handle_all_urls\"],
            \"target\": {
                \"namespace\": \"web\",
                \"site\": \"https://airhorner.com\"}
        }]
    </string>
</resources>

依據結構定義和網域變更 site 屬性的內容 是由受信任的網路活動所開啟。

返回 Android 應用程式資訊清單檔案 AndroidManifest.xml， 新增 meta-data 標記，但這次成為 application 標記：

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.twa.myapplication">

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">

        <meta-data
            android:name="asset_statements"
            android:resource="@string/asset_statements" />

        <activity>
            ...
        </activity>

    </application>
</manifest>

現在，我們已將 Android 應用程式與 網站。如果不必建立 從網站到應用程式驗證

以下說明如何在開發裝置上測試這項功能：

啟用偵錯模式

1. 在開發裝置上開啟 Chrome、瀏覽至「chrome://flags」，搜尋 名為「在未 Root 權限的裝置上啟用指令列」的項目，然後將其 ，然後重新啟動瀏覽器。
2. 接著，在作業系統的 Terminal 應用程式中，使用 Android Debug Bridge (已安裝 Android Studio)，然後執行下列指令：

adb shell "echo '_ --disable-digital-asset-link-verification-for-url=\"https://airhorner.com\"' > /data/local/tmp/chrome-command-line"

關閉 Chrome，然後透過 Android Studio 重新啟動應用程式。 應用程式現在應以全螢幕顯示。

注意： 您可能需要強制關閉 Chrome，才能以正確的方式重新啟動 Chrome 指令列前往 Android 設定 >應用程式與通知 >Chrome， 並點選「強制停止」。

建立網站與應用程式的關聯

開發人員必須從 來建立關聯：

• 套件名稱：第一個資訊是應用程式的套件名稱。這個 與建立應用程式時產生的套件名稱相同。你也可以搜尋 ，位於模組 build.gradle 中，位於 Gradle 指令碼 >build.gradle (Module: app)，以及 applicationId 屬性。
• SHA-256 指紋：必須登入 Android 應用程式才能 上傳至 Play 商店這個簽章可用來建立 透過 SHA-256 指紋 上傳金鑰

Android 說明文件會詳細說明如何使用 Android Studio 產生金鑰。 請務必記下金鑰存放區的 path、alias 和 passwords，例如 在接下來的步驟中 會用到這個名稱

使用 keytool、 執行下列指令：

keytool -list -v -keystore [path] -alias [alias] -storepass [password] -keypass [password]

SHA-256 指紋的值會顯示在「Certificate」(憑證) 下方 指紋部分以下是輸出範例：

keytool -list -v -keystore ./mykeystore.ks -alias test -storepass password -keypass password

Alias name: key0
Creation date: 28 Jan 2019
Entry type: PrivateKeyEntry
Certificate chain length: 1
Certificate[1]:
Owner: CN=Test Test, OU=Test, O=Test, L=London, ST=London, C=GB
Issuer: CN=Test Test, OU=Test, O=Test, L=London, ST=London, C=GB
Serial number: ea67d3d
Valid from: Mon Jan 28 14:58:00 GMT 2019 until: Fri Jan 22 14:58:00 GMT 2044
Certificate fingerprints:
   SHA1: 38:03:D6:95:91:7C:9C:EE:4A:A0:58:43:A7:43:A5:D2:76:52:EF:9B
   SHA256: F5:08:9F:8A:D4:C8:4A:15:6D:0A:B1:3F:61:96:BE:C7:87:8C:DE:05:59:92:B2:A3:2D:05:05:A5:62:A5:2F:34
Signature algorithm name: SHA256withRSA
Subject Public Key Algorithm: 2048-bit RSA key
Version: 3

備妥上述兩項資訊後，請前往 assetlinks 產生器。 填寫欄位，然後點選「產生陳述式」。複製產生的陳述式 並透過網址 /.well-known/assetlinks.json 從您的網域放送。

注意： AssetLinks 檔案必須位於 /.well-known/assetlinks.json 下方， 因此 Chrome 只會尋找該網域的根層級。

正在建立圖示

Android Studio 建立新專案時會顯示預設圖示。 身為開發人員，您可能會希望建立自己的圖示，藉此凸顯 以及其他 Android 啟動器中的應用程式

Android Studio 包含 Image Asset Studio 提供了建立正確圖示所需的工具 以及建構應用程式需求

在 Android Studio 中前往 File > New > Image Asset，然後選取 Launcher Icons (Adaptative and Legacy)，並按照精靈中的步驟操作。 建立應用程式的自訂圖示。

產生已簽署的 APK

備妥 assetlinks 檔案和 asset_statements 標記 下一步就是產生已簽署的應用程式。 再次提醒，這個程序的執行步驟 已記錄。

您可以使用 ADB，將輸出 APK 安裝至測試裝置：

adb install app-release.apk

如果驗證步驟失敗，您可以檢查是否有錯誤 訊息，以及使用 Android Debug Bridge、作業系統終端機，以及 已連接測試裝置。

adb logcat | grep -e OriginVerifier -e digital_asset_links

上傳 APK 後，您現在可以將應用程式上傳到 Play 商店。

新增啟動畫面

自 Chrome 75 版起，「信任的網路活動」支援啟動畫面。 如要設定啟動畫面，請在 專案。

請務必更新至 Chrome 75 以上版本並使用 「信任的網路活動支援資料庫」。

產生啟動畫面的圖片

Android 裝置可以有不同的螢幕大小 和像素密度。 為確保啟動畫面在所有裝置上都能正常顯示，您需要產生 為每個像素密度產生圖片

螢幕獨立像素 (dp 或 dip) 的完整說明 超出本文範圍，但如要建立圖像 320x320dp，代表在各種密度的裝置螢幕上，大小為 2x2 的正方形 相當於 mdpi 密度的 320x320 像素。

進而推斷其他像素密度所需的大小。下方提供清單 像素密度和基本大小 (320x320dp) 所套用的調節係數， 這樣就會產生像素大小，並放入圖片的 Android Studio 專案。

密度	乘數	大小	專案位置
mdpi (基準)	1.0 倍	320x320 像素	/res/drawable-mdpi/
ldpi	0.75 倍	240x240 像素	/res/drawable-ldpi/
hdpi	1.5 倍	480x480 像素	/res/drawable-hdpi/
xhdpi	2.0 倍	640x640 像素	/res/drawable-xhdpi/
xxhdpi	3.0 倍	960x960 像素	/res/drawable-xxhdpi/
xxxhdpi	4.0 倍	1280x1280 像素	/res/drawable-xxxhdpi/

注意： 如要建立所有圖片大小，您也可以使用單一向量可繪項目。 Vector Asset Studio 為開發人員提供相關工具，協助他們將可擴充向量圖形轉換成 Android 向量可繪項目。

更新應用程式

產生啟動畫面的圖片後，接下來要新增必要的 設定專案

首先，請新增content-provider 加入 Android 資訊清單 (AndroidManifest.xml)。

<application>
    ...
    <provider
        android:name="androidx.core.content.FileProvider"
        android:authorities="com.example.twa.myapplication.fileprovider"
        android:grantUriPermissions="true"
        android:exported="false">
        <meta-data
            android:name="android.support.FILE_PROVIDER_PATHS"
            android:resource="@xml/filepaths" />
    </provider>
</application>

注意： 建立供應器時，請務必變更 android:authorities 屬性。 因為兩個應用程式無法在一個裝置上使用相同的授權。

接著，新增 res/xml/filepaths.xml 資源，並指定 twa 啟動畫面的路徑：

<paths>
    <files-path path="twa_splash/" name="twa_splash" />
</paths>

最後，將 meta-tags 新增至 Android 資訊清單，以自訂 LauncherActivity：

<activity android:name="com.google.androidbrowserhelper.trusted.LauncherActivity">
    ...
    <meta-data android:name="android.support.customtabs.trusted.SPLASH_IMAGE_DRAWABLE"
               android:resource="@drawable/splash"/>
    <meta-data android:name="android.support.customtabs.trusted.SPLASH_SCREEN_BACKGROUND_COLOR"
               android:resource="@color/colorPrimary"/>
    <meta-data android:name="android.support.customtabs.trusted.SPLASH_SCREEN_FADE_OUT_DURATION"
               android:value="300"/>
    <meta-data android:name="android.support.customtabs.trusted.FILE_PROVIDER_AUTHORITY"
               android:value="com.example.twa.myapplication.fileprovider"/>
    ...
</activity>

確認 android.support.customtabs.trusted.FILE_PROVIDER_AUTHORITY 的值 標記與標記中 android:authorities 屬性所定義的值相符 provider 標記。

將 LauncherActivity 設為透明

此外，請確認 LauncherActivity 為透明狀態，以免出現白色畫面 您可以為 LauncherActivity 設定半透明的主題，在啟動前顯示：

<application>
    ...
    <activity android:name="com.google.androidbrowserhelper.trusted.LauncherActivity"
              android:theme="@android:style/Theme.Translucent.NoTitleBar">
    ...
    </activity>
</application>

我們期待看到開發人員運用「可信任網路」打造出什麼成果 活動：如要提供意見，請透過以下電子郵件地址與我們聯絡： @ChromiumDev.