Android アプリで PWA を開始する
プログレッシブ ウェブアプリ（PWA）は、アプリのような機能を使用して、高速で信頼性が高く、魅力的な高品質のエクスペリエンスを作成するウェブ アプリケーションです。
ウェブはリーチに圧倒的な規模を誇り、ユーザーは新しい体験を発見できる強力な手段となります。ただし、ユーザーはオペレーティング システム ストアでアプリケーションの検索を行うことにも慣れています。多くの場合、こうしたユーザーは自分が求めているブランドやサービスをすでによく知っており、高い意識を持っており、その結果、平均よりも高いエンゲージメント指標が得られます。
Google Play ストアは Android アプリのストアであり、多くのデベロッパーは Android アプリからプログレッシブ ウェブアプリを開きます。
Trusted Web Activity は、Android アプリ内で PWA をレンダリングするための完全なウェブ プラットフォーム対応コンテナをブラウザが提供できるようにするオープン スタンダードです。この機能は Chrome で利用でき、開発中の Firefox Nightly でもあります。
既存のソリューションは限られていた
Android アプリにウェブ エクスペリエンスを組み込むことは、Android WebView などのテクノロジーや Cordova などのフレームワークを使用することで、常に可能でした。
Android WebView の制限は、ブラウザの代替として意図されていないことです。Android WebView は、Android アプリでウェブ UI を使用するためのデベロッパー ツールであり、連絡先選択ツールやファイル システムなど、最新のウェブ プラットフォーム機能への完全なアクセスは提供しません。
Cordova は WebView の欠点を補うように設計されていますが、API は Cordova 環境内に制限されます。つまり、Android アプリで Cordova API を使用するための追加のコードベースを、オープンウェブ上の PWA とは別に管理する必要があります。
また、多くの場合、機能の検出が想定どおりに機能するとは限らず、Android バージョンと OEM 間の互換性の問題も問題になることがあります。これらのソリューションのいずれかを使用する場合、デベロッパーは追加の品質保証プロセスを必要とし、回避策を検出して作成するために追加の開発コストが発生します。
Trusted Web Activity は、Android のウェブアプリ用の新しいコンテナです
デベロッパーは、Trusted Web Activity をコンテナとして、PWA を Android アプリの起動アクティビティとして含めることができるようになりました。このテクノロジーは、ブラウザを活用して PWA を全画面でレンダリングします。これにより、Trusted Web Activity が基盤となるブラウザと同じウェブ プラットフォームの機能および API と互換性を持つことが保証されます。Trusted Web Activity を使用した Android アプリの実装をさらに簡単にするオープンソースのユーティリティもあります。
他のソリューションでは利用できないもう一つの利点として、コンテナがブラウザとストレージを共有することがあります。ログインの状態とユーザー設定は、エクスペリエンス間でシームレスに共有されます。
ブラウザの互換性
この機能は Chrome バージョン 75 以降で利用でき、Firefox ではナイトリー版に実装されています。
品質基準
ウェブ デベロッパーは、Android アプリにウェブ コンテンツを含めたい場合、信頼できるウェブ アクティビティを使用する必要があります。
Trusted Web Activity のウェブ コンテンツは、PWA インストールの条件を満たしている必要があります。
また、Android アプリにユーザーが期待する動作に合わせて、Chrome 86 で変更が導入されました。これにより、次のシナリオを処理しないとクラッシュと見なされます。
- アプリの起動時にデジタル アセット リンクを検証できない。
- オフライン ネットワーク リソース リクエストに対して HTTP 200 が返されませんでした。
- HTTP 404 または 5xx エラーを返すナビゲーション リクエスト」
これらのシナリオのいずれかが信頼できるウェブ アクティビティで発生すると、Android アプリがユーザーの目に見える形でクラッシュします。Service Worker でのこのようなシナリオの処理については、ガイダンスをご覧ください。
また、アプリはポリシーへの準拠など、Android 固有の追加基準も満たしている必要があります。
ツール
Trusted Web Activity を利用すると、ウェブ デベロッパーは、PWA を Android アプリに変換するために新しいテクノロジーや API を習得する必要はありません。Bubblewrap と PWABuilder は、ライブラリ、コマンドライン インターフェース（CLI）、グラフィカル ユーザー インターフェース（GUI）の形式でデベロッパー ツールを提供します。
バブルラップ
Bubblewrap プロジェクトは、NodeJS ライブラリとコマンドライン インターフェース（CLI）の形式で Android アプリを生成します。
新しいプロジェクトをブートストラップするには、ツールを実行してウェブ マニフェストの URL を渡します。
npx @bubblewrap/cli init --manifest=https://pwa-directory.appspot.com/manifest.json
このツールはプロジェクトをビルドすることもできます。次のコマンドを実行すると、Play ストアにアップロードするための Android アプリが出力されます。
npx @bubblewrap/cli build
このコマンドを実行すると、app-release-signed.apk というファイルがプロジェクトのルート ディレクトリで使用できるようになります。これが Google Play ストアにアップロードされるファイルです。
PWABuilder
PWABuilder を使用すると、既存のウェブサイトをプログレッシブ ウェブアプリに変換できます。また、Bubblewrap と統合して、こうした PWA を Android アプリにラップするための GUI インターフェースを提供します。PWABuilder チームは、このツールを使用して Android アプリを生成する方法について、有益なブログ投稿をまとめています。
Android アプリで PWA の所有権を確認する
優れたプログレッシブ ウェブアプリを構築するデベロッパーは、他のデベロッパーが許可なくそのプログレッシブ ウェブアプリを使用して Android アプリを制作することは望ましくありません。これを回避するには、デジタル アセット リンクというツールを使用して、Android アプリをプログレッシブ ウェブアプリとペア設定する必要があります。
Bubblewrap と PWABuilder は、Android アプリで必要な構成を行いますが、assetlinks.json ファイルを PWA に追加するという、最後のステップが残ります。
デベロッパーがこのファイルを生成するには、ユーザーがダウンロードする APK の署名に使用する鍵の SHA-256 署名が必要です。
鍵は複数の方法で生成できますが、エンドユーザーに配信される APK に署名した鍵を見つける最も簡単な方法は、Google Play ストア自体からダウンロードすることです。
破損したアプリがユーザーに表示されないようにするには、アプリをクローズド テスト チャンネルにデプロイしてテストデバイスにインストールし、Peter の Asset Link Tool を使用してアプリに適した assetlinks.json ファイルを生成します。生成された assetlinks.json ファイルを、検証対象のドメインの /.well-known/assetlinks.json で利用できるようにします。
次のステップ
プログレッシブ ウェブアプリは高品質なウェブ エクスペリエンスです。信頼できるウェブ アクティビティは、最低品質基準を満たした場合に Android アプリから高品質のエクスペリエンスを開くための新しい方法です。
プログレッシブ ウェブアプリを初めて使用する場合は、優れた PWA の作成方法に関するガイダンスをご覧ください。すでに PWA を使用しているデベロッパーは、Lighthouse を使用して、品質基準を満たしていることを確認します。
次に、Bubblewrap または PWABuilder を使用して Android アプリを生成し、Google Play ストアのクローズド テスト チャネルにアプリをアップロードして、Peter のアセットリンク ツールを使用して PWA とペア設定します。
最後に、アプリをクローズド テスト チャンネルから本番環境に移行します。