ウェブ共有ターゲットを使用すると、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 要素を追加する必要があります。
まとめ
Web Share Target を統合することで、信頼できるウェブ アクティビティ内の PWA を Android デバイスにインストールされている他のアプリとより深く統合できます。
上記の手順で説明したように、信頼できるウェブ アクティビティを使用する既存の Android アプリで API のサポートを追加するために必要な追加マークアップは、android-browser-helper によって簡素化されます。
PWA での API の使用方法については、Web 共有ターゲットに関する記事をご覧ください。また、Web Share API を使用してプログレッシブ ウェブアプリからコンテンツを共有する方法については、こちらをご覧ください。
トラブルシューティング
別のアプリからファイルを共有しようとすると、自分のアプリがオプションとして表示されません。
アプリケーションがオプションとして表示されない場合は、intent-filter が正しくないことを示します。intent-filter マークアップを再度確認し、アプリケーションで処理される正しいアクション、カテゴリ、mime-types が含まれていることを確認します。
アプリがオプションとして表示され、PWA は起動しますが、データは共有されません。
これにはいくつかの原因が考えられます。確認すべき点のチェックリストは次のとおりです。
- Digital Asset Links の検証が正常に完了したことを確認します。
- strings.xml 内の JSON の正確性を確認します。