diff --git a/src/content/docs/en/pages/guides/edge-application/ea-fs-image-processor.mdx b/src/content/docs/en/pages/guides/edge-application/ea-fs-image-processor.mdx index 4a1eb0fee7..3c72379a96 100644 --- a/src/content/docs/en/pages/guides/edge-application/ea-fs-image-processor.mdx +++ b/src/content/docs/en/pages/guides/edge-application/ea-fs-image-processor.mdx @@ -24,6 +24,15 @@ For images, Azion recommends that you choose larger time-to-live (TTL) values, s - **Content varies by some Query String fields (Allowlist)**: if you want to list all the fields in the Query String that will identify your images. **Image Processor** uses the *ims* field, so this has to be included in the list as one of the required fields for your image manager application. For this, you must enable the [Application Accelerator module](/en/documentation/products/build/edge-application/application-accelerator/). - **Content varies by Query String, except for some fields (Blocklist)**: if you only want to list those fields in the Query String that should be ignored to identify the objects in your cache. In this case, it guarantees that the *ims* field will be removed from the list. For this, you must enable the [Application Accelerator module](/en/documentation/products/build/edge-application/application-accelerator/). - **Content varies by all Query String fields**: if you don't know or aren't sure about which fields to list in the Query String because you aren't responsible for all the content in the cache or don't have [Application Accelerator](/en/documentation/products/build/edge-application/application-accelerator/) activated. + +:::caution +To ensure proper processing of images, the `ims=` query string parameter must be the last parameter in the URL. If any additional query string parameters are included after `ims=`, the request may return a **504** error. + +Example of a **valid** URL: https://example.com/image.jpeg?ts=1234&ims=1000x1000 + +Example of an **invalid** URL (causes error 504): https://example.com/image.jpeg?ims=1000x1000&ts=1234 +::: + 6. Edit the remaining settings as required and click the **Save** button. 7. In the **Rules Engine** tab for the edge application, add or edit a **Request phase** rule for one or more image paths. 8. In the **Criteria** section, select the variable to indicate the path of your images in your origin: @@ -50,5 +59,3 @@ To resize, crop, optimize, convert, or apply filters to an image, you'll need to To confirm whether your image is being optimized, [inspect the page](https://developer.mozilla.org/en-US/docs/Learn/Common_questions/What_are_browser_developer_tools) using your browser and find the corresponding path in the image. In the URL's query string, the `ims=VALUExVALUE` field corresponds to the resolution loaded on the page. In addition, **Image Processor** detects the browser's compatibility with WEBP format and, when possible, it'll convert the image format automatically. BMP images will also be automatically converted to JPEG or WEBP, depending on the browser's compatibility. - - diff --git a/src/content/docs/en/pages/main-menu/reference/build/edge-application/image-processor.mdx b/src/content/docs/en/pages/main-menu/reference/build/edge-application/image-processor.mdx index 9edbf2570f..b9ed67d568 100644 --- a/src/content/docs/en/pages/main-menu/reference/build/edge-application/image-processor.mdx +++ b/src/content/docs/en/pages/main-menu/reference/build/edge-application/image-processor.mdx @@ -46,6 +46,14 @@ This module supports an array of image formats, including: --- +:::caution +To ensure proper processing of images, the `ims=` query string parameter must be the last parameter in the URL. If any additional query string parameters are included after `ims=`, the request may return a **504** error. + +Example of a **valid** URL: https://example.com/image.jpeg?ts=1234&ims=1000x1000 + +Example of an **invalid** URL (causes error 504): https://example.com/image.jpeg?ims=1000x1000&ts=1234 +::: + ## Resize images Specify the required size as arguments in the query string using the key-value pair `?ims=WidthxHeight`. The `Width` and `Height` parameters should be changed to the width and height of the image in pixels. @@ -207,7 +215,3 @@ Combine the filters you want by separating filter with `:` into one string: `fil For instance, the query `?ims=fit-in/400x400/filters:fill(00ffff):quality(100)` will resize an image to fit an area of 500 by 500 pixels, fill the resized area with the color `#00ffff` and improve the quality to 100%:

[![Image_Processor_1](/assets/docs/images/image-processor/Image_Processor_1.png?ims=fit-in/500x500/filters:fill(f3652b):quality(100))](/assets/docs/images/image-processor/Image_Processor_1.png?ims=fit-in/500x500/filters:fill(f3652b):quality(100))

