Activer la cible de partage Web dans l'activité Web fiable

Web Share Target permet aux PWA de recevoir du contenu partagé depuis d'autres applications installées sur l'appareil. Cette fonctionnalité peut être utilisée, par exemple, par des applications telles que les éditeurs d'images pour recevoir une image d'une application d'appareil photo, ou par un réseau social pour recevoir une image ou une vidéo à partager.

À partir de Chrome 86, Web Share Target est également disponible pour les applications utilisant Trusted Web Activity. Bien que la PWA devrait fonctionner immédiatement, quelques modifications sont nécessaires pour l'application Android.

Cet article part du principe que le développeur connaît les activités Web fiables. Les lecteurs qui ne connaissent pas encore cette technologie peuvent commencer par le guide d'intégration.

De même, une explication complète de l'implémentation de la cible de partage Web dans une PWA est hors champ. Les développeurs peuvent trouver plus d'informations dans cet article.

L'application de démonstration à l'adresse https://scrapbook-pwa.web.app/ sera utilisée comme PWA pour cet article. Son code source est disponible sur GitHub. L'application Android est basée sur la démonstration de l'activité Web de confiance de base.

Ajouter une cible de partage Web à l'application Android

Pour modifier une application d'activité Web fiable existante afin d'implémenter Web Share Target, vous devez modifier trois fichiers différents :

build.gradle

La bibliothèque android-browser-helper a été mise à jour pour prendre en charge Web Share Target. Pour commencer, mettez à jour l'application afin qu'elle utilise une version supérieure ou égale à 2.0.1.

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

res/strings.xml

L'application doit indiquer à l'activité Web fiable les détails du partage qu'elle prend en charge, comme les URL à ouvrir, la méthode à utiliser et les types MIME acceptés.

Pour ce faire, un fichier JSON est mis à la disposition de l'activité Web de confiance avec une ressource de chaîne. Les champs sont les mêmes que le champ share_target disponible dans le fichier manifeste Web. Ils peuvent être ajoutés à une chaîne dans strings.xml, presque tels quels, avec deux remarques importantes :

  1. La valeur de l'attribut "action" doit correspondre à l'URL complète, y compris l'origine.
  2. Les guillemets doubles doivent être échappés. Par conséquent, chaque " devient \".

Voici à quoi ressemble la section share_target de https://googlechrome.github.io/samples/scrapbook-pwa/manifest.json :

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

Le nouvel élément de chaîne se présentera comme suit :

<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

Quelques modifications sont nécessaires dans le fichier manifeste Android. Nous devons d'abord nous assurer que DelegationService est déclaré, exporté et activé.

Les développeurs qui ont créé leur application sur la base de la démo de base auront déjà inclus le service. Le balisage devrait se trouver dans la balise d'application et ressembler à ce qui suit :

<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>

Enfin, deux nouveaux éléments doivent être ajoutés à la balise d'activité LauncherActivity : - Une balise meta-data qui fait référence au fichier JSON défini dans strings.xml. - Un intent-filter qui déclare les types MIME que l'application peut gérer pour d'autres applications sur l'appareil.

<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>

Comme vous pouvez le voir dans le balisage ci-dessus, un élément data doit être ajouté pour chaque mime-type déclaré dans le JSON share_target.

Conclusion

L'intégration de Web Share Target permet aux PWA dans une activité Web de confiance d'être plus profondément intégrées aux autres applications installées sur un appareil Android.

Comme décrit dans les étapes ci-dessus, le balisage supplémentaire nécessaire pour ajouter la prise en charge de l'API dans une application Android existante qui utilise une activité Web de confiance est simplifié par android-browser-helper.

Consultez l'article sur la cible de partage Web pour en savoir plus sur l'utilisation de l'API sur une PWA et l'API Web Share pour découvrir comment partager du contenu à partir de la Progressive Web App.

Dépannage

Mon application ne s'affiche pas comme option lorsque j'essaie de partager un fichier depuis une autre application.

Si l'application ne s'affiche pas comme option, cela signifie que le intent-filter est incorrect. Vérifiez le balisage intent-filter, et assurez-vous qu'il contient les actions, la catégorie et le mime-types gérés par l'application.

Mon application s'affiche comme une option, la PWA est lancée, mais les données ne sont pas partagées.

Plusieurs raisons peuvent expliquer cela. Voici une checklist des éléments à vérifier :

  • Assurez-vous que la validation des liens Digital Asset a réussi.
  • Vérifiez que le fichier JSON dans strings.xml est correct.