Cómo Añadir Deep Linking en Notificaciones Push de Aplicaciones Usando PushEngage

Envía a los usuarios de tu app directamente a una pantalla específica dentro de tu app de Android o iOS cuando toquen una notificación push. En lugar de simplemente abrir la pantalla de inicio de la app, los deep links llevan a los usuarios exactamente a donde quieres, ya sea una página de producto, una pantalla de estado de pedido, una oferta especial o cualquier otro destino dentro de la app.

Esta guía te muestra cómo configurar deep links usando el Panel de PushEngage para Android e iOS.

Antes de empezar

Asegúrate de que PushEngage esté instalado y funcionando en tu app móvil (Android, iOS, Flutter o React Native). Si aún no lo has hecho, sigue la guía de configuración para tu plataforma:

Guía de configuración de Flutter

Guía de configuración de iOS

Guía de configuración de React Native

Ten listo tu URL de deep link. Esta es la URL o el esquema URI que tu app utiliza para abrir una pantalla específica (por ejemplo: myapp://products/123 o https://tuapp.com/ofertas).

¿Qué es un Deep Link?

Un deep link es una URL especial que apunta a una página o pantalla específica dentro de tu app móvil. Cuando un usuario toca una notificación push con un deep link, se le dirige directamente a esa pantalla en lugar de solo a la página de inicio de la app.

Ejemplos:

• myapp://orders/456 : abre el pedido n.º 456 en la app
• https://tienda.com/oferta : abre una página de oferta en la app
• app://www.tuapp.com/trigger : abre una pantalla de flujo de trabajo específica

Añadir Deep Links a través del Panel de PushEngage

Para notificaciones push de apps Android

1. Inicia sesión en tu Panel de PushEngage.
2. Ve a App Push » Crear Campaña.
3. Selecciona Android como plataforma.
4. Rellena el Título y el Mensaje de tu notificación.
5. Desplázate hacia abajo hasta el campo Deep Link.
6. Introduce tu URL de deep link (por ejemplo: myapp://products/123).
7. Haz clic en Enviar / Programar para enviar la notificación.

Para notificaciones push de apps iOS

1. Inicia sesión en tu Panel de PushEngage.
2. Ve a App Push » Crear Campaña.
3. Selecciona iOS como plataforma.
4. Rellena el Título y el Mensaje de tu notificación.
5. Desplázate hacia abajo hasta el campo Deep Link.
6. Introduce tu URL de deep link (por ejemplo: myapp://offers/summer-sale).
7. Haz clic en Enviar / Programar para enviar la notificación.

Si no se establece ningún deep link en iOS, al tocar la notificación simplemente se abrirá la app. Ten en cuenta que los límites de caracteres para los deep links pueden ser de hasta 1600 caracteres en Android e iOS.

Manejo de Deep Links en el código de tu app

Una vez enviada la notificación con un deep link, tu app debe escucharlo y dirigir al usuario a la pantalla correcta. Aquí te explicamos cómo hacerlo en cada plataforma:

Flutter

PushEngage.deepLinkStream.listen((data) {
  String? deepLink = data?['deepLink'];
  if (deepLink == null) return;
  Uri uri = Uri.parse(deepLink);
  if (uri.path == '/offers') {
    Navigator.pushNamed(context, '/offers');
  }
});

Además, asegúrate de que PushEngageAutoHandleDeeplinkURL esté configurado como NO en el Info.plist de tu iOS si deseas que tu app gestione el enrutamiento por sí misma.

React Native

PushEngage.onValueChanged((data) => {
  const { deepLink } = data;
  // Navigate based on the deep link value
  if (deepLink === '/orders') {
    navigation.navigate('Orders');
  }
});

iOS (Swift)

PushEngage.setNotificationOpenHandler { result in
  let deepLink = result.notificationAction.actionID
  // Route the user to the correct screen
}

Consejo: Para iOS, si estableces PushEngageAutoHandleDeeplinkURL en YES en tu Info.plist, el SDK abrirá automáticamente cualquier URL de enlace profundo HTTP o HTTPS en el navegador. Establécelo en NO si deseas gestionar el enrutamiento dentro de tu aplicación.

Android (Filtro de Intenciones)

Para Android, añade un filtro de intenciones en tu AndroidManifest.xml para que la aplicación pueda recibir URLs de enlaces profundos:

<intent-filter>
    <action android:name="android.intent.action.VIEW" />
    <category android:name="android.intent.category.DEFAULT" />
    <data android:scheme="myapp" android:host="www.yourapp.com" />
</intent-filter>

Ahora has configurado el deep linking para las notificaciones push de tu aplicación usando PushEngage. Tus usuarios serán dirigidos directamente a la pantalla correcta cuando toquen una notificación, ya sea que la envíes desde el panel o a través de la API.

Si encuentras algún problema, por favor contáctanos haciendo clic aquí. Nuestro equipo de soporte estará encantado de ayudarte.