Enable image transformation - Edge Security Acceleration - Centro de documentación de Alibaba Cloud

Edge Security Acceleration (ESA) transforms origin images at the edge—converting formats, adjusting quality, cropping, and scaling—then caches the results to improve delivery speed and reduce back-to-origin traffic.

Límites

El procesamiento de imágenes está sujeto a los límites que se indican a continuación.

Límites de la imagen original:

Los formatos de imagen compatibles incluyen JPEG, JPG, PNG, WebP, BMP, GIF, TIFF y JPEG 2000.
El tamaño de la imagen original no debe exceder 10 MB.
El producto de ancho × alto no debe exceder 16,777,216 píxeles.

Nota
En las imágenes GIF, el producto total de ancho × alto es la suma de los valores de ancho × alto de todos los fotogramas. Puede utilizar herramientas como ImageMagick. Consulte los detalles de los fotogramas de una imagen GIF.

Límites de la imagen transformada:

El producto de ancho × alto no debe exceder 16,777,216 píxeles.
Al convertir a formato WebP, el producto de ancho × alto no debe exceder 16,777,216 píxeles, y ni el ancho ni el alto pueden exceder individualmente 16,384 píxeles. Si la imagen de origen es animada, se convierte en una imagen estática después de la conversión a WebP.

Límites de la precarga de caché:

Las transformaciones de imágenes no se aplican al contenido precargado en caché. Durante la precarga de caché, los nodos de ESA obtienen solo los archivos de imagen originales sin aplicar transformaciones.

Habilite la transformación de imágenes

En la consola de ESA, seleccione Websites y, en la columna Websites, haga clic en el sitio de destino.
En el panel de navegación izquierdo, seleccione Speed and Network > Optimize.
Vaya a la pestaña Speed and Network. Active el interruptor Optimize. Después, agregue parámetros de procesamiento de imágenes a la URL de la solicitud para aplicar diferentes transformaciones de imágenes.

Por ejemplo, en JavaScript, puede escribir una función para procesar la URL y convertir una imagen a otro formato.
```
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");
```
En el código anterior, image_process=format,${format} especifica el parámetro de transformación de imágenes. Para consultar más parámetros compatibles y sus valores válidos, consulte Supported image processing methods.

Adaptive WebP y Adaptive AVIF

Después de activar Speed Optimization o Status, los nodos de ESA detectan la compatibilidad del navegador y convierten las imágenes de origen a formato WebP o AVIF antes de devolverlas a los clientes, lo que reduce el tamaño de transmisión. Puede activar cualquiera de las dos configuraciones de forma independiente.

Habilite Adaptive WebP o Adaptive AVIF

En la tarjeta Adaptive WebP, haga clic en Settings para expandir el formulario de configuración.
Si el interruptor Adaptive AVIF está apagado, actívelo.
Active el interruptor Image Transform o Status. Puede activar ambos interruptores al mismo tiempo.
Haga clic en Adaptive WebP y guarde la configuración.

La conversión adaptativa se aplica solo cuando se cumplen todas las condiciones que se indican a continuación:

El encabezado Accept de la solicitud contiene image/avif o image/webp.
El tamaño y la resolución de la imagen de origen no exceden los límites de la función de transformación de imágenes. Para obtener más información, consulte Límites.
El formato de la imagen de origen es JPEG, JPG, PNG, WebP, BMP, GIF, TIFF, JPEG 2000 o AVIF. El formato se determina por el encabezado de respuesta Content-Type o por la extensión de archivo en la solicitud.
Si activa tanto Adaptive AVIF como OK, los nodos de ESA convierten las imágenes a formato AVIF.

Validación de la transformación

Solicitud original

Solicite example.com/bb.jpeg. La respuesta devuelve una imagen con orientación normal en formato .jpeg.

Solicitud transformada

Conversión de formato: Para convertir una imagen .jpeg a .png, cambie la URL de la solicitud a example.com/bb.jpeg?image_process=format,png. La respuesta devuelve una imagen .png.
Rotación de imagen: Para rotar la imagen 90° en sentido horario, cambie la URL de la solicitud a example.com/bb.jpeg?image_process=rotate,90. La respuesta devuelve la imagen rotada 90° en sentido horario.

Métodos de procesamiento de imágenes compatibles

ESA admite aplicar uno o varios parámetros de transformación a una imagen. En la tabla que se muestra a continuación se enumeran los parámetros compatibles.

Función de procesamiento de imágenes	Parámetro de procesamiento	Descripción
Format conversion	format	Convierte el formato de la imagen.
Quality conversion	quality	Ajusta la calidad de la imagen.
Image cropping	crop	Recorta la imagen a un tamaño especificado.
Image scaling	resize	Escala la imagen a un tamaño especificado. Actualmente, solo es compatible la reducción de escala; la ampliación no está disponible.
Image rotation	Rotación automática: auto-orient Rotación especificada: rotate	Rota automáticamente la imagen según sus metadatos, o la rota en sentido horario en un ángulo especificado.
Image color	Brillo: bright Contraste: contrast Nitidez: sharpen	Ajusta el brillo, el contraste y la nitidez de la imagen.
Add watermark	watermark	Añade una marca de agua de imagen o de texto a la imagen.
Get info	info	Recupera la información de la imagen, incluidas las dimensiones, el formato y la calidad.

Relación entre las funciones de todo el sitio y las funciones basadas en reglas

Las configuraciones de todo el sitio se aplican a todas las solicitudes de un sitio. Para habilitar las transformaciones de imágenes solo para solicitudes específicas, use configuraciones basadas en reglas con condiciones que coincidan con las solicitudes deseadas. El equivalente basado en reglas de la transformación de imágenes de todo el sitio es Image Optimization.

Comparación con el procesamiento de imágenes de OSS

Tanto la transformación de imágenes de ESA como el procesamiento de imágenes de OSS transforman imágenes mediante parámetros de URL. ESA procesa imágenes en el borde, lo que lo hace adecuado para escenarios de aceleración en el borde. Object Storage Service (OSS) procesa imágenes en el lado del servicio de almacenamiento, lo que lo hace adecuado para escenarios de almacenamiento. Si ya usa el procesamiento de imágenes de OSS, elija según su escenario: use ESA para aceleración en el borde y OSS para almacenamiento.