> ## Documentation Index
> Fetch the complete documentation index at: https://docs.jelou.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Biometría con foto - WebView

> Verifica identidad en WhatsApp mediante WebView con foto, documento y comparación facial.

Este agente te permite ejecutar una verificación de identidad completa dentro de **WhatsApp mediante WebView**, combinando prueba de vida por foto, validación de documento y comparación facial. La experiencia se abre en un enlace único desde el chat y utiliza captura guiada con feedback inmediato.

<Info>
  En **prueba de vida** y **document check**, WebView usa captura guiada con retroalimentación en pantalla; el usuario permanece en el chat.
</Info>

## Requisitos previos

### ✅ Checklist para iniciar sin bloqueos

* Debes contar con **cuenta verificada en WhatsApp**.
* Debes contar con la URL púbica de Términos y Condiciones para configurarlo en el agente. **Esto es obligatorio**.
* El usuario debe poder **tomar foto** desde el chat (los permisos de cámara deben de estar habilitados en el dispositivo).
* También se piden **permisos de ubicación** para la obtención de datos que permiten una mejor auditoría y trazabilidad del proceso biométrico.

## ¿Cómo funciona?

En menos de 1 minuto, el usuario completa los siguientes pasos:

<Steps>
  <Step title="Accede desde un link único">
    El usuario recibe un link único por WhatsApp para iniciar la sesión. El link contiene un identificador de sesión no reutilizable y la información del flujo asociado.
  </Step>

  <Step title="Toma una foto">
    El usuario captura una foto en tiempo real desde la cámara, con guías visuales que aseguran una toma correcta.
  </Step>

  <Step title="Captura su documento de identidad">
    Se solicitan imágenes **frontal y reverso** del documento, con asistencia visual para validar vigencia y autenticidad.
  </Step>

  <Step title="Comparación facial automática">
    El sistema compara la foto contra el rostro extraído del documento y calcula el nivel de similitud. En esta versión aún no se incluye facematch contra entidades gubernamentales.
  </Step>
</Steps>

## ¿Cómo conectar la integración?

<Frame caption="Cómo conectar la integración de Biometría">
  <iframe width="100%" height="400" src="https://www.youtube.com/embed/b_hlkjk0pQs" title="Conectar Biometría" frameBorder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowFullScreen />
</Frame>

<Steps>
  <Step title="Ingresa a la plataforma">
    Utiliza el Agente para crear un flujo de biometría, o selecciona el template **Validación de identidad**.
    Si quieres iniciar un flujo desde cero, haz clic en Brain Studio en el sidebar.
  </Step>

  <Step title="Selecciona Biometría">
    En la barra de herramientas verás la opción **Biometría**. Haz clic en **Conectar**.
  </Step>

  <Step title="Conecta la integración">
    Al conectarla verás el nodo **Biometría**, en el cual podrás configurar reintentos, experiencia y validaciones adicionales.
  </Step>

  <Step title="Configurar outputs">
    Este agente cuenta con **1 output de éxito y 3 de error**. Cada uno puedes dirigirlo a:

    * Input de texto con mensaje personalizado.
    * Connect, solo si cuentas con este módulo.
  </Step>

  <Step title="Probar">
    Con la configuración que acabas de realizar, puedes proceder a realizar las pruebas con el botón Probar.
  </Step>
</Steps>

## Configuración

