Trusted Web Activity の設定は、特にウェブサイトを表示するだけの場合は少し複雑です。このガイドでは、信頼できるウェブ アクティビティを使用する基本的なプロジェクトを作成する方法について説明します。
このガイドを終了すると、次のことができるようになります。
- Bubblewrap を使用して、Trusted Web Activity を使用し、検証に合格するアプリケーションを作成した。
- 署名鍵が使用されるタイミングを理解する。
- Android アプリがビルドされている署名を特定できる。
- 基本的な Digital Asset Links ファイルを作成する方法を理解する。
このガイドの説明に従って操作するには、次のものが必要です。
- 開発用パソコンに Node.js 10 以降がインストールされている。
- 開発用に接続してセットアップされた Android スマートフォンまたはエミュレータ（実機を使用している場合は USB デバッグを有効にする）。
- 開発用スマートフォンで Trusted Web Activity をサポートしているブラウザ。Chrome 72 以降が動作します。他のブラウザでのサポートも近日提供予定です。
- Trusted Web Activity で表示するウェブサイト。
Trusted Web Activity を使用すると、Android アプリはブラウザの UI なしで全画面ブラウザタブを起動できます。この機能は、お客様が所有するウェブサイトに限定されており、デジタル アセット リンクを設定することで確認できます。詳細については、後ほど説明します。
信頼できるウェブ アクティビティを起動すると、ブラウザはデジタル アセット リンクのチェックアウトを確認します。これを検証と呼びます。確認に失敗すると、ブラウザはウェブサイトをカスタムタブとして表示します。
Bubblewrap をインストールして設定する
Bubblewrap は、Node.js 用のライブラリとコマンドライン ツール（CLI）のセットです。デベロッパーは、Trusted Web Activity を使用して、Android アプリ内でプログレッシブ ウェブアプリを生成、ビルド、実行できます。
CLI は次のコマンドでインストールできます。
npm i -g @bubblewrap/cli
環境の設定
Bubblewrap を初めて実行すると、必要な外部依存関係を自動的にダウンロードしてインストールするよう求められます。依存関係が正しく構成されるように、ツールにこの処理を許可することをおすすめします。既存の Java 開発キット（JDK）または Android コマンドライン ツールのインストールの使用方法については、Bubblewrap のドキュメントをご覧ください。
プロジェクトの初期化とビルドを行う
PWA をラップする Android プロジェクトを初期化するには、init コマンドを実行します。
bubblewrap init --manifest=https://my-twa.com/manifest.json
Bubblewrap は ウェブ マニフェストを読み取り、Android プロジェクトで使用する値を確認するようデベロッパーに求めて、その値を使用してプロジェクトを生成します。プロジェクトが生成されたら、次のコマンドを実行して APK を生成します。
bubblewrap build
実行
ビルドステップにより、app-release-signed.apk というファイルが出力されます。このファイルは、テスト用に開発デバイスにインストールすることも、リリース用に Google Play ストアにアップロードすることもできます。
Bubblewrap には、ローカル デバイスにアプリをインストールしてテストするコマンドがあります。開発用デバイスをパソコンに接続した状態で、次のコマンドを実行します。
bubblewrap install
または、adb ツールを使用することもできます。
adb install app-release-signed.apk
これで、デバイスのランチャーでアプリを使用できるようになります。アプリを開くと、ウェブサイトが信頼できるウェブ アクティビティではなくカスタムタブとして起動されます。これは、デジタル アセット リンクの検証がまだ設定されていないためです。まず、
Bubblewrap の代替のグラフィカル ユーザー インターフェース（GUI）
PWA Builder は、Bubblewrap ライブラリを使用して Trusted Web Activity プロジェクトの生成を可能にする GUI インターフェースを提供します。PWA Builder を使用して PWA を開く Android アプリを作成する方法については、こちらのブログ投稿をご覧ください。
署名鍵に関する注意事項
デジタル アセットリンクでは、APK が署名された鍵が考慮されます。検証が失敗する一般的な原因は、間違った署名を使用していることです。（確認に失敗すると、ウェブサイトはページ上部のブラウザ UI でカスタムタブとして起動されます）。Bubblewrap によってアプリをビルドすると、init ステップで鍵が設定された APK が作成されます。ただし、Google Play でアプリを公開する際に、署名鍵の処理方法によっては、別の鍵が作成される場合があります。詳しくは、署名鍵とバブルラップおよび Google Play との関連についての説明をご覧ください。
アセットリンク ファイルを設定する
デジタル アセット リンクは、基本的に、アプリを参照するウェブサイト上のファイルと、ウェブサイトを参照するアプリ内のメタデータで構成されています。
assetlinks.json ファイルを作成したら、ブラウザでアプリを適切に検証できるように、ルートからの相対パス .well-known/assetlinks.json でウェブサイトにアップロードします。デジタル アセットリンクと署名鍵の関係について詳しくは、デジタル アセットリンクの詳細をご覧ください。
ブラウザの確認
信頼できるウェブ アクティビティは、ユーザーが選択したデフォルトのブラウザに従うよう試みます。 ユーザーのデフォルト ブラウザが Trusted Web Activity をサポートしている場合は、そのブラウザが起動されます。これに失敗すると、Trusted Web Activity をサポートしているブラウザがあれば、そのブラウザが選択されます。最後に、デフォルトの動作はカスタムタブ モードにフォールバックすることです。
つまり、Trusted Web Activity に関連する問題をデバッグする場合は、想定しているブラウザを使用していることを確認する必要があります。次のコマンドを使用して、使用しているブラウザを確認できます。
> adb logcat -v brief | grep -e TWAProviderPicker
D/TWAProviderPicker(17168): Found TWA provider, finishing search: com.google.android.apps.chrome
次のステップ
このガイドを読めば、信頼できるウェブ アクティビティとして機能し、確認が失敗した場合に何が起こっているかをデバッグするための十分な知識があるはずです。まだの場合は、ウェブ デベロッパー向けの Android のコンセプトを確認するか、こちらのドキュメントで GitHub の問題を提出してください。
次のステップとして、まずアプリのアイコンを作成することをおすすめします。それが完了したら、アプリを Google Play ストアにデプロイすることを検討してください。