信頼できるウェブ アクティビティでウェブ共有ターゲットを有効にする

Web Share Target を使用すると、PWA はデバイスにインストールされている他のアプリから共有されたコンテンツを受け取ることができます。この機能は、たとえば、画像エディタなどのアプリがカメラアプリから画像を受け取ったり、ソーシャル ネットワークが共有する画像や動画を受け取ったりするために使用できます。

Chrome 86 以降、信頼できるウェブ アクティビティを使用するアプリケーションでも Web Share Target を利用できるようになりました。PWA はそのまま動作しますが、Android アプリケーションにはいくつかの変更が必要です。

この記事は、デベロッパーが Trusted Web Activity について十分に理解していることを前提としています。このテクノロジーを初めて使用する読者は、統合ガイドから始めることができます。

同様に、PWA での Web Share Target の実装に関する詳細な説明は範囲外です。詳しくは、こちらの記事をご覧ください。

この記事では、https://scrapbook-pwa.web.app/ にあるデモアプリを PWA として使用します。このアプリのソースコードは GitHub で入手できます。また、Android アプリケーションは基本的な Trusted Web Activity のデモに基づいています。

Android アプリに Web Share Target を追加する

既存の Trusted Web Activity ベースのアプリケーションを変更して Web Share Target を実装するには、次の 3 つのファイルに変更を加える必要があります。

build.gradle

android-browser-helper ライブラリが更新され、Web Share Target がサポートされるようになりました。まず、2.0.1 以上のバージョンを使用するようにアプリケーションを更新します。

dependencies {
    ...
    implementation 'com.google.androidbrowserhelper:androidbrowserhelper:2.2.0'
}

res/strings.xml

アプリケーションは、Trusted Web Activity に、サポートする共有の受信の詳細(開く URL、使用するメソッド、サポートされる MIME タイプなど)を伝える必要があります。

これは、文字列リソースを使用して Trusted Web Activity で利用可能な JSON を介して行われます。フィールドはウェブ マニフェストで利用可能な share_target フィールドと同じで、ほぼそのまま strings.xml 内の文字列に追加できます。ただし、次の 2 つの重要な点に注意してください。

  1. action 属性の値は、オリジンを含む完全な URL にする必要があります。
  2. 二重引用符はエスケープする必要があります。そのため、各 "\" になります。

https://googlechrome.github.io/samples/scrapbook-pwa/manifest.jsonshare_target セクションは次のようになります。

{
  ...
  "share_target": {
    "action": "/_share-target",
    "enctype": "multipart/form-data",
    "method": "POST",
    "params": {
      "files": [{
        "name": "media",
        "accept": [
          "audio/*",
          "image/*",
          "video/*"
        ]
      }]
    }
  },
  ...
}

新しい文字列要素は次のようになります。

<string name="share_target">
{
    \"action\": \"https://twa-web-scrapbook.web.app/_share-target\",
    \"method\": \"POST\",
    \"enctype\": \"multipart/form-data\",
    \"params\": {
      \"files\": [{
          \"name\": \"media\",
          \"accept\": [\"image/*\", \"audio/*\", \"video/*\"]
      }]
    }
}
</string>

AndroidManifest.xml

Android マニフェストにいくつかの変更が必要です。まず、DelegationService が宣言され、エクスポートされ、有効になっていることを確認する必要があります。

基本的なデモに基づいてアプリケーションを構築したデベロッパーは、すでにサービスが含まれており、マークアップはアプリケーション タグ内にあり、次のようになっているはずです。

<service
    android:name="com.google.androidbrowserhelper.trusted.DelegationService"
    android:enabled="true"
    android:exported="true">

    <intent-filter>
        <action android:name="android.support.customtabs.trusted.TRUSTED_WEB_ACTIVITY_SERVICE"/>
        <category android:name="android.intent.category.DEFAULT"/>
    </intent-filter>
</service>

最後に、LauncherActivity アクティビティ タグに 2 つの新しいアイテムを追加する必要があります。 - strings.xml で定義された JSON を参照する meta-data タグ。- アプリが処理できる MIME タイプをデバイス上の他のアプリに宣言する intent-filter

<meta-data
    android:name="android.support.customtabs.trusted.METADATA_SHARE_TARGET"
    android:resource="@string/share_target"/>

<intent-filter>
    <action android:name="android.intent.action.SEND" />
    <action android:name="android.intent.action.SEND_MULTIPLE" />
    <category android:name="android.intent.category.DEFAULT" />
    <data android:mimeType="audio/*" />
    <data android:mimeType="image/*" />
    <data android:mimeType="video/*" />
</intent-filter>

上記のマークアップでわかるように、share_target JSON で宣言された mime-type ごとに data 要素を追加する必要があります。

まとめ

Web Share Target の統合により、信頼できるウェブ アクティビティ内の PWA を Android デバイスにインストールされている他のアプリとより深く統合できます。

上記の手順で説明したように、Trusted Web Activity を使用する既存の Android アプリで API のサポートを追加するために必要な追加のマークアップは、android-browser-helper によって簡素化されます。

PWA での API の使用について詳しくは、ウェブ共有ターゲットに関する記事をご覧ください。プログレッシブ ウェブアプリからコンテンツを共有する方法については、ウェブ共有 API をご覧ください。

トラブルシューティング

別のアプリからファイルを共有しようとすると、自分のアプリがオプションとして表示されません。

アプリケーションがオプションとして表示されない場合は、intent-filter が正しくないことを示します。intent-filter マークアップを再度確認し、アプリケーションで処理される正しいアクション、カテゴリ、mime-types が含まれていることを確認します。

アプリがオプションとして表示され、PWA が起動するものの、データが共有されません。

これにはいくつかの原因が考えられます。確認事項のチェックリストは次のとおりです。

  • Digital Asset Links の検証が成功していることを確認します。
  • strings.xml 内の JSON が正しいことを確認します。