Trusted Web Activity の設定は、特にウェブサイトを表示するだけの場合は少し複雑です。このガイドでは、信頼できるウェブ アクティビティを使用する基本的なプロジェクトを作成する方法について説明します。また、注意すべき点についても説明します。
このガイドを終えると、次のことができるようになります。
- Bubblewrap を使用して、Trusted Web Activity を使用し、検証に合格するアプリケーションを作成した。
- 署名鍵が使用されるタイミングを理解する。
- Android アプリがビルドされている署名を特定できる。
- 基本的な Digital Asset Links ファイルを作成する方法を理解する。
このガイドの説明に従って操作するには、次のものが必要です。
- 開発用コンピュータに Node.js 10 以降がインストールされている
- 開発用にセットアップされた Android スマートフォンまたはエミュレータ(実機を使用している場合は、USB デバッグを有効にする)
- 開発用スマートフォンで信頼できるウェブ アクティビティをサポートするブラウザ
- 信頼できるウェブ アクティビティで表示したいウェブサイト
信頼できるウェブ アクティビティを使用すると、Android アプリからブラウザ UI を使わずに全画面のブラウザタブを起動できます。この機能は所有しているウェブサイトに限定されており、デジタル アセット リンクを設定することで確認できます。詳細については後ほど説明します。
信頼できるウェブ アクティビティを起動すると、ブラウザはデジタル アセット リンクのチェックアウトを確認します。これを検証と呼びます。確認が失敗した場合、ブラウザはウェブサイトをカスタムタブとして表示します。
Bubblewrap をインストールして設定する
Bubblewrap は、Node.js 用のライブラリとコマンドライン ツール(CLI)のセットです。デベロッパーは、Trusted Web Activity を使用して、Android アプリ内でプログレッシブ ウェブアプリを生成、ビルド、実行できます。
CLI は次のコマンドでインストールできます。
環境の設定
Bubblewrap を初めて実行すると、必要な外部依存関係を自動的にダウンロードしてインストールするよう求められます。依存関係が正しく構成されるように、この作業はツールに任せることをおすすめします。既存の Java 開発キット(JDK)または Android コマンドライン ツールのインストールの使用方法については、Bubblewrap のドキュメントをご覧ください。
プロジェクトを初期化してビルドする
PWA をラップする Android プロジェクトを初期化するには、init コマンドを実行します。
Bubblewrap は Web マニフェストを読み取り、Android プロジェクトで使用する値を確認するようデベロッパーに求めて、その値を使用してプロジェクトを生成します。プロジェクトが生成されたら、次のコマンドを実行して APK を生成します。
実行
ビルドステップでは、app-release-signed.apk
というファイルが出力されます。このファイルは、テスト用に開発デバイスにインストールすることも、リリース用に Google Play ストアにアップロードすることもできます。
Bubblewrap には、ローカル デバイスにアプリをインストールしてテストするコマンドがあります。開発用デバイスをパソコンに接続した状態で、次のコマンドを実行します。
または、adb ツールを使用することもできます。
注: **adb**
コマンドライン ツールは、**android_sdk/platform-tools/**
の Android コマンドライン ツール内にあります。
これで、デバイスのランチャーでアプリを使用できるようになります。アプリを開くと、ウェブサイトが信頼できるウェブ アクティビティではなくカスタムタブとして起動されます。これは、デジタル アセット リンクの検証がまだ設定されていないためです。まず、
Bubblewrap の代替のグラフィカル ユーザー インターフェース(GUI)
PWA Builder は、Bubblewrap ライブラリを使用して Trusted Web Activity プロジェクトの生成を可能にする GUI インターフェースを提供します。PWA Builder を使用して PWA を開く Android アプリを作成する方法については、こちらのブログ投稿をご覧ください。
署名鍵に関する注意事項
デジタル アセットリンクでは、APK が署名された鍵が考慮されます。検証が失敗する一般的な原因は、間違った署名を使用していることです。(確認に失敗すると、ウェブサイトはページ上部のブラウザ UI でカスタムタブとして起動されます)。Bubblewrap がアプリをビルドすると、init
ステップで鍵が設定された APK が作成されます。ただし、Google Play でアプリを公開する際に、署名鍵の処理方法によっては、別の鍵が作成される場合があります。詳しくは、署名鍵と Bubblewrap と Google Play との関係をご覧ください。
アセットリンク ファイルを設定する
デジタル アセット リンクは、基本的に、アプリを参照するウェブサイト上のファイルと、ウェブサイトを参照するアプリ内のメタデータで構成されます。
assetlinks.json
ファイルを作成したら、ウェブサイトにアップロードします。well-known/assetlinks.json
)を指定してください。これにより、アプリがブラウザで適切に検証されるようになります。署名鍵との関係について詳しくは、デジタル アセット リンクの詳細をご覧ください。
ブラウザの確認
信頼できるウェブ アクティビティは、ユーザーがデフォルトで選択したブラウザに準拠しようとします。ユーザーのデフォルト ブラウザが Trusted Web Activity をサポートしている場合は、そのブラウザが起動されます。インストールされているブラウザで信頼できるウェブ アクティビティがサポートされている場合は、そのブラウザが選択されます。最後に、デフォルトの動作はカスタムタブ モードにフォールバックすることです。
つまり、Trusted Web Activity に関する処理をデバッグする場合は、自分が想定しているブラウザを使用していることを確認する必要があります。次のコマンドを使用して、使用しているブラウザを確認できます。
次の手順
このガイドに沿って操作すれば、信頼できるウェブ アクティビティが機能し、検証が失敗したときに何が起こっているかをデバッグするのに十分な知識が身に付くはずです。問題が解決しない場合は、ウェブ デベロッパー向けの Android のコンセプトをご確認ください。解決しない場合は、こちらのドキュメントに関する GitHub の問題を報告してください。
次のステップとして、まずアプリのアイコンを作成することをおすすめします。アイコンが作成できたら、アプリを Google Play ストアにデプロイすることを検討してください。