Deep Linking
La app de Vivla soporta deep links para permitir la navegacion directa a pantallas especificas desde URLs externas, notificaciones push y otras aplicaciones.Esquemas de URL por entorno
Cada entorno tiene su propio esquema de URL para evitar conflictos entre versiones instaladas simultaneamente:Universal Links / App Links
- iOS — Associated Domains
- Android — Intent Filters
La app configura Associated Domains para manejar Universal Links:
applinks:vivla.appapplinks:*.vivla.app
Servicio de linking
El archivosrc/shared/services/linkingService.ts es el punto central para el manejo de URLs entrantes, tanto desde deep links como desde notificaciones push.
Rutas soportadas
Ruta generica de encuestas
La ruta/survey permite abrir cualquier encuesta como modal sin crear rutas especificas. Soporta dos formatos de deep link:
scopeIddequeryParams.scopeId ?? queryParams.propertyId ?? queryParams.bookingIdscopeTypedequeryParams.scopeType ?? (queryParams.bookingId ? 'booking' : 'property')entryPointdefault:'deep_link'
Parametro entryPoint
Las rutas de encuesta aceptan un parametro opcionalentryPoint que indica como se accedio a la encuesta. Se usa para analytics:
PendingDeepLinkStore
El storesrc/shared/stores/pendingDeepLinkStore.ts se encarga de preservar deep links cuando el usuario no esta autenticado.
Metodos
Flujo de deep link con autenticacion
Este mecanismo asegura que los deep links no se pierdan cuando la app requiere autenticacion. El
usuario es redirigido a login y, una vez autenticado, se navega automaticamente a la ruta
original.
Push notification deep links
Las notificaciones push pueden incluir un campodeep_link en su payload. Cuando el usuario interactua con la notificacion:
- El
linkingServicerecibe la notificacion - Extrae el campo
deep_linkdel payload - Procesa la URL y navega a la ruta correspondiente
- Si el usuario no esta autenticado, el deep link se almacena en
PendingDeepLinkStore
Plugin withNavigationSchemes
El plugin personalizadowithNavigationSchemes agrega esquemas de navegacion externa en iOS mediante LSApplicationQueriesSchemes. Esto permite que la app pueda abrir otras aplicaciones de mapas:
Google Maps
Esquema
comgooglemaps://Waze
Esquema
waze://Apple Maps
Esquema nativo de iOS
Configuracion en app.config.ts
La configuracion de deep linking se define enapp.config.ts:
Con
typedRoutes: true habilitado, el compilador de TypeScript valida que las rutas de navegacion
sean correctas en tiempo de compilacion, evitando errores por rutas inexistentes.Abrir un enlace desde dentro de la app
Para abrir cualquier URL desde el codigo hay un unico punto de entrada:linkingService.openURL(url). Nunca Linking.openURL directo.
openURL decide antes de delegar en el sistema operativo:
- Es un enlace nuestro (esquema propio, o
vivla.app/dev.vivla.app/staging.vivla.app) → lo resuelve a una ruta y navega con el router. Si es nuestro pero no casa con ninguna ruta, muestra la pantalla de error in-app. - Es externo → lo abre el sistema operativo, como siempre.
La forma del enlace por esquema propio
Linking.parse resuelve con new URL(), asi que con dos barras el primer
segmento de la ruta se lee como hostname:
parseURL recompone la ruta cuando detecta ese caso, asi que ambas formas
funcionan dentro de la app. Pero cualquier enlace por esquema que se genere
fuera de la app —por ejemplo el puente de vivla-app-site, que reabre la
app cuando un enlace cae en el navegador— debe usar tres barras, porque las
versiones ya instaladas no llevan esa correccion.