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

# Integración de WebView del Widget

> Wrapper web embebible para inyectar el widget de chat de Lovi

## Introducción

El endpoint Widget WebView es un wrapper HTML interactivo que te permite embeber el widget de chat de Lovi de forma segura dentro de páginas web o aplicaciones móviles. En lugar de devolver una respuesta JSON estándar, este endpoint sirve un documento HTML completo que contiene un `iframe` apuntando a la interfaz de chat.

Este wrapper actúa como un puente seguro, obteniendo los metadatos de integración necesarios (como el mensaje de bienvenida del agente y la configuración de idioma) en el lado del servidor e inyectándolos de forma segura en la vista web usando comunicación `postMessage` estándar.

***

## 🌐 Obtener WebView del Widget

> **Método**: GET **Formato**: HTML

### Endpoint

```
GET https://cloud.lovi.ai/functions/v1/widgetWebView
```

*Formato de ruta alternativo:* `GET https://cloud.lovi.ai/functions/v1/widgetWebView/{customer_id}/{widget_id}`

### Parámetros de Consulta

Si no estás usando la estructura de ruta mencionada arriba, debes pasar los parámetros requeridos en la cadena de consulta.

| Parámetro     | Requerido | Descripción                                                                                                    |
| ------------- | --------- | -------------------------------------------------------------------------------------------------------------- |
| `customer_id` | Sí        | La Access Key de tu empresa utilizada para validar permisos.                                                   |
| `widget_id`   | Sí        | El `uuid` específico de la cuenta del canal/widget que deseas cargar.                                          |
| `lang`        | No        | Código de idioma de destino (ej. `es`, `en`, `pt`). Si se proporciona, los mensajes de bienvenida se traducen. |
| `showClose`   | No        | Booleano como string (`true` o `false`). Por defecto `true`. Determina si el widget puede cerrarse.            |

### Cómo Funciona

1. **Autenticación**: El servidor valida el `customer_id` (Access Key) y verifica la propiedad del `widget_id`.
2. **Obtención de Metadatos**: Recupera la configuración del widget y opcionalmente consulta el backend de traducción de Lovi para traducir el mensaje de bienvenida del agente al `lang` solicitado.
3. **Entrega de HTML**: El servidor devuelve una página HTML que contiene un `<iframe src="https://widget.lovi.ai/?cw_id=...">`.
4. **Puente PostMessage**: El HTML cargado contiene JavaScript que escucha los eventos `get_widget` y `get_customer` disparados por el iframe. Responde de forma segura con la configuración del widget (`widgetData`) y maneja el almacenamiento local (como generar un ID de usuario único).

### Errores Comunes

Si el widget falla al cargar, podrías recibir uno de los siguientes códigos de estado HTTP en lugar del payload HTML:

* **400 Bad Request**: Faltan `customer_id` o `widget_id`, o el `widget_id` no es un UUID válido.
* **403 Forbidden**: `customer_id` inválido (falló la validación de Access Key).
* **404 Not Found**: No se pudo encontrar la empresa o el widget especificado.
* **500 Internal Server Error**: Ocurrió un error inesperado al generar el wrapper.

> 🧭 **Importante**: Si el widget aparece atascado en una pantalla de "Loading Widget...", revisa la consola del navegador. Asegúrate de que tu entorno permita iframes de origen cruzado y no bloquee la comunicación `postMessage` entre el WebView y `widget.lovi.ai`.

Este endpoint embebe el **chat de texto**. Para una llamada hablada en el navegador, ver el [widget de voz](/es/user-guide/Setting/ug_voicewidget_es).