ウェブ共有ターゲットを使用すると、PWA はデバイスにインストールされている他のアプリから共有コンテンツを受信できます。この機能は、たとえば、画像エディタなどのアプリがカメラアプリから画像を受信する場合や、ソーシャル ネットワークが共有用の画像や動画を受信する場合などに使用できます。
Chrome 86 以降、信頼できるウェブ アクティビティを使用するアプリでもウェブ共有ターゲットを使用できるようになりました。PWA はすぐに動作しますが、Android アプリにはいくつかの変更が必要です。
この記事では、デベロッパーが Trusted Web Activity に精通していることを前提としています。この技術を初めて使用する場合は、統合ガイドをご覧ください。
同様に、PWA におけるウェブ共有ターゲットの実装の詳細な説明は対象外です。詳しくは、こちらの記事をご覧ください。
この記事では、https://scrapbook-pwa.web.app/ のデモアプリを PWA として使用します。このアプリのソースコードは GitHub で入手できます。Android アプリは、基本的な Trusted Web Activity デモに基づいています。
Android アプリにウェブ共有のターゲットを追加する
既存の Trusted Web Activity ベースのアプリを変更してウェブ共有ターゲットを実装するには、3 つの異なるファイルを変更する必要があります。
build.gradle
android-browser-helper ライブラリが更新され、ウェブ共有ターゲットがサポートされるようになりました。最初のステップとして、2.0.1 以降のバージョンを使用するようにアプリケーションを更新します。
dependencies {
...
implementation 'com.google.androidbrowserhelper:androidbrowserhelper:2.2.0'
}
res/strings.xml
アプリは、信頼できるウェブ アクティビティに対し、開く URL、使用するメソッド、サポートされている MIME タイプなど、受信をサポートしている共有の詳細を伝える必要があります。
これは、文字列リソースを使用して Trusted Web Activity で利用できるようにした JSON を介して行われます。このフィールドは、ウェブ マニフェストで使用できる share_target
フィールドと同じですが、strings.xml
内の文字列にほぼそのまま追加できますが、次の 2 つの重要な注意事項があります。
- action 属性の値は、オリジンを含む完全な URL にする必要があります。
- 二重引用符はエスケープする必要があります。各
"
は\"
になります。
https://scrapbook-pwa.web.app/manifest.json の share_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
要素を追加する必要があります。
まとめ
ウェブ共有ターゲットを統合すると、信頼できるウェブ アクティビティ内の PWA を、Android デバイスにインストールされている他のアプリとより緊密に統合できます。
上記の手順で説明したように、信頼できるウェブ アクティビティを使用する既存の Android アプリで API のサポートを追加するために必要な追加マークアップは、android-browser-helper によって簡素化されます。
PWA での API の使用方法については、Web Share Target に関する記事をご覧ください。また、Web Share API を使用して Progressive Web App からコンテンツを共有する方法については、こちらをご覧ください。
トラブルシューティング
別のアプリケーションからファイルを共有しようとすると、アプリケーションがオプションとして表示されません。
アプリケーションがオプションとして表示されない場合は、intent-filter
が正しくないことを示します。intent-filter
マークアップを再度確認し、アプリケーションで処理される正しいアクション、カテゴリ、mime-types
が含まれていることを確認します。
アプリがオプションとして表示され、PWA は起動していますが、データが共有されません。
これにはいくつかの原因が考えられます。確認すべき点のチェックリストは次のとおりです。
- デジタル アセット リンクの検証が成功したことを確認します。
- strings.xml 内の JSON の正確性を確認します。