DocumentationSDK sur GitHub

Documentation Guides pratiques

Générer le HTML depuis le JSON

Générez le HTML et le texte brut personnalisés depuis votre backend sans ouvrir d’éditeur.

Sur cette page

1. Charger le document sauvegardé

Chargez le document EmailDocument complet sauvegardé avec onDocumentChange. Le rendu accepte les versions 1 et 2 du schéma. Envoyez le JSON lui-même ; un ID de modèle ou de brouillon ne le remplace pas.

2. Demander le HTML

Envoyez un POST vers https://api.weavour.com/editors/:editorKey/render avec document et, si nécessaire, mergeValues et conditionValues. Les appels serveur ne nécessitent ni session, ni identifiants utilisateur, ni en-tête Origin. Les appels navigateur exigent une origine autorisée.

typescript
// Run on your backend. email.json is the complete saved EmailDocument.
import { readFile } from 'node:fs/promises';
import type { EmailDocument } from '@weavour/editor';

async function renderSavedEmail(
  document: EmailDocument,
  mergeValues: Record<string, string> = {},
  conditionValues: Record<string, boolean> = {},
) {
  const editorKey = 'YOUR_PUBLIC_EDITOR_KEY';
  const response = await fetch(
    `https://api.weavour.com/editors/${editorKey}/render`,
    {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({ document, mergeValues, conditionValues }),
    },
  );
  const result = await response.json();
  if (!response.ok) {
    throw Object.assign(new Error(result.error ?? 'Email rendering failed'), {
      status: response.status,
      issues: result.issues,
      retryAfter: response.headers.get('Retry-After'),
    });
  }
  return result as {
    html: string;
    text: string;
    subject: string;
    preheader: string;
    rendererVersion: string;
  };
}

const savedEmail: EmailDocument = JSON.parse(await readFile('./email.json', 'utf8'));
const { html, text, subject, preheader } = await renderSavedEmail(
  savedEmail,
  { first_name: 'Alex' }, // Use the stable IDs of tags in your document.
);
// Submit these fields through your own email delivery provider.
console.log(html);

3. Fournir les valeurs du destinataire

mergeValues associe les ID des variables à des chaînes : { first_name: "Alex" }. Utilisez l’ID, pas {{first_name}}. Fournissez chaque valeur utilisée dans le contenu visible, l’objet et le pré-en-tête. Les valeurs d’exemple ne sont pas utilisées.

Les valeurs de texte sont échappées en HTML. Une valeur URL doit occuper un champ de lien complet compatible et utiliser HTTP, HTTPS, mailto ou tel. Les valeurs manquantes renvoient 422 avec l’ID et l’emplacement.

4. Fournir les résultats des conditions

Pour les documents conditionnels, évaluez les règles dans votre backend. Passez les résultats booléens dans conditionValues, par ID. Un parent faux retire toute sa mise en page ; les valeurs utilisées uniquement à l’intérieur deviennent inutiles. Un résultat manquant pour une règle visible renvoie 422.

typescript
// Evaluate your application's rules before calling the renderer.
const output = await renderSavedEmail(
  savedEmail,
  { first_name: 'Alex' },
  { free_account: true }, // Condition ID -> boolean, never an expression.
);
// output.html and output.text contain only matching layouts.

5. Envoyer le résultat

La réponse contient html, text, subject, preheader et rendererVersion. Envoyez les champs de l’email avec votre prestataire. Le rendu ne sauvegarde ni n’envoie. Les images et minuteurs doivent déjà avoir des URL publiques.

Limites et erreurs

Les images de fond des mises en page et le CSS global personnalisé ne sont pas pris en charge. Pour les fonds, ouvrez l’email dans l’éditeur et utilisez exportHTML(). Le contenu incompatible renvoie une erreur.

Requête maximale : 1 000 000 octets UTF-8. Documents : 2 000 nœuds rendus, profondeur 30. Valeurs : 1 000 chaînes de 8 192 caractères au maximum chacune.

Statut HTTPAction
400 / 415Corrigez le JSON, le type des valeurs ou Content-Type.
401 / 403Vérifiez la clé d’éditeur et, pour le navigateur, l’origine autorisée.
413Réduisez la taille de la requête ou la complexité du document.
422Consultez error et issues ; corrigez les valeurs manquantes, le document ou le contenu incompatible.
429 / 503Réessayez avec un délai croissant et aléatoire, en respectant Retry-After s’il est présent.
Besoin d’aide ? Contactez-nous