このページは Cloud Translation API によって翻訳されました。

統合ガイド

André Cipriani Bandarra

信頼できるウェブアクティビティを設定する際、デベロッパーは Android Studio は必要ありません。このガイドは Android Studio 3.3 を使用して作成されました。インストール方法に関するドキュメントをご覧ください。

Trusted Web Activity プロジェクトを作成する

信頼できるウェブアクティビティを使用する場合、プロジェクトは API 16 以降をターゲットにする必要があります。

Android Studio を開き、[Start a new Android Studio project] をクリックします。

Android Studio で、アクティビティタイプの選択を求められます。Trusted Web Activity ではサポートライブラリから提供されたアクティビティの場合は、[Add No Activity] を選択して [次へ] をタップします。

次のステップでは、ウィザードでプロジェクトの構成を求められます。こちらが各フィールドの簡単な説明:

Name: ネットワークでアプリケーションに使用する名前 Android ランチャー。
パッケージ名: Google Play Console で Android アプリの Google Play ストアと Android デバイス。詳細については、ドキュメントパッケージを作成するための要件とベストプラクティスの詳細 Android アプリの名前。
[Save location]: Android Studio がプロジェクトを作成するファイル内の場所。ありません
Language: プロジェクトで Java や Kotlin コードを記述する必要はありません。デフォルトとして [Java] を選択します。
最小 API レベル: サポートライブラリには API レベル 16 以上が必要です。上記のいずれかのバージョンの API 16 を選択します。

Instant Apps は使用しないため、残りのチェックボックスはオフのままにします [Finish] をクリックします。

Trusted Web Activity サポートライブラリを入手する

プロジェクトに信頼できるウェブアクティビティライブラリを設定するには、アプリケーションを編集する必要があります。ビルドファイルを使用します。[Project Navigator] の [Gradle Scripts] セクションを確認します。 build.gradle という 2 つのファイルがあります。わかりにくいかもしれませんが、括弧内の説明は、正しい説明を特定するのに役立ちます。

ここで探しているファイルは、「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 を起動する

Trusted Web Activity を設定するには、 Android アプリマニフェスト:

[Project Navigator] で、[app] セクションを開き、[ manifest を開き、AndroidManifest.xml をダブルクリックしてファイルを開きます。

Android Studio では、変更のたびにプロジェクトにアクティビティを追加しないよう作成された場合、マニフェストは空で、アプリケーションタグのみが含まれます。

activity タグを application タグに挿入して、信頼できるウェブアクティビティを追加します。

<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 アプリマニフェスト: 信頼できるウェブのコンテキストに関連する情報は 2 つあります。アクティビティ:

meta-data タグは、信頼できるウェブアクティビティで開く URL を指示します。乗り換え android:value 属性には、開く PWA の URL を指定します。インこの例では https://airhorner.com です。
2 番目の intent-filter タグでは、信頼できるウェブアクティビティが Android をインターセプトできます。 https://airhorner.com を開くインテント。android:host 属性 data タグ内では、信頼できるウェブアクティビティによって開かれるドメインを指している必要があります。

で確認できます。

次のセクションでは、Google Chat でデジタルアセットリンクウェブサイトとアプリの関係性を確認し、URL バーを削除してください。

URL バーを削除する

信頼できるウェブアクティビティを使用するには、Android アプリと設定して URL バーを削除するウェブサイトです

この関連付けは次を使用して作成されます: デジタルアセットのリンク関連付けは両方の方法で確立する必要がありアプリからウェブサイトおよびウェブサイトからアプリへ。

ウェブサイトの検証を行うようアプリを設定し、Chrome でスキップするように設定できるウェブサイト間の検証（デバッグを目的としています）。

アプリからウェブサイトへの関連付けを確立する

文字列リソースファイル app > res > values > strings.xml を開き、以下のデジタルアセットリンクに関する文言:

<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 アプリから確認できます何も作成せずに関係のこの部分をデバッグすると、ウェブサイト間の検証です

開発用デバイスでテストする方法は次のとおりです。

デバッグモードを有効にする

開発用デバイスで Chrome を開き、chrome://flags に移動して検索「root 権限のないデバイスでコマンドラインを有効にする」という項目を探し、設定を変更します。 [有効] を選択してからブラウザを再起動します。
次に、ご使用のオペレーティングシステムのターミナルアプリケーションで、 Android Debug Bridge インストールし、次のコマンドを実行します。

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

Chrome を閉じて、Android Studio からアプリを再起動します。「全画面表示されるはずです。

ウェブサイトからアプリへの関連付けを確立する

デベロッパーはアプリを使用して関連付けを作成します。

パッケージ名: 最初の情報は、アプリのパッケージ名です。このは、アプリの作成時に生成されたパッケージ名と同じものです。また、 モジュール build.gradle 内の Gradle スクリプト >build.gradle (Module: app) であり、 applicationId 属性。
SHA-256 指紋認証: Android アプリに署名するには、アップロードします。同じ署名がアプリケーションの Google の SHA-256 フィンガープリントにより、ウェブサイトとアプリ間の指定します。

Android のドキュメントでは、Android Studio を使用して鍵を生成する方法が詳しく説明されています。キーストアのパス、エイリアス、パスワードをメモしておきます。次のステップで必要になります。

次を使用して SHA-256 フィンガープリントを抽出します。 keytool 各コマンドを使用します。

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

[SHA-256 フィンガープリント] の値は [証明書] に表示されます。ご覧ください。出力例を次に示します。

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

両方の情報を確認できたら、アセットリンク生成ツールにアクセスします。各フィールドに入力し、[Generate Statement] をクリックします。生成されたステートメントをコピーしますそして、ドメインの URL /.well-known/assetlinks.json から提供します。

アイコンを作成する

Android Studio で新しいプロジェクトが作成されると、デフォルトのアイコンが表示されます。デベロッパーは独自のアイコンを作成して、 Android ランチャーで他のアプリからアプリを作成できます。

Android Studio には、Image Asset Studio が含まれています。あらゆる場面で適切なアイコンを作成するのに必要なツールをアプリケーションのニーズを形成できます。

Android Studio で File > New > Image Asset に移動し、 Launcher Icons (Adaptative and Legacy)] をクリックし、ウィザードの手順に沿って操作してください。アプリケーションのカスタムアイコンを作成します。

