# Contenido conectado

El contenido conectado es una característica en las [plantillas Liquid](/es/product/personalization/liquid-templates/) que le permite recuperar y usar dinámicamente datos de una fuente externa, como un servicio web, directamente dentro de sus mensajes de correo electrónico o notificaciones push. Esta característica permite la personalización en tiempo real al obtener datos JSON de una URL especificada y guardarlos en una variable que se puede utilizar en su contenido.

## Casos de uso clave

- **Recomendaciones de productos**: Muestre listas de productos personalizadas adaptadas a cada usuario.

- **Códigos promocionales**: Inserte códigos promocionales únicos generados por un servicio de backend.

## Prerrequisitos

* Para usar el Contenido Conectado, debe tener su propio servicio de backend que genere y proporcione los datos requeridos (por ejemplo, códigos promocionales, recomendaciones de productos) basados en **User ID, HWID o tags personalizados**. Pushwoosh luego obtiene estos datos antes de enviar un mensaje.

## Guía de implementación paso a paso

<Aside type="caution" icon="setting" title="Se necesita la ayuda de un desarrollador">
Necesitará la ayuda de su equipo de desarrolladores para usar el contenido conectado. Comparta esta guía con ellos para comenzar.
</Aside>

### Paso 1. Configure el servicio de backend

El servicio de backend debe:

* Aceptar una solicitud que contenga parámetros específicos del usuario (por ejemplo, `userId`). El Contenido Conectado admite `UserID`, `HWID` o cualquier tag personalizado que haya configurado en su proyecto.
* Devolver una respuesta JSON con los datos requeridos. Este contenido se puede insertar dinámicamente en los mensajes.

<Aside type="note" title="Cómo funciona"> 

El servicio de backend actúa como un proveedor de datos, respondiendo a las solicitudes HTTP con información específica del usuario.

1. Pushwoosh envía una solicitud a su backend, pasando identificadores específicos del usuario como parámetros de consulta.
2. Su backend procesa la solicitud y recupera los datos solicitados.
3. Su backend devuelve una respuesta JSON.
4. Antes de enviar un mensaje, Pushwoosh obtiene la respuesta JSON del servicio de backend y utiliza los valores devueltos (por ejemplo, el `code`) en el contenido del mensaje de forma dinámica.

**Respuesta de ejemplo**

```
{ "code": "SPECIALOFFERFORUSER12345" }
```
</Aside>



### Paso 2. Cree un preset con Contenido conectado en Pushwoosh
 
1. En el [editor de contenido Push](/es/product/content/push-presets/) o [editor de contenido de correo electrónico](/es/product/content/email-content/drag-and-drop-email-editor/), inserte la sintaxis de Contenido Conectado en el campo del mensaje.

**Ejemplo** 

```
{% connected_content http://your-backend-url.com?userId={{ ${userid} }} :save result %}  
```
**Desglose de la sintaxis**
|  |  |
| ----- | ----- |
| `connected_content` | Obtiene datos JSON de la URL de backend especificada. |
|    `http://your-backend-url.com` | El punto final del backend que devuelve los datos requeridos en formato JSON. |
| `userId={{ ${userid} }}` | Un parámetro de consulta dinámico que pasa el ID de usuario al backend. Dentro de `connected_content`, envuelva una variable en `${}`. En el texto del mensaje, escriba `{{userid}}` sin él. |
| `:save result` | Almacena la respuesta JSON obtenida en la variable de resultado para su uso en plantillas Liquid |

![Inserte la sintaxis de Contenido Conectado](/connectedcontent.webp)

**Autenticación (opcional)**

Si su servicio de backend requiere autenticación, puede incluir una clave de API o un token en la solicitud de Contenido Conectado para garantizar un acceso seguro.

```
{% connected_content http://your-backend-url.com?userId={{ ${userid} }}&auth=YOUR_API_KEY :save result %}  
```

También puede enviar datos de autenticación (o cualquier otro) como encabezados HTTP utilizando el parámetro opcional `:headers`, un objeto JSON de nombres y valores de encabezado.

```
{% connected_content http://your-backend-url.com?userId={{ ${userid} }} :headers {"Authorization": "Bearer YOUR_TOKEN", "X-Api-Key": "YOUR_API_KEY"} :save result %}  
```
|  |  |
| ----- | ----- |
| `:headers {...}` | Un objeto JSON de encabezados HTTP enviados con la solicitud, por ejemplo, `Authorization: Bearer <token>`. |

<Aside type="caution" title="Solo valores estáticos">
Las variables de personalización `${}` solo funcionan dentro de la URL. Los valores dentro de `:headers` son estáticos y no se interpolan.
</Aside>

<Aside type="danger" title="Mantenga las credenciales fuera de la URL">
Prefiera `:headers` en lugar de un parámetro de consulta de URL (por ejemplo, `&auth=YOUR_API_KEY`) para claves de API y tokens: si la obtención falla, la URL de la solicitud se escribe en los registros, exponiendo una clave colocada allí. Los valores dentro de `:headers` nunca se registran.

El contenido conectado también requiere que las plantillas de contenido Liquid estén habilitadas para su cuenta. Si no lo están, todo el tag `connected_content`, incluida cualquier clave dentro de él, se envía a cada destinatario como texto literal en lugar de ser renderizado. Póngase en contacto con el [Soporte de Pushwoosh](https://help.pushwoosh.com/hc/en-us/requests/new) si no está seguro de si su cuenta tiene esto habilitado.
</Aside>

**Uso de tags en Contenido conectado**

Para incluir el valor de un tag, agréguelo a la URL como parámetro de consulta con la misma forma `{{ ${tag_name} }}`. Si se escribe como `{{ tag_name }}` dentro del tag `connected_content`, el valor se envía vacío.

```
{% connected_content http://your-backend-url.com?userId={{ ${userid} }}&lang={{ ${Language} }} :save result %} 
```

2. A continuación, agregue el texto del mensaje incorporando los **datos recuperados**, así:

```

Hola, {{userid}}, obtenga su código promocional personal - {{result.code}} 
```

![Agregue el texto del mensaje con los **datos recuperados**](/connectedcontent-1.webp)

3. Después de finalizar el contenido del mensaje y configurar los ajustes del preset, guárdelo para reutilizarlo en campañas.

<video src="/connectedcontent-2.webm" title="Enviar un mensaje con contenido conectado" autoplay loop muted playsinline />

### Paso 3. Envíe un mensaje usando el preset configurado 

Envíe un mensaje con este preset utilizando el [formulario de push único](/es/product/messaging-channels/push-notifications/send-push-notifications/one-time-push/#how-to-send-a-push-notification-using-the-one-time-push-form) o [formulario de correo electrónico](/es/product/messaging-channels/emails/sending-emails/send-one-time-emails/) o [customer journey](/es/product/customer-journey/pushwoosh-journey-overview/). 

<Aside type="caution" title="Importante">
Si el servicio devuelve un estado que no sea HTTP 200 OK, el correo electrónico o la notificación push no se enviarán. Esto garantiza que su comunicación solo se envíe si los datos necesarios se recuperan con éxito.
</Aside>