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

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

André Cipriani Bandarra

信頼できるウェブアクティビティは、カスタムタブに基づくプロトコルを使用して、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 プロジェクトを構成して検証する複数のオリジンを追加できます。

まず、res/values/strings.xml ファイルに string-array 要素を追加します。検証する追加の 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 を使用する

カスタムコードを使用して信頼できるウェブアクティビティを起動する場合、別のオリジンを追加するには、信頼できるウェブアクティビティを起動するインテントを作成するときに 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 のアセットリンクツールもあります。