Actividades web de confianza de varios orígenes

Las Actividades web de confianza son una nueva forma de integrar el contenido de tu app 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 los orígenes que se abren se validen con Vinculaciones de recursos digitales para mostrar el contenido en pantalla completa.

Cuando un usuario sale 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, además, les proporciona un botón X que les permite volver rápidamente al origen validado.

Sin embargo, también es común que las aplicaciones web creen experiencias que abarcan 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 conveniente 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 salió de la aplicación y abandone la confirmación de la compra.

Las actividades web de confianza permiten a los desarrolladores validar varios orígenes, y el usuario permanecerá en pantalla completa cuando navegue por esos orígenes. Al igual que con el dominio principal, el desarrollador debe poder controlar cada origen validado.

Cómo configurar la validación para varios orígenes

Al igual que en el origen principal, la validación se logra a través de los Vínculos de recursos digitales, y cada dominio que se valide 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

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

Si suponemos que el nombre del paquete de la aplicación para Android es com.example.twa, ambos archivos assetlink.json contendrían 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 para que contenga todos los orígenes que se deben validar:

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

El objeto LauncherActivity que forma parte de la biblioteca de compatibilidad android-browser-helper proporciona una forma de agregar varios orígenes para que se validen configurando el 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>
...

Usa una LauncherActivity personalizada

Cuando se usa código personalizado para iniciar una Trusted Web Activity, se pueden agregar orígenes adicionales llamando a setAdditionalTrustedOrigins cuando se compila el intent para iniciar la Trusted Web Activity:

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 confiable ya está lista para admitir varios orígenes. Android-browser-helper tiene una aplicación de ejemplo para actividades web confiables de varios orígenes. Asegúrate de revisarlo.

Solución de problemas

La configuración de los Vínculos de recursos digitales tiene algunos elementos móviles. Si la aplicación sigue mostrando 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 Activities tiene una excelente sección de solución de problemas sobre cómo depurar problemas de Digital Asset Link.

También está la increíble herramienta de vinculación de recursos de Peter, que ayuda a depurar los vínculos de recursos digitales en las aplicaciones instaladas en el dispositivo.