diff --git a/common/html-to-png-puppeteer.md b/common/html-to-png-puppeteer.md new file mode 100644 index 0000000..bc3ae5c --- /dev/null +++ b/common/html-to-png-puppeteer.md @@ -0,0 +1,45 @@ +# HTML vers PNG : Rendu headless Puppeteer / Chromium + +**Contexte** : html2canvas echoue dans les iframes sandbox (Claude.ai, widgets). +Polices Google Fonts et SVG complexes bloques par CORS. +**Solution** : rendu serveur avec Chromium headless. + +--- + +## Approche 1 - Claude bash_tool + +### Installation (une seule fois par session) + + + +### Script render.mjs + + + +**Pieges critiques :** +- Entry point : lib/puppeteer/puppeteer.js (pas lib/esm/) +- page.waitForTimeout() supprime en v25+ => setTimeout natif +- --no-sandbox obligatoire dans container Claude +- networkidle0 + 2s = polices externes chargees + + + +--- + +## Approche 2 - NAS via Gotenberg (port 3001, deja deploye) + +Gotenberg embarque Chromium. HTML -> PDF puis PDF -> PNG Pillow. + + + +Ou via noeud HTTP Request n8n (multipart/form-data vers Gotenberg). + +--- + +## Cas valide (2026-06-21) + +Carte felicitations Bac 2026 - HTML/SVG 680x680px + Google Fonts. +Resultat : PNG 1360x1360px (137 Ko), upload Facebook direct. + +**Regle absolue** : html2canvas = NON iframe sandbox. +Puppeteer (Claude) ou Gotenberg (NAS) = OUI.