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

マルチオリジンの信頼できるウェブアクティビティ

André Cipriani Bandarra

Trusted Web Activity は、カスタムタブに基づくプロトコルを使用して、PWA などのウェブアプリコンテンツを Android アプリと統合する新しい方法です。

ff-origin ナビゲーション

信頼できるウェブアクティビティでコンテンツを全画面表示するには、デジタルアセットリンクを使用して開いているオリジンを検証する必要があります。

ユーザーが検証済みのオリジンから離れると、カスタムタブの UI が表示されます。[カスタム] タブの URL バーには、アプリ外のドメインに移動していることがユーザーに通知されます。また、検証済みのオリジンにすばやく戻ることができる X ボタンも表示されます。

ただし、ウェブアプリで複数のオリジンにまたがるエクスペリエンスを作成することも一般的です。たとえば、ショッピングアプリケーションで、メインエクスペリエンスが www.example.com にあり、購入手続きフローが checkout.example.com でホストされている場合などです。

このような場合、ユーザーが同じアプリ内にいるだけでなく、上部バーによってユーザーがアプリを離れたと誤解して購入手続きを中止する可能性があるため、カスタムタブを表示することは望ましくありません。

信頼できるウェブアクティビティを使用すると、デベロッパーは複数のオリジンを検証できます。ユーザーは、これらのオリジン間を移動しても全画面表示のままになります。メインドメインと同様に、デベロッパーは検証済みの各オリジンを制御できる必要があります。

複数の送信元の検証を設定する

メインのオリジンと同様に、検証はデジタルアセットリンクを介して行われ、検証対象の各ドメインに独自の assetlinks.json ファイルが必要です。

各オリジンに assetlinks ファイルを追加する

www.example.com と checkout.example.com の例では、次のように設定します。

https://www.example.com/.well-known/assetlinks.json
https://checkout.example.com/.well-known/assetlinks.json

各ドメインが同じ Android アプリに接続されるため、assetlinks.json ファイルはまったく同じになります。

Android アプリケーションのパッケージ名が com.example.twa であると仮定すると、両方の assetlink.json ファイルには次のような内容が含まれます。

[{
  "relation": ["delegate_permission/common.handle_all_urls"],
  "target": {
  "namespace": "android_app",
  "package_name": "com.example",
   "sha256_cert_fingerprints": ["..."]}
}]

Android アプリに複数のオリジンを追加する

Android アプリでは、検証が必要なすべてのオリジンが含まれるように asset_statements 宣言を更新する必要があります。

<string name="asset_statements">
[{
    \"relation\": [\"delegate_permission/common.handle_all_urls\"],
    \"target\": {
        \"namespace\": \"web\",
        \"site\": \"https://www.example.com\"
    }
}],
[{
    \"relation\": [\"delegate_permission/common.handle_all_urls\"],
    \"target\": {
        \"namespace\": \"web\",
        \"site\": \"https://checkout.example.com\"
    }
}],
</string>

LauncherActivity に追加のオリジンを追加

デフォルトの LauncherActivity を使用する

android-browser-helper サポートライブラリの一部である LauncherActivity を使用すると、Android プロジェクトを構成して検証する複数のオリジンを追加できます。

まず、string-array 要素を res/values/strings.xml ファイルに追加します。検証する追加の URL は、item サブ要素内に配置します。

...
<string-array name="additional_trusted_origins">
    <item>https://www.google.com</item>
</string-array>
...

次に、AndroidManifest.xml 内の LauncherActivity を参照する既存のアクティビティ要素内に、新しい meta-data タグを追加します。

...
<activity android:name="com.google.androidbrowserhelper.trusted.LauncherActivity"
    android:label="@string/app_name">


    <meta-data
        android:name="android.support.customtabs.trusted.ADDITIONAL_TRUSTED_ORIGINS"
        android:resource="@array/additional_trusted_origins" />


    ...
</activity>
...

カスタム LauncherActivity を使用する

カスタムコードを使用して Trusted Web Activity を起動する場合は、Trusted Web Activity を起動する Intent をビルドするときに setAdditionalTrustedOrigins を呼び出すことで、追加のオリジンを追加できます。

public void launcherWithMultipleOrigins(View view) {
  List<String> origins = Arrays.asList(
      "https://checkout.example.com/"
  );


  TrustedWebActivityIntentBuilder builder = new TrustedWebActivityIntentBuilder(LAUNCH_URI)
      .setAdditionalTrustedOrigins(origins);


  new TwaLauncher(this).launch(builder, null, null);
}

まとめ

これらの手順を完了すると、Trusted Web Activity は複数のオリジンをサポートできるようになります。android-browser-helper には、複数オリジンの Trusted Web Activity 用のサンプルアプリケーションがあります。必ずご確認ください。

トラブルシューティング

デジタルアセットリンクの設定には、いくつかの要素があります。アプリの上部にカスタムタブバーが引き続き表示される場合は、構成に誤りがある可能性があります。

Trusted Web Activity クイックスタートガイドのトラブルシューティングのセクションでは、デジタルアセットリンクの問題をデバッグする方法について説明しています。

また、デバイスにインストールされているアプリのデジタルアセットリンクのデバッグに役立つ、優れた Peter のアセットリンクツールもあります。