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

André Cipani Bandarra
André Cipriani Bandarra

La cible de partage Web permet aux PWA de recevoir du contenu partagé provenant d'autres applications installées sur l'appareil. Cette fonctionnalité peut, par exemple, être utilisée par des applications telles que des é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, la cible de partage Web est également disponible pour les applications utilisant l'activité Web fiable. La PWA devrait être prête à l'emploi. Toutefois, vous devez apporter quelques modifications à l'application Android.

Cet article suppose que le développeur connaît les activités Web fiables. Les lecteurs qui débutent avec cette technologie peuvent se lancer avec le guide d'intégration.

Dans le même ordre d'idées, une explication complète de l'implémentation de la cible de partage Web dans une PWA n'entre pas dans le champ d'application. Les développeurs peuvent trouver plus d'informations dans cet article.

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

Ajouter une cible de partage Web à l'application Android

Pour modifier une application basée sur l'activité Web fiable existante afin d'implémenter la cible de partage Web, vous devez modifier trois fichiers différents:

build.gradle

La bibliothèque android-browser-helper a été mise à jour pour être compatible avec la cible de partage Web. Dans un premier temps, 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 accepte de recevoir, comme les URL à ouvrir, la méthode à utiliser et les types MIME acceptés.

Cela se fait via un JSON, mis à la disposition de l'activité Web fiable avec une ressource de chaîne. Ces champs sont identiques à ceux du champ share_target disponible dans le fichier manifeste Web et 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, origine comprise.
  2. Les guillemets doubles doivent être échappés, de sorte que chaque " devienne \".

Voici à quoi ressemble la section share_target de https://scrapbook-pwa.web.app/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 requises dans le fichier manifeste Android. Nous devons d'abord nous assurer que DelegationService est déclaré, exporté et activé.

Le service est déjà inclus pour les développeurs qui ont créé leur application sur la base de la version de démonstration de base. Le balisage doit se trouver dans la balise de l'application et se présenter comme 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 éléments doivent être ajoutés au tag d'activité LauncherActivity : - Une balise meta-data qui référence le fichier JSON défini dans le fichier string.xml : intent-filter qui déclare les types MIME que l'application peut gérer avec les autres applications de 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 fichier JSON share_target.

Conclusion

L'intégration de la cible de partage Web permet aux PWA d'une activité Web fiable 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, android-browser-helper simplifie le balisage supplémentaire nécessaire pour prendre en charge l'API dans une application Android existante qui utilise l'activité Web fiable.

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 d'une progressive web app.

Dépannage

Mon application ne s'affiche pas dans les options lorsque j'essaie de partager un fichier à partir d'une autre application.

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

Mon application s'affiche en tant qu'option. La PWA est démarrée, mais les données ne sont pas partagées.

Plusieurs causes peuvent être à l'origine de ce problème. Voici une checklist d'éléments à prendre en compte:

  • Assurez-vous que la validation Digital Asset Links aboutit.
  • Vérifiez que le fichier JSON du fichier string.xml est correct.