<Tabs>
  <Tab title="Outputs">
    ### Éxito

    <AccordionGroup>
      <Accordion title="Biometría Aprobada" icon="circle-check">
        Confirma que la verificación biométrica fue exitosa.

        **Variable:** `approved`

        **Descripción:** Biometría Aprobada

        **Estructura de respuesta (JSON):**

        ```json theme={null}
        {
          "document_response": {
            "document_check": {
              "result": "",
              "verified_fields": { "...": "Datos principales del documento" },
              "secondary_fields": { "...": "Datos secundarios del documento" },
              "details": { "...": "Detalles del tipo de documento" },
              "status_fields": { "...": "Estado de validaciones" },
              "image_quality_details": { "...": "Detalles de la calidad de la imagen" },
              "images_extracted": { "...": "Imágenes extraídas del documento" },
              "gov_entity_fields": { "document_number": "Número del documento de identidad" }
            },
            "document_image_front_url": "URL de la imagen frontal del documento",
            "document_image_back_url": "URL de la imagen posterior del documento",
            "document_face_image_url": "URL del rostro extraído del documento"
          },
          "liveness_response": {
            "result": "true",
            "url_selfie_image": "URL de la foto obtenida para validar vivacidad"
          },
          "facematch_response": {
            "facematch_result": "approved",
            "facematch_confidence": "Porcentaje de coincidencia (0-100)"
          },
          "reporte_de_biometria": {
            "report": "URL del reporte de biometría (web)",
            "report_pdf": "URL del reporte de biometría (PDF)"
          },
          "device_info": {
            "userAgent": "Cadena del agente de usuario",
            "browser": "Navegador",
            "operatingSystem": "Sistema operativo",
            "platform": "Plataforma del dispositivo",
            "language": "Idioma",
            "timezone": "Zona horaria",
            "screenResolution": "Resolución de pantalla",
            "colorDepth": "Profundidad de color en bits",
            "timestamp": "Marca de tiempo del dispositivo",
            "ipAddress": "Dirección IP",
            "location": {
              "latitude": "Latitud (si el usuario otorga permiso)",
              "longitude": "Longitud (si el usuario otorga permiso)"
            },
            "deviceId": "Identificador único del dispositivo",
            "deviceName": "Nombre del dispositivo"
          },
          "gov_entity_data": {
            "...": "Datos de la entidad gubernamental del país (varía según el país)"
          }
        }
        ```

        **Campos importantes:**

        * `document_response`: Información del documento de identidad
        * `liveness_response`: Foto enviada para validar la prueba de vida
        * `facematch_response`: Resultado de la comparación facial
        * `reporte_de_biometria`: URLs del reporte en formato web y PDF
        * `device_info`: Datos de dispositivo y ubicación (auditoría y trazabilidad)
        * `gov_entity_data`: Datos de la entidad gubernamental (si aplica)

        **Definición de variables del JSON response:**

        * **document\_response:** `document_check` (result, verified\_fields, secondary\_fields, details, status\_fields, image\_quality\_details, images\_extracted, gov\_entity\_fields), `document_image_front_url`, `document_image_back_url`, `document_face_image_url`
        * **liveness\_response:** `result`, `url_selfie_image`
        * **facematch\_response:** `facematch_result` (approved/decline), `facematch_confidence`
        * **reporte\_de\_biometria:** `report`, `report_pdf`
        * **device\_info:** `userAgent`, `browser`, `operatingSystem`, `platform`, `language`, `timezone`, `screenResolution`, `colorDepth`, `timestamp`, `ipAddress`, `location` (latitude, longitude; solo si hay permiso de ubicación), `deviceId`, `deviceName`
        * **gov\_entity\_data:** datos de la entidad gubernamental del país (campos varían según el país)
      </Accordion>
    </AccordionGroup>

    ### Errores

    <AccordionGroup>
      <Accordion title="Proceso abandonado" icon="door-open">
        El usuario abandonó el proceso antes de completarlo.

        **Variable:** `incomplete`

        **Descripción:** Proceso abandonado
      </Accordion>

      <Accordion title="Biometría Rechazada" icon="ban">
        La verificación biométrica falló o fue rechazada.

        **Variable:** `reject`

        **Descripción:** Biometría Rechazada
      </Accordion>

      <Accordion title="Error en el proceso" icon="triangle-exclamation">
        Error durante la ejecución del proceso de biometría.

        **Variable:** `error`

        **Descripción:** Error en el proceso
      </Accordion>
    </AccordionGroup>
  </Tab>
</Tabs>

## ¿Cómo personalizar la experiencia?

Al hacer clic en el nodo **Biometría** en el canvas, se abre un panel lateral con tres pestañas de configuración.

<Tabs>
  <Tab title="General">
    Configura la cantidad de reintentos permitidos por etapa del proceso biométrico.

    * **Máximo intentos en prueba de vida** — define cuántas veces el usuario puede reintentar la captura facial antes de que el proceso falle.
    * **Máximo intentos en verificación de documento** — define cuántas veces el usuario puede reintentar la captura del documento.

    <Info>
      Esta configuración es **global para tu empresa**: si la modificas, se actualizará en todos los flujos que usen biometría WebView.
    </Info>
  </Tab>

  <Tab title="Experiencia">
    Personaliza la apariencia de la WebView que verá el usuario final. Usa el botón **Vista previa** para visualizar el mockup de cada pantalla antes de publicar.

    | Opción                       | Descripción                                                                                                      |
    | ---------------------------- | ---------------------------------------------------------------------------------------------------------------- |
    | **Colores**                  | Usa los colores de Jelou (por defecto) o define colores propios para botones, steppers, spinners, fondo y texto. |
    | **Idioma de la experiencia** | Elige entre **Español** e **Inglés** como idioma por defecto de la UI.                                           |
    | **Toggle de idioma**         | Actívalo para que el usuario pueda cambiar el idioma directamente desde la pantalla inicial.                     |

    <Note>
      Esta pestaña está disponible únicamente en la modalidad **WebView**.
    </Note>

    <Info>
      La configuración de experiencia es **global para tu empresa** y se aplica a todos los flujos que usen biometría WebView.
    </Info>
  </Tab>

  <Tab title="Validaciones">
    Define los niveles mínimos de validación que debe superar el usuario para que el proceso se considere exitoso.

    | Parámetro                      | Opciones                                     | Descripción                                                                                        |
    | ------------------------------ | -------------------------------------------- | -------------------------------------------------------------------------------------------------- |
    | **Verificación documental**    | Medio / Avanzado                             | **Medio**: validación estándar del documento. **Avanzado**: detección de fraude avanzada.          |
    | **Comparación facial**         | Bajo (65%) / Estándar (80%) / Estricto (90%) | Porcentaje mínimo de similitud aceptado entre la selfie y la foto del documento.                   |
    | **URL Términos y condiciones** | URL pública                                  | El usuario debe aceptar los términos en la pantalla inicial. El enlace debe ser de acceso público. |

    <Info>
      La configuración de validaciones es **global para tu empresa** y se aplica a todos los flujos que usen biometría WebView.
    </Info>
  </Tab>
