Recortar imagens para redimensionar - CDN: Central de Documentação do Alibaba Cloud

Adicione um parâmetro de recorte à URL de requisição do CDN para aparar, remodelar ou reenquadrar uma imagem dinamicamente, sem alterar o arquivo source.

O recurso de edição de imagens do Alibaba Cloud CDN, o recurso de edição de imagens do DCDN e o Image Processing (IMG) do Object Storage Service (OSS) são três funcionalidades independentes. A edição de imagens é gratuita até novo aviso.

Como funciona

Defina o parâmetro de consulta image_process como crop ou circle, seguido das opções que definem a área de recorte. O nó de borda do CDN processa a imagem antes da entrega ao cliente.

https://example.com/image.png?image_process=crop,w_400,h_300

Os quatro modos de recorte utilizam o mesmo ponto de entrada image_process. As opções fornecidas determinam o modo aplicado.

Parâmetros

Os parâmetros abaixo se aplicam à ação crop.

Se qualquer parâmetro tiver um valor negativo, a imagem retornará em seu tamanho original.

Parâmetro	Descrição	Padrão
`w`	Largura da área recortada, em pixels. O total de pixels da imagem de saída não pode exceder 16.777.216.	`0`
`h`	Altura da área recortada, em pixels.	—
`x`	Coordenada X da área recortada.	Canto superior esquerdo da imagem
`y`	Coordenada Y da área recortada.	Canto superior esquerdo da imagem
`g`	Posição de âncora em uma grade 3 por 3. Defina qual canto superior esquerdo do bloco usar como origem do recorte.	—

Posições da grade (parâmetro `g`)

A imagem divide-se em uma grade 3 por 3 com nove blocos. Cada valor de posição refere-se ao canto superior esquerdo do bloco correspondente.

3 by 3 grid positions

Valor	Posição
`nw`	Superior esquerdo
`north`	Superior central
`ne`	Superior direito
`west`	Centro esquerdo
`center`	Centro
`east`	Centro direito
`sw`	Inferior esquerdo
`south`	Inferior central
`se`	Inferior direito

Recorte por posição na grade

Recorte uma área de tamanho fixo ancorada em uma das nove posições da grade. Use este método para obter uma região de recorte consistente, independentemente das dimensões da imagem (por exemplo, para extrair uma miniatura do canto inferior direito).

https://example.com/image01.png?image_process=crop,w_200,h_200,g_se

Esse comando recorta uma área de 200×200 ancorada no bloco inferior direito (se).

Recorte a partir do centro

Para obter uma região centralizada, recorte igualmente os quatro lados. Utilize mid com w e h.

https://example.com/image01.png?image_process=crop,mid,w_400,h_200

Recorte por coordenadas

Especifique as coordenadas do canto inferior esquerdo e as dimensões desejadas para recortar uma região específica.

https://example.com/image01.png?image_process=crop,x_10,y_10,w_400,h_200

O exemplo acima recorta uma região de 400×200, começando 10 pixels da esquerda e 10 pixels do topo.

Recorte circular

Transforme a imagem em um círculo especificando o raio. O raio não pode ultrapassar metade do comprimento do lado menor da imagem source.

https://example.com/image01.png?image_process=circle,200

Observações de uso

A conversão de formato pode aumentar o tamanho do arquivo. A conversão entre formatos (por exemplo, JPEG para WebP, JPEG para PNG ou PNG para WebP) pode gerar uma saída maior, pois cada formato utiliza algoritmos de compressão diferentes. Para reduzir o tamanho do arquivo após a conversão, adicione o parâmetro quality e diminua a qualidade da imagem.