# Resizo Embed — Vue d'ensemble Resizo Embed est un système de six widgets gratuits d'outils d'image basés sur iframe que tout site web peut intégrer avec un seul extrait HTML. Les widgets sont servis depuis [resizo.in](https://www.resizo.in/fr/embed/), s'exécutent intégralement dans le navigateur du visiteur, et ne nécessitent ni clé d'API, ni compte, ni intégration backend. Les embeds sont gratuits pour un usage personnel, commercial et professionnel ; la seule condition est que le petit lien "Powered by Resizo" dans le pied du widget reste visible. ## Widgets disponibles | Widget | Route d'embed | Fonction | | --- | --- | --- | | Image Resizer | `/embed/image-resizer/` | Redimensionne aux dimensions pixel exactes avec verrouillage du ratio. | | JPG Compressor | `/embed/compress-image/` | Réduit la taille des fichiers JPG, PNG et WebP avec un curseur de qualité. | | WebP Converter | `/embed/webp-converter/` | Convertit PNG et JPG en WebP. | | Passport Photo | `/embed/passport-photo/` | Génère des photos de passeport / visa selon les spécifications officielles des États-Unis, du Royaume-Uni, de l'UE, de l'Inde et du Canada. | | Batch Resize | `/embed/batch-resize/` | Redimensionne plusieurs images en masse en une seule fois ; les résultats sont téléchargés en ZIP. | | Watermark Tool | `/embed/watermark/` | Ajoute des filigranes de texte avec position, couleur, opacité et rotation. | ## Extrait d'embed minimal ```html ``` Chaque widget pèse environ 5 à 10 Ko au total (HTML + CSS + JavaScript vanilla) et est chargé en lazy-load par défaut. Aucun framework, aucun SDK de tracking, aucune balise d'analytics à l'intérieur de l'iframe. ## Paramètres d'URL | Paramètre | Valeurs | Valeur par défaut | Description | | --- | --- | --- | --- | | `theme` | `light`, `dark` | (suit `prefers-color-scheme`) | Force un thème visuel fixe. Omettez-le pour s'aligner automatiquement sur la préférence du système d'exploitation du visiteur. | Le motif d'URL de base est `https://www.resizo.in/embed/{tool-id}/[?theme=light|dark]`. ## Modèle de confidentialité et de sécurité L'embed hérite de l'architecture "no upload, no persistence" de Resizo : - **Aucun upload.** Le widget utilise `FileReader` pour lire le fichier de l'utilisateur et la HTML5 Canvas API pour le traiter. Aucun endpoint réseau ne reçoit de données d'image. - **Aucun cookie.** Zéro cookie n'est défini dans l'iframe. Rien n'est écrit dans `localStorage` ou `sessionStorage` par défaut. - **Aucune télémétrie sur le contenu du fichier.** Les noms de fichiers, dimensions et métadonnées ne sont pas transmis. - **Conforme RGPD + CCPA par architecture**, pas par politique. Vérifiez avec DevTools → onglet Network : aucune requête n'est déclenchée pendant le traitement. - **L'attribut `sandbox` n'est pas pris en charge.** Il doit être omis, car `sandbox` bloque les téléchargements de fichiers dont dépend le widget. Si une Content-Security-Policy stricte est en vigueur, ajoutez `frame-src https://www.resizo.in;`. ## Protocole d'auto-redimensionnement (postMessage) Chaque widget poste sa hauteur de contenu à la fenêtre parente chaque fois que la mise en page change : ```json { "source": "resizo-embed", "type": "size", "height": 742 } ``` La page parente peut écouter le message et mettre à jour le `style.height` de l'iframe pour supprimer les barres de défilement internes. Comparez `event.source` au `contentWindow` de chaque iframe pour router correctement les mises à jour de hauteur sur les pages comportant plusieurs embeds. Aucune bibliothèque tierce de type `iframe-resizer` n'est requise. ## Compatibilité des plateformes Le même extrait d'iframe fonctionne sur toutes les plateformes qui acceptent du HTML personnalisé : - **WordPress** — bloc HTML personnalisé (éditeur de blocs) ou onglet "Texte" (éditeur classique). Les plugins de sécurité peuvent nécessiter l'ajout de `resizo.in` à la liste autorisée. - **Ghost** — carte HTML. - **Webflow** — élément Embed. - **Wix** — Ajouter → Embed Code → Embed HTML. - **Squarespace** — bloc de code. - **Notion** — commande slash `/embed` avec l'URL du widget. - **Shopify** — Pages → clic sur `` (Show HTML) → coller. - **HTML statique** — collez directement dans le fichier ; pas d'étape de build. Des composants prêts à l'emploi sont également fournis pour **React** (avec auto-resize via `useEffect`), **Vue** (`onMounted` / `onBeforeUnmount`), et **Angular** (`ngOnInit` / `ngOnDestroy`). ## Prise en charge des navigateurs | Navigateur | Version minimale | | --- | --- | | Chrome / Edge (Chromium) | 80+ | | Firefox | 78+ | | Safari (incl. iOS Safari) | 14+ | | Chrome Android | 80+ | L'export WebP est entièrement pris en charge dans Chrome, Safari et Edge. La Canvas API utilisée en interne bénéficie d'un support mondial supérieur à 98,5 % selon [caniuse.com/canvas](https://caniuse.com/canvas). ## Versioning L'embed est récupéré depuis `resizo.in` au moment du rendu, donc les améliorations sont déployées automatiquement. Le *code* d'embed que vous collez sur votre site reste identique. Les changements incompatibles d'URL ou de format de message sont évités ; s'ils deviennent nécessaires, l'ancienne URL continuera à servir le comportement précédent sous un chemin versionné. ## Documentation associée - [Embed Generator](https://www.resizo.in/fr/embed/) — générateur interactif qui produit l'extrait d'iframe. - [Documentation Embed (HTML)](https://www.resizo.in/fr/embed/docs/) — guide d'intégration complet avec tutoriels par plateforme, composants de framework et dépannage. - [Vue d'ensemble de Resizo](https://www.resizo.in/docs/overview.fr.md) — ce qu'est Resizo et son raisonnement architectural. - [Comment fonctionne Resizo](https://www.resizo.in/docs/how-it-works.fr.md) — pipeline de traitement dans le navigateur et modèle de confidentialité. - [Fonctionnalités](https://www.resizo.in/docs/features.fr.md) — liste complète des fonctionnalités et dimensions des presets pour les réseaux sociaux.