- - - - diff --git a/src/content/docs/pt-br/pages/menu-principal/referencia/build/edge-application/image-processor-primeiros-passos.mdx b/src/content/docs/pt-br/pages/menu-principal/referencia/build/edge-application/image-processor-primeiros-passos.mdx index 6ea1283c88..b807e2a5be 100644 --- a/src/content/docs/pt-br/pages/menu-principal/referencia/build/edge-application/image-processor-primeiros-passos.mdx +++ b/src/content/docs/pt-br/pages/menu-principal/referencia/build/edge-application/image-processor-primeiros-passos.mdx @@ -11,7 +11,6 @@ permalink: /documentacao/produtos/guias/image-processor/ import Tabs from '~/components/tabs/Tabs' - Para configurar o [Image Processor](/pt-br/documentacao/produtos/build/edge-application/image-processor/), siga os passos: @@ -32,6 +31,15 @@ Para imagens, a Azion recomenda que você escolha valores maiores de time-to-liv - **Content varies by some Query String fields (Allowlist)**: se você desejar listar todos os campos da Query String que diferenciam suas imagens. O **Image Processor** utiliza o campo *ims*, que deverá ser incluído na listagem com os demais campos necessários por sua aplicação de gestão de imagens. Essa opção requer que o módulo [Application Accelerator](/pt-br/documentacao/produtos/build/edge-application/application-accelerator/) esteja ativado. - **Content varies by Query String, except for some fields (Blacklist)**: se você desejar listar apenas quais campos da Query String devem ser ignorados ao diferenciar os objetos em cache. Nesse caso, garanta que o campo *ims* seja removido da listagem. Essa opção requer o módulo [Application Accelerator](/pt-br/documentacao/produtos/build/edge-application/application-accelerator/) esteja ativado. - **Content varies by all Query String fields**: se você não sabe ou não se sente seguro para listar os campos da Query String que são responsáveis pela variação do seu conteúdo em cache ou se não possui o produto **Application Accelerator**. + +:::caution +Para garantir o processamento adequado das imagens, o parâmetro de query string `ims=` deve ser o último parâmetro na URL. Se quaisquer parâmetros de query string adicionais forem incluídos após `ims=`, a requisição pode retornar um erro **504**. + +Exemplo de uma URL **válida**: https://example.com/image.jpeg?ts=1234&ims=1000x1000 + +Exemplo de uma URL **inválida** (causa erro 504): https://example.com/image.jpeg?ims=1000x1000&ts=1234 +::: + 6. Edite as configurações restantes conforme necessário e clique no botão **Save**. 7. Na aba **Rules Engine** da edge application, adicione ou edite uma regra **Request** para um ou mais caminhos de imagem. 8. Na seção **Criteria**, selecione a variável para indicar o caminho das imagens na sua origem: @@ -99,4 +107,3 @@ Para confirmar se a imagem está sendo otimizada, [inspecione a página](https:/ Além disso, o **Image Processor** detecta a compatibilidade do navegador com o formato WEBP e, quando possível, converterá o formato da imagem automaticamente. As imagens BMP também serão convertidas automaticamente para JPEG ou WEBP, dependendo da compatibilidade do navegador. --- - diff --git a/src/content/docs/pt-br/pages/menu-principal/referencia/build/edge-application/image-processor.mdx b/src/content/docs/pt-br/pages/menu-principal/referencia/build/edge-application/image-processor.mdx index 49b6220119..589ab736c0 100644 --- a/src/content/docs/pt-br/pages/menu-principal/referencia/build/edge-application/image-processor.mdx +++ b/src/content/docs/pt-br/pages/menu-principal/referencia/build/edge-application/image-processor.mdx @@ -46,6 +46,14 @@ Esse módulo oferece suporte aos seguintes formatos de imagem: --- +:::caution +Para garantir o processamento adequado das imagens, o parâmetro de query string `ims=` deve ser o último parâmetro na URL. Se quaisquer parâmetros de query string adicionais forem incluídos após `ims=`, a requisição pode retornar um erro **504**. + +Exemplo de uma URL **válida**: https://example.com/image.jpeg?ts=1234&ims=1000x1000 + +Exemplo de uma URL **inválida** (causa erro 504): https://example.com/image.jpeg?ims=1000x1000&ts=1234 +::: + ## Redimensionar a imagem Você especifica as dimensões desejadas como argumentos na query da URL no formato `ims=WidthxHeight`. Os parâmetros `Width` e `Height` devem ser alterados para a largura e altura da imagem, respectivamente, em pixels. @@ -218,7 +226,4 @@ Por exemplo, a query `?ims=fit-in/400x400/filters:fill(00ffff):quality(100)` red

[![Image_Processor_1](/assets/docs/images/image-processor/Image_Processor_1.png?ims=fit-in/500x500/filters:fill(f3652b):quality(100))](/assets/docs/images/image-processor/Image_Processor_1.png?ims=fit-in/500x500/filters:fill(f3652b):quality(100))

- - --- -