Activer la transformation d'images

Edge Security Acceleration (ESA) transforme les images d'origine à la périphérie du réseau : conversion de format, ajustement de la qualité, recadrage et redimensionnement. Le service met ensuite en cache les résultats pour accélérer la diffusion et réduire le trafic vers l'origine.

Limites

Le traitement des images est soumis aux limites suivantes.

Limites relatives aux images d'origine :

Les formats d'image pris en charge sont JPEG, JPG, PNG, WebP, BMP, GIF, TIFF et JPEG 2000.
La taille de l'image d'origine ne doit pas dépasser 10 Mo.
Le produit largeur × hauteur ne doit pas dépasser 16 777 216 pixels.

Remarque
Pour les images GIF, la somme totale de la largeur multipliée par la hauteur correspond à l'addition de ces valeurs pour toutes les frames. Utilisez des outils tels qu'ImageMagick pour afficher les détails des frames d'une image GIF.

Limites relatives aux images transformées :

Le produit largeur × hauteur ne doit pas dépasser 16 777 216 pixels.
Lors de la conversion au format WebP, le produit largeur × hauteur ne doit pas dépasser 16 777 216 pixels, et ni la largeur ni la hauteur ne doivent dépasser individuellement 16 384 pixels. Si l'image source est animée, elle devient une image statique après conversion au format WebP.

Limites relatives au préchargement du cache :

Les transformations d'images ne s'appliquent pas au contenu préchargé dans le cache. Lors du préchargement du cache, les nœuds ESA récupèrent uniquement les fichiers d'image d'origine sans appliquer de transformations.

Dans la console ESA, sélectionnez Websites, puis cliquez sur le site cible dans la colonne Websites.
Dans le volet de navigation de gauche, sélectionnez Websites > Website.
Accédez à l'onglet Speed and Network. Activez le commutateur Optimize. Ajoutez ensuite des paramètres de traitement d'image à votre URL de requête pour appliquer différentes transformations.

Par exemple, en JavaScript, écrivez une fonction de gestion d'URL pour convertir une image vers un autre format.
```
function updateImageUrl(format) {
  let baseUrl = "https://example.com/image_01";
  let newUrl = `${baseUrl}.png?image_process=format,${format}`;
  document.getElementById('imageElement').src = newUrl;
}

// Example call to convert to BMP format
updateImageUrl("bmp");

// To convert to another format, such as JPG:
// updateImageUrl("jpg");
```
Dans le code ci-dessus, image_process=format,${format} spécifie le paramètre de transformation d'image. Pour plus d'informations sur les paramètres pris en charge et leurs valeurs valides, consultez Méthodes de traitement d'image prises en charge.

WebP adaptatif et AVIF adaptatif

Après avoir activé Speed Optimization ou Status, les nœuds ESA détectent la compatibilité du navigateur et convertissent les images d'origine au format WebP ou AVIF avant de les renvoyer aux clients, ce qui réduit la taille des données transmises. Vous pouvez activer chaque paramètre indépendamment.

Pour activer WebP adaptatif ou AVIF adaptatif

Dans la carte Adaptive WebP, cliquez sur Settings pour développer le formulaire de configuration.
Si le commutateur Adaptive AVIF est désactivé, activez-le.
Activez le commutateur Image Transform ou Status. Vous pouvez activer les deux commutateurs simultanément.
Cliquez sur Adaptive WebP pour enregistrer la configuration.

La conversion adaptative s'applique uniquement lorsque toutes les conditions suivantes sont remplies :

L'en-tête Accept de la requête contient image/avif ou image/webp.
La taille et la résolution de l'image d'origine ne dépassent pas les limites de la fonctionnalité de transformation d'image. Pour plus de détails, consultez Limites.
Le format de l'image d'origine est JPEG, JPG, PNG, WebP, BMP, GIF, TIFF, JPEG 2000 ou AVIF. Le format est déterminé par l'en-tête de réponse Content-Type ou par l'extension de fichier dans la requête.
Si vous activez à la fois Adaptive AVIF et OK, les nœuds ESA convertissent les images au format AVIF.

Validation de la transformation

Requête d'origine

Requête example.com/bb.jpeg. La réponse renvoie une image normalement orientée au format .jpeg.

Requête transformée

Conversion de format : Pour convertir une image .jpeg en .png, modifiez l'URL de la requête en example.com/bb.jpeg?image_process=format,png. La réponse renvoie une image .png.
Rotation d'image : Pour faire pivoter l'image de 90° dans le sens horaire, modifiez l'URL de la requête en example.com/bb.jpeg?image_process=rotate,90. La réponse renvoie l'image pivotée de 90° dans le sens horaire.

Méthodes de traitement d'image prises en charge

ESA permet d'appliquer un ou plusieurs paramètres de transformation à une image. Le tableau suivant répertorie les paramètres pris en charge.

Fonctionnalité de traitement d'image	Paramètre de traitement	Description
Conversion de format	format	Convertir le format de l'image.
Conversion de qualité	quality	Ajuster la qualité de l'image.
Recadrage d'image	crop	Recadrer l'image à une taille spécifiée.
Mise à l'échelle d'image	resize	Redimensionner l'image à une taille spécifiée. Actuellement, seule la réduction est prise en charge ; l'agrandissement n'est pas disponible.
Rotation d'image	Rotation automatique : auto-orient Rotation spécifiée : rotate	Faire pivoter automatiquement l'image en fonction de ses métadonnées, ou la faire pivoter dans le sens horaire selon un angle spécifié.
Couleur d'image	Luminosité : bright Contraste : contrast Netteté : sharpen	Ajuster la luminosité, le contraste et la netteté de l'image.
Ajouter un filigrane	watermark	Ajouter un filigrane image ou texte à l'image.
Obtenir des informations	info	Récupérer les informations de l'image, y compris les dimensions, le format et la qualité.

Relation entre les fonctionnalités à l'échelle du site et celles basées sur des règles

Les configurations à l'échelle du site s'appliquent à toutes les requêtes pour un site. Pour activer les transformations d'images uniquement pour des requêtes spécifiques, utilisez des configurations basées sur des règles avec des conditions correspondant aux requêtes souhaitées. L'équivalent basé sur des règles de la transformation d'image à l'échelle du site est Optimisation d'image.

Comparaison avec le traitement d'image OSS

La transformation d'image ESA et le traitement d'image OSS transforment tous deux les images à l'aide de paramètres d'URL. ESA traite les images à la périphérie, ce qui convient aux scénarios d'accélération en périphérie. Object Storage Service (OSS) traite les images côté service de stockage, ce qui convient aux scénarios de stockage. Si vous utilisez déjà le traitement d'image OSS, choisissez en fonction de votre scénario : utilisez ESA pour l'accélération en périphérie et OSS pour le stockage.