Actividades web de confianza de varios orígenes

Las Actividades web de confianza son una nueva forma de integrar el contenido de tu aplicación web, como tu AWP con tu app para Android, mediante un protocolo basado en pestañas personalizadas.

navegación de ff-origin

Una actividad web de confianza necesita que se abran los orígenes para validarse con Vínculos de recursos digitales, a fin de mostrar el contenido en pantalla completa.

Cuando un usuario navega fuera del origen validado, se muestra la IU de la pestaña personalizada. La barra de URL de la pestaña personalizada les indica a los usuarios que ahora están navegando en un dominio fuera de la aplicación y, al mismo tiempo, les proporciona un botón X que les permite volver rápidamente al origen validado.

Sin embargo, también es común que las apps web creen experiencias que abarquen varios orígenes. Un ejemplo sería una aplicación de compras con la experiencia principal en www.example.com, mientras que el flujo de confirmación de la compra se aloja en checkout.example.com.

En casos como ese, no es recomendable mostrar las pestañas personalizadas, no solo porque el usuario está en la misma aplicación, sino también porque la barra superior podría hacer que el usuario piense que abandonó la aplicación y abandonar la confirmación de la compra.

Trusted Web Activities permite a los desarrolladores validar varios orígenes, y el usuario permanecerá en la pantalla completa cuando navegue por esos orígenes. Al igual que con el dominio principal, el desarrollador debe poder controlar cada origen validado.

Configura la validación para varios orígenes

Al igual que en el origen principal, la validación se realiza mediante Vínculos de recursos digitales y cada dominio que se va a validar debe tener su propio archivo assetlinks.json.

En nuestro ejemplo con www.example.com y checkout.example.com, tendríamos lo siguiente:

  • https://www.example.com/.well-known/assetlinks.json
  • https://checkout.example.com/.well-known/assetlinks.json

Como cada dominio se conecta a la misma aplicación para Android, los archivos assetlinks.json se ven exactamente iguales.

Si suponemos que el nombre del paquete de la aplicación para Android es com.example.twa, ambos archivos assetlink.json contendrán algo similar a lo siguiente:

[{
  "relation": ["delegate_permission/common.handle_all_urls"],
  "target": {
  "namespace": "android_app",
  "package_name": "com.example",
   "sha256_cert_fingerprints": ["..."]}
}]

Agrega varios orígenes a la aplicación para Android

En la aplicación para Android, se debe actualizar la declaración asset_statements a fin de que contenga todos los orígenes que deben validarse:

<string name="asset_statements">
[{
    \"relation\": [\"delegate_permission/common.handle_all_urls\"],
    \"target\": {
        \"namespace\": \"web\",
        \"site\": \"https://www.example.com\"
    }
}],
[{
    \"relation\": [\"delegate_permission/common.handle_all_urls\"],
    \"target\": {
        \"namespace\": \"web\",
        \"site\": \"https://checkout.example.com\"
    }
}],
</string>

Agrega orígenes adicionales a LauncherActivity

Cómo usar la clase LauncherActivity predeterminada

El objeto LauncherActivity que forma parte de la biblioteca de compatibilidad android-browser-helper proporciona una forma de agregar varios orígenes que se validarán mediante la configuración del proyecto de Android.

Primero, agrega un elemento string-array al archivo res/values/strings.xml. Cada URL adicional que se validará estará dentro de un subelemento item:

...
<string-array name="additional_trusted_origins">
    <item>https://www.google.com</item>
</string-array>
...

A continuación, agrega una nueva etiqueta meta-data dentro del elemento de actividad existente que hace referencia a LauncherActivity, dentro de AndroidManifest.xml:

...
<activity android:name="com.google.androidbrowserhelper.trusted.LauncherActivity"
    android:label="@string/app_name">


    <meta-data
        android:name="android.support.customtabs.trusted.ADDITIONAL_TRUSTED_ORIGINS"
        android:resource="@array/additional_trusted_origins" />


    ...
</activity>
...

Cómo usar una LauncherActivity personalizada

Cuando se usa código personalizado para iniciar una actividad web de confianza, se pueden agregar orígenes adicionales llamando a setAdditionalTrustedOrigins cuando se compila el intent para iniciar la actividad web de confianza:

public void launcherWithMultipleOrigins(View view) {
  List<String> origins = Arrays.asList(
      "https://checkout.example.com/"
  );


  TrustedWebActivityIntentBuilder builder = new TrustedWebActivityIntentBuilder(LAUNCH_URI)
      .setAdditionalTrustedOrigins(origins);


  new TwaLauncher(this).launch(builder, null, null);
}

Conclusión

Con esos pasos, la actividad web de confianza ahora está lista para admitir varios orígenes. android-browser-helper tiene una aplicación de ejemplo para Trusted Web Activities de varios orígenes. Asegúrate de revisarlo.

Solución de problemas

La configuración de Vínculos de recursos digitales tiene algunos componentes dinámicos. Si la aplicación aún muestra la barra de pestañas personalizadas en la parte superior, es probable que haya un problema con la configuración.

La Guía de inicio rápido de Trusted Web Activity tiene una excelente sección de solución de problemas sobre cómo depurar problemas de Digital Asset Link.

También está disponible la increíble Peter's Asset Link Tool, que ayuda a depurar Vínculos de recursos digitales en aplicaciones instaladas en el dispositivo.