Habilitar Web Share Target en Trusted Web Activity

El objetivo de Compartir con la Web permite que las AWP reciban contenido compartido de otras aplicaciones instaladas en el dispositivo. Esta función puede usarse, por ejemplo, en aplicaciones como editores de imágenes para recibir una imagen de una app de cámara o una red social para recibir una imagen o un video para compartirlos.

A partir de Chrome 86, Web Share Target también está disponible para las aplicaciones que usan la actividad web de confianza. Si bien la AWP debería funcionar de inmediato, se requieren algunos cambios en la aplicación para Android.

En este artículo, se supone que el desarrollador está familiarizado con las actividades web de confianza. Los lectores que no conozcan la tecnología pueden comenzar con la Guía de integración.

Del mismo modo, está fuera del alcance una explicación completa de la implementación del objetivo de Web Share en una AWP, y los desarrolladores pueden encontrar más información en este artículo.

La aplicación de demostración en https://scrapbook-pwa.web.app/ se usará como la AWP de este artículo, y su código fuente está disponible en GitHub. La aplicación para Android se basa en la demostración básica de Actividad web de confianza.

Agrega un destino de Compartir con la Web a la app para Android

Para modificar una aplicación existente basada en la actividad web de confianza para implementar el objetivo de Web Share, se requieren modificaciones en tres archivos diferentes:

build.gradle

Se actualizó la biblioteca android-browser-helper con compatibilidad para Web Share Target. Como primer paso, actualiza la aplicación para usar una versión posterior o igual a 2.0.1.

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

res/strings.xml

La aplicación debe indicarle a la actividad web confiable los detalles del uso compartido que admite recibir, como qué URLs abrir, el método que se usará y los tipos mime admitidos.

Esto se hace a través de un JSON, que se pone a disposición de la actividad web confiable con un recurso de cadena. Los campos son los mismos que el campo share_target disponible en el manifiesto web y se pueden agregar a una cadena dentro de strings.xml, casi tal como están, con dos notas importantes:

  1. El valor del atributo action debe ser la URL completa, incluido el origen.
  2. Se deben escapar las comillas dobles, de modo que cada " se convierta en \".

Así se ve la sección 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/*"
        ]
      }]
    }
  },
  ...
}

Y el nuevo elemento de cadena se verá de la siguiente manera:

<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

Se requieren algunos cambios en el manifiesto de Android. Primero, debemos asegurarnos de que DelegationService esté declarado, exportado y habilitado.

Los desarrolladores que compilaron su aplicación en función de la demo básica ya tendrán el servicio incluido, y el marcado debe estar dentro de la etiqueta de la aplicación y verse de la siguiente manera:

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

Por último, se deben agregar dos elementos nuevos a la etiqueta de actividad LauncherActivity: - Una etiqueta meta-data que haga referencia al JSON definido en strings.xml. - Un intent-filter que declara qué tipos de MIME puede controlar la aplicación para otras apps en el dispositivo.

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

Como se puede ver en el marcado anterior, se debe agregar un elemento data para cada mime-type declarado en el JSON share_target.

Conclusión

La integración de Share Target web permite que las AWP dentro de una actividad web de confianza se integren de forma más profunda con otras aplicaciones instaladas en un dispositivo Android.

Como se describió en los pasos anteriores, android-browser-helper simplifica el lenguaje de marcado adicional necesario para agregar compatibilidad con la API en una app para Android existente que usa Trusted Web Activity.

Consulta el artículo sobre los objetivos de uso compartido web para obtener más información sobre el uso de la API en una AWP y la API de Web Share para aprender a compartir contenido desde la app web progresiva.

Solución de problemas

Mi aplicación no aparece como una opción cuando intento compartir un archivo desde otra aplicación.

Cuando la aplicación no aparece como una opción, significa que el intent-filter es incorrecto. Vuelve a verificar el lenguaje de marcado intent-filter y asegúrate de que contenga las acciones, la categoría y el mime-types correctos que controla la aplicación.

Mi aplicación aparece como una opción, se inicia la AWP, pero no se comparten los datos.

Hay varias causas posibles. Esta es una lista de tareas que debes tener en cuenta:

  • Asegúrate de que la validación de los Vínculos de recursos digitales se realice correctamente.
  • Verifica que el JSON dentro de strings.xml sea correcto.