---
url: "/fr/emailify/export/webhook.md"
description: "Envoyez le HTML généré ou le code source MJML d’Emailify vers votre propre point de terminaison, dans un payload JSON de webhook."
---

# Envoyer vos emails vers une URL de webhook personnalisée

> Envoyez le HTML généré ou le code source MJML d’Emailify vers votre propre point de terminaison, dans un payload JSON de webhook.

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

Dans le panneau d’export d’Emailify, sélectionnez l’option **Custom Webhook URL** dans la liste déroulante, puis collez l’URL de votre propre point de terminaison, conçu pour traiter [le payload JSON](#the-json-payload-object-sent-via-post-to-your-url) envoyé par Emailify.

Quand vous êtes prêt, cliquez sur le bouton **POST** pour exporter les emails sélectionnés dans Figma et les envoyer sous forme de requête `POST` à votre point de terminaison de webhook personnalisé.

> **Tip:** Vos images sont automatiquement importées dans notre CDN et renseignées dans l’attribut `src` de chaque balise `` de la propriété `html` (une chaîne) envoyée dans le payload.

> **Note:** Votre code est exporté en HTML par défaut. Vous pouvez sélectionner **MJML Source Code** ou un format propre à une plateforme dans les options d’export Webhook lorsque votre point de terminaison a besoin d’un autre format de passation.

## L’objet de payload JSON envoyé en POST à votre URL {#the-json-payload-object-sent-via-post-to-your-url}

Le payload JSON envoyé par Emailify contient les clés et valeurs ci-dessous. Assurez-vous que votre URL de webhook personnalisée est conçue pour traiter ce payload, que vous pouvez ensuite utiliser comme bon vous semble.

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

### Envoyer le code source MJML à un workflow de CI {#send-mjml-source-to-a-ci-workflow}

Choisissez **MJML Source Code** dans le sélecteur de format Webhook lorsque votre point de terminaison a besoin du code source MJML généré pour le valider ou le compiler. Sélectionnez la même version de MJML que celle de votre workflow de CI. Emailify ajoute les champs `mjml` et `mjmlVersion` tout en conservant le champ `html` compilé :

```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"
}
```

La valeur de `mjmlVersion` est `mjml4` ou `mjml5`, selon la version sélectionnée dans Emailify. Votre point de terminaison peut stocker le MJML, déclencher la validation par la CI et laisser la CI gérer tout import ultérieur dans votre plateforme d’emailing. Vous pouvez utiliser les champs JSON personnalisés ci-dessous pour ajouter des métadonnées de workflow, comme le nom d’une app, d’un modèle, d’un environnement ou d’une langue.

### Ajouter un corps JSON et des en-têtes personnalisés à votre payload {#adding-custom-json-body-and-headers-to-your-payload}

Vous pouvez ajouter votre propre [chaîne JSON valide](https://www.w3schools.com/js/js_json_datatypes.asp) dans les champs ci-dessous : elle sera automatiquement incluse dans l’objet `header` et/ou l’objet de corps `data` du payload envoyé par le plugin à l’URL de votre point de terminaison sous forme de requête `POST` :

- Vous pouvez définir des propriétés personnalisées de l’objet `header` dans le champ **Custom Request Headers (Optional)** (par exemple, `{ "Authorization": "Bearer xyz" }`).
- Vous pouvez définir des propriétés personnalisées de l’objet de corps `data` dans **Custom Extra JSON Data (Optional)** (par exemple, `{ "category": "emailify" }`).
- Vous pouvez aussi définir des propriétés personnalisées de l’objet de corps `data` email par email dans le champ **Extra Email-Specific JSON Payload Data (Optional)** (par exemple, `{ "id": 26, "tag": "email", "edit": true }`), sous chaque email de la liste de votre panneau d’export. Elles seront fusionnées avec les données JSON globales que vous avez éventuellement déjà définies (ci-dessus).

## Envoyer votre payload JSON en POST via un serveur proxy {#post-your-json-payload-via-a-proxy-server}

Comme les plugins Figma s’exécutent dans un élément `iFrame` isolé (sandbox) de l’application Figma, ils n’ont pas d’`origin` : l’URL de webhook à laquelle vous envoyez le payload JSON en `POST` _peut_ donc rejeter la requête en raison de problèmes CORS (requêtes cross-origin).

Pour contourner ce problème, vous pouvez soit modifier votre propre fonction de webhook en réglant [Access-Control-Allow-Origin](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Origin) sur `*` (tous), soit activer l’option **Use Proxy** (activée par défaut) dans les réglages du plugin Emailify lorsque vous exportez votre email vers un webhook personnalisé.

Activer l’option **Use Proxy** fait automatiquement transiter votre requête par un serveur proxy avant qu’elle n’atteigne votre URL de webhook : la requête POST entrante a ainsi une `origin`, ce qui devrait résoudre les problèmes CORS. Il s’agit d’un simple transfert : les données JSON passent directement par le proxy et sont relayées telles quelles à votre propre URL de webhook.

> **Note:** Avec le réglage **Use Proxy** activé, les requêtes qui transitent par le serveur proxy proviennent d’une **adresse IP dynamique** à chaque envoi. **Si vous avez besoin d’une adresse IP statique** (par exemple, si vous n’acceptez que les requêtes entrantes de certaines IP, comme une plage d’adresses IP du réseau de votre bureau), désactivez ce réglage et modifiez plutôt votre fonction de webhook en réglant [Access-Control-Allow-Origin](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Origin) sur `*` pour accepter les requêtes POST directement depuis le plugin Figma (sans passer par le serveur proxy).
