---
url: "/es/emailify/export/webhook.md"
description: "Envía el HTML generado o el código fuente MJML desde Emailify a tu propio endpoint en la carga JSON de un webhook."
---

# Subir tus emails a una URL de webhook personalizada

> Envía el HTML generado o el código fuente MJML desde Emailify a tu propio endpoint en la carga JSON de un webhook.

[Video](/assets/videos/emailify/export/webook-export.mp4)

En el panel de exportación de Emailify, selecciona la opción **Custom Webhook URL** en la lista desplegable y pega la URL de tu propio endpoint personalizado, preparado para gestionar [la carga JSON](#the-json-payload-object-sent-via-post-to-your-url) que envía Emailify.

Cuando lo tengas todo listo, haz clic en el botón **POST** para exportar los emails que hayas seleccionado en Figma y enviarlos como una petición `POST` a tu endpoint de webhook personalizado.

> **Tip:** Tus imágenes se suben automáticamente a nuestra CDN y se incluyen como atributo `src` de las etiquetas `` en la propiedad de texto `html` que se envía en la carga.

> **Note:** Tu código se exporta como HTML de forma predeterminada. Si tu endpoint necesita otro formato, puedes seleccionar **MJML Source Code** o un formato específico de una plataforma en las opciones de exportación del webhook.

## El objeto de carga JSON que se envía por POST a tu URL {#the-json-payload-object-sent-via-post-to-your-url}

La carga JSON que envía Emailify contiene las claves y los valores del objeto que aparecen abajo. Asegúrate de que tu URL de webhook personalizada esté preparada para gestionar esta carga, que puedes usar como quieras.

```
{
  "name": "Name of the Figma frame",
  "subject": "Subject line set in Emailify settings",
  "preheader": "Preheader text set in Emailify settings",
  "html": "Exported email HTML"
}
```

### Enviar el código fuente MJML a un flujo de CI {#send-mjml-source-to-a-ci-workflow}

Elige **MJML Source Code** en el selector de formato del webhook cuando tu endpoint necesite el código fuente MJML generado para validarlo o compilarlo. Selecciona la misma versión de MJML que usa tu flujo de CI. Emailify añade los campos `mjml` y `mjmlVersion` y mantiene el campo `html` compilado:

```json
{
  "name": "Name of the Figma frame",
  "subject": "Subject line set in Emailify settings",
  "preheader": "Preheader text set in Emailify settings",
  "html": "Compiled email HTML",
  "mjml": "Generated source MJML",
  "mjmlVersion": "mjml4"
}
```

El valor de `mjmlVersion` es `mjml4` o `mjml5`, según la versión seleccionada en Emailify. Tu endpoint puede guardar el MJML, lanzar la validación de CI y dejar que la CI controle cualquier subida posterior a tu plataforma de email. Puedes usar los campos JSON personalizados que se describen abajo para añadir metadatos del flujo de trabajo, como el nombre de una app, una plantilla, un entorno o un idioma.

### Añadir un cuerpo JSON y cabeceras personalizados a tu carga {#adding-custom-json-body-and-headers-to-your-payload}

Si quieres, puedes añadir tu propia [cadena JSON válida](https://www.w3schools.com/js/js_json_datatypes.asp) en los campos que se describen abajo, y se incluirá automáticamente en el objeto `header` y/o en el objeto de cuerpo `data` de la carga que el plugin envía a la URL de tu endpoint como una petición `POST`:

- Puedes definir propiedades personalizadas del objeto `header` en el campo **Custom Request Headers (Optional)** (por ejemplo, `{ "Authorization": "Bearer xyz" }`).
- Puedes definir propiedades personalizadas del objeto de cuerpo `data` en **Custom Extra JSON Data (Optional)** (por ejemplo, `{ "category": "emailify" }`).
- También puedes definir propiedades personalizadas del objeto de cuerpo `data` "por email" en el campo **Extra Email-Specific JSON Payload Data (Optional)** (por ejemplo, `{ "id": 26, "tag": "email", "edit": true }`), que aparece bajo cada email en la lista de tu panel de exportación. Estos datos se combinan con los datos JSON globales que ya hayas definido (arriba).

## Enviar tu carga JSON por POST a través de un servidor proxy {#post-your-json-payload-via-a-proxy-server}

Como los plugins de Figma se ejecutan dentro de un elemento `iFrame` aislado en la app de Figma, no tienen ningún `origin`, así que la URL de webhook a la que envías la carga JSON por `POST` _puede_ rechazar la petición por problemas de CORS entre orígenes.

Para evitarlo, puedes actualizar tu propia función de webhook con [Access-Control-Allow-Origin](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Origin) definido como `*` (todos), o activar el interruptor **Use Proxy** (activado de forma predeterminada) en los ajustes del plugin Emailify al exportar tu email a un webhook personalizado.

Al activar el interruptor **Use Proxy**, tu petición pasa automáticamente por un servidor proxy antes de llegar a tu URL de webhook, para que la petición POST entrante tenga un `origin`, lo que debería resolver cualquier problema de CORS. Es solo un reenvío: los datos JSON pasan directamente por el proxy y se reenvían tal cual a tu propia URL de webhook.

> **Note:** Si activas el ajuste **Use Proxy**, las peticiones que pasan por el servidor proxy llegan desde una **dirección IP dinámica** cada vez que se envía una petición. Por eso, **si necesitas una dirección IP estática** (por ejemplo, si solo aceptas peticiones entrantes de determinadas IP, como un rango de direcciones IP de la red de tu oficina), desactiva este ajuste y actualiza tu función de webhook para definir [Access-Control-Allow-Origin](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Origin) como `*`, de modo que acepte peticiones POST directamente desde el plugin de Figma (sin pasar por el servidor proxy).