署名付き APK を生成する

ドメインに assetlinks ファイルを配置し、asset_statements タグを設定する次は、署名付きアプリを生成します。このステップもドキュメントをご覧ください。

出力 APK は、adb を使用してテストデバイスにインストールできます。

adb install app-release.apk

検証ステップが失敗した場合は、エラーをチェックできる Android Debug Bridge を使用して、OS のターミナルやテストデバイスに接続しました。

adb logcat | grep -e OriginVerifier -e digital_asset_links

生成されたアップロード APK で、アプリを Google Play ストアにアップロードすることができます。

スプラッシュ画面の追加

Chrome 75 以降、信頼できるウェブアクティビティでスプラッシュ画面がサポートされます。スプラッシュ画面を設定するには、いくつかの新しい画像ファイルと設定をできます。

必ず Chrome 75 以降にアップデートし、 Trusted Web Activity Support Library の最新バージョン。

スプラッシュ画面の画像の生成

Android デバイスの画面サイズはさまざまです。ピクセル密度。スプラッシュ画面がすべてのデバイスで適切に表示されるようにするには、各ピクセル密度の画像。

ディスプレイ非依存ピクセル（dp または dip）の説明ここでは説明しませんが、例として、イメージを作成し、 320x320 dp（任意の密度のデバイス画面で 2x2 インチの正方形を表す）これは mdpi 密度で 320x320 ピクセルに相当します。

そこから、他のピクセル密度に必要なサイズを導き出すことができます。以下はリストですピクセル密度、ベースサイズ（320 x 320 dp）に適用される乗数、サイズ（ピクセル単位）と、 Android Studio プロジェクト。

密度	調整因子	サイズ	プロジェクトの場所
mdpi（ベースライン）	1.0 倍速	320 x 320 ピクセル	/res/drawable-mdpi/
ldpi	0.75 倍速	240 x 240 ピクセル	/res/drawable-ldpi/
hdpi	1.5 倍	480 x 480 ピクセル	/res/drawable-hdpi/
xhdpi	2.0 倍	640 x 640 ピクセル	/res/drawable-xhdpi/
xxhdpi	3.0 倍	960x960 ピクセル	/res/drawable-xxhdpi/
xxxhdpi	4.0 倍	1,280 x 1,280 ピクセル	/res/drawable-xxxhdpi/

アプリケーションを更新する

スプラッシュ画面の画像が生成されたら、次は必要な構成をプロジェクトに追加します。

まず、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>

次に、res/xml/filepaths.xml リソースを追加し、twa スプラッシュ画面のパスを指定します。

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

最後に、Android マニフェストに meta-tags を追加して 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>

開発者の皆様が Trusted Web を使用して何を作成されるかを楽しみにしていますアクティビティ。ご意見やご感想がございましたら、 @ChromiumDev.