</Tabs>

## Reporte

Por defecto se genera un reporte con los siguientes campos:

| **Campo**                | **Descripción**                                      |
| ------------------------ | ---------------------------------------------------- |
| Código de Biometría      | Identificador único del proceso                      |
| Fecha y Hora             | Timestamp de la verificación                         |
| Resultado Biometría      | Aprobado / Desaprobado                               |
| Número de Identificación | Documento del usuario                                |
| Tipo de Identificación   | Tipo de documento                                    |
| Nombres                  | Nombres del usuario                                  |
| Apellidos                | Apellidos del usuario                                |
| Celular                  | Teléfono                                             |
| Foto                     | URL de la selfie                                     |
| Resultado Prueba de Vida | Aprobado / Desaprobado                               |
| Foto Documento Delantera | URL                                                  |
| Foto Documento Posterior | URL                                                  |
| Resultado Document Check | Aprobado / Desaprobado                               |
| Foto Rostro en Documento | URL                                                  |
| Resultado Facematch      | Porcentaje de coincidencia                           |
| Reporte de Biometría     | URL del reporte                                      |
| Descripción de Fallo     | Detalle del error                                    |
| Observaciones            | Notas adicionales                                    |
| User Agent               | Cadena del agente de usuario del navegador           |
| Browser                  | Navegador (ej. Chrome)                               |
| Operating System         | Sistema operativo del dispositivo                    |
| Platform                 | Plataforma (ej. Linux aarch64)                       |
| Language                 | Idioma configurado (ej. es-US)                       |
| Timezone                 | Zona horaria (ej. America/Guayaquil)                 |
| Screen Resolution        | Resolución de pantalla (ej. 376x835)                 |
| Color Depth              | Profundidad de color en bits                         |
| Timestamp (device)       | Marca de tiempo del dispositivo                      |
| IP Address               | Dirección IP desde la que se realizó la verificación |
| Latitude                 | Latitud de la ubicación                              |
| Longitude                | Longitud de la ubicación                             |
| Device ID                | Identificador único del dispositivo                  |
| Device Name              | Nombre del dispositivo (ej. Linux - Chrome)          |

<Info>
  El reporte biométrico se encuentra disponible para descargarlo en formato **PDF** y utilizarlo para auditoría o respaldo interno.
</Info>

<Warning>
  **Ubicación en el reporte:** Los datos de ubicación (latitud, longitud) dependen del permiso otorgado por el usuario. Si el usuario deniega el acceso a la ubicación o el dispositivo tiene desactivado el uso de ubicación, estos campos no estarán disponibles en el reporte.
</Warning>

## Preguntas frecuentes

<AccordionGroup>
  <Accordion title="¿Qué documentos se necesitan durante el proceso biométrico?">
    Se requieren fotos del **documento de identidad por ambos lados**: frontal y reverso.
  </Accordion>

  <Accordion title="¿En qué se diferencia la biometría WebView de Flows o conversacional?">
    WebView abre un enlace dedicado con captura guiada; el reporte incluye **datos de dispositivo** (navegador, SO, resolución, zona horaria, IP, device ID) y **ubicación** si el usuario concede permiso. Puedes ajustar **colores** (fondo, textos, botones, stepper), **idioma de la UI** y opciones de seguridad descritas en la guía de personalización; los **widgets de captura** no son editables. Conversacional usa **video** en el chat; Flows usa **foto** dentro de WhatsApp Flows con reglas propias de galería y UI nativa.
  </Accordion>

  <Accordion title="¿Puedo personalizar colores e idioma de la UI?">
    Sí: colores de fondo, de textos, de botones y del stepper; idioma de la UI (Español/Inglés) y, si aplica, selector de idioma para el usuario. El color del stepper también aplica a los widgets. Los widgets de captura facial y de documento no son modificables.
  </Accordion>

  <Accordion title="¿Cuántos outputs tiene este agente?">
    Tiene **1 output de éxito** (Biometría Aprobada) y **3 outputs de error** (Proceso abandonado, Biometría Rechazada, Error en el proceso). Cada uno puedes dirigirlo a mensaje personalizado o Connect.
  </Accordion>
</AccordionGroup>
