Como otimizar o processamento de imagens no edge

Acesse o Azion Console > Application.
Clique na edge application que você deseja configurar.
Ative os módulos Application Accelerator e Image Processor.
Clique no botão Save.
Navegue até a aba Cache Settings.
Clique no botão + Cache Setting.
Na seção Cache Expiration Policies, configure a política de expiração para suas imagens.

Para imagens, você pode adicionar valores de tempo de vida (TTL) maiores, como 1296000 segundos (15 dias).

Na seção Advanced Cache Key, escolha uma das seguintes opções:
- O conteúdo varia por alguns campos de Query String (Allowlist): se você deseja listar todos os campos na query string que identificarão suas imagens. Image Processor usa o campo ims, então este deve ser incluído na lista como um dos campos necessários para sua aplicação de gerenciamento de imagens.
- O conteúdo varia pela Query String, exceto por alguns campos (Blocklist): se você deseja listar apenas aqueles campos na query string que devem ser ignorados para identificar os objetos em seu cache. Neste caso, garante que o campo ims será removido da lista.
- O conteúdo varia por todos os campos de Query String: se você não sabe ou não tem certeza sobre quais campos listar na query string porque não é responsável por todo o conteúdo no cache ou não tem Application Accelerator ativado.
Clique no botão Save.

Agora você precisa indicar o que acionará a ativação do módulo Image Processor. Você pode criar uma regra que identifica formatos de imagem da seguinte maneira:

Ainda na página Application, navegue até a aba Rules Engine.
Clique no botão + Rule.
Nomeie sua regra.
Selecione Request Phase.
Na seção Criteria, selecione a variável ${request_uri}.
Selecione o operador de comparação matches.
Como argumento, adicione \.(jpg|jpeg|gif|bmp|png).
Clique em + Or para adicionar outro critério.
No novo campo, selecione a variável ${uri}.
Selecione o operador de comparação matches.
Como argumento, adicione \.(jpg|jpeg|gif|bmp|png)$.
Na seção Behaviors, selecione Set Cache Policy e selecione a configuração de cache que você criou.
Clique no botão + Add Behavior.
Adicione o comportamento Optimize Images.

Clique no botão Save para salvar sua regra.

Para confirmar se sua imagem está sendo otimizada, inspecione a página usando seu navegador e encontre o caminho correspondente na imagem. Na query string da URL, o campo ims=VALUExVALUE corresponde à resolução carregada na página. Para ver o arquivo original, você só precisa remover a query string adicionada na URL.

Execute a seguinte requisição PATCH em seu terminal, substituindo [TOKEN VALUE] por seu personal token e a variável <application_id> por seu ID de application para ativar os módulos Application Accelerator e Image Processor:

curl --location --request PATCH 'https://api.azionapi.net/edge_applications/<application_id>' --header 'Accept: application/json; version=3' --header 'Content-Type: application/json' --header 'Authorization: Token [TOKEN VALUE]' --data '{
  "application_acceleration": true,
  "image_optimization": true
}'

Você receberá uma resposta com o valor atualizado.
Execute a seguinte requisição POST em seu terminal, substituindo [TOKEN VALUE] por seu personal token e a variável <application_id> pelo id de sua application:

curl --location 'https://api.azionapi.net/edge_applications/<application_id>/cache_settings' --header 'Accept: application/json; version=3' --header 'Content-Type: application/json' --header 'Authorization: Token [TOKEN VALUE]' --data '{
  "name": "QS15D img",
  "browser_cache_settings": "override",
  "browser_cache_settings_maximum_ttl": 60,
  "cdn_cache_settings": "override",
  "cdn_cache_settings_maximum_ttl": 1296000,
  "cache_by_query_string": "whitelist",
  "query_string_fields": [
      "ims"
  ]
}'

Você receberá uma resposta semelhante a esta:

{
  "results": {
      "id": <cache_setting_id>,
      "name": "QS15D img",
      "browser_cache_settings": "override",
      "browser_cache_settings_maximum_ttl": 60,
      "cdn_cache_settings": "override",
      "cdn_cache_settings_maximum_ttl": 1296000,
      "cache_by_query_string": "whitelist",
      "query_string_fields": [
          "ims"
      ],
      "enable_query_string_sort": false,
      "cache_by_cookies": "ignore",
      "cookie_names": null,
      "adaptive_delivery_action": "ignore",
      "device_group": [],
      "enable_caching_for_post": false,
      "l2_caching_enabled": false,
      "is_slice_configuration_enabled": false,
      "is_slice_edge_caching_enabled": false,
      "is_slice_l2_caching_enabled": false,
      "slice_configuration_range": 1024,
      "enable_caching_for_options": false,
      "enable_stale_cache": true,
      "l2_region": null
  }
}

Copie o ID da configuração de cache recebido na resposta.
Execute a seguinte requisição POST para criar uma regra na Request Phase, substituindo o valor do ID da application e o ID de configuração de cache que você recebeu na resposta anterior:

curl --location --globoff 'https://api.azionapi.net/edge_applications/<application_id>/rules_engine/request/rules' --header 'Accept: application/json; version=3' --header 'Authorization: Token [TOKEN VALUE]' --header 'Content-Type: application/json' --data '{
  "name": "ImgProcessor",
  "behaviors": [
      {
          "name": "set_cache_policy",
          "target": "<cache_settings_id>"
      },
      {
          "name": "optimize_images",
          "target": null
      }
  ],
  "criteria": [
      [
          {
              "variable": "${request_uri}",
              "operator": "matches",
              "conditional": "if",
              "input_value": "\.(jpg|jpeg|gif|bmp|png)"
          },
          {
              "variable": "${uri}",
              "operator": "matches",
              "conditional": "or",
              "input_value": "\.(jpg|jpeg|gif|bmp|png)$"
          }
      ]
  ]
}'

Você receberá a seguinte resposta:

{
  "results": {
      "id": <rule_id>,
      "name": "ImgProcessor",
      "phase": "request",
      "behaviors": [
          {
              "name": "set_cache_policy",
              "target": "132186"
          },
          {
              "name": "optimize_images",
              "target": null
          }
      ],
      "criteria": [
          [
              {
                  "variable": "${request_uri}",
                  "operator": "matches",
                  "conditional": "if",
                  "input_value": "\.(jpg|jpeg|gif|bmp|png)"
              },
              {
                  "variable": "${uri}",
                  "operator": "matches",
                  "conditional": "or",
                  "input_value": "\.(jpg|jpeg|gif|bmp|png)$"
              }
          ]
      ],
      "is_active": true,
      "order": 3,
      "description": null
  }
}

Para confirmar se sua imagem está sendo otimizada, inspecione a página usando seu navegador e encontre o caminho correspondente na imagem. Na query string da URL, o campo ims=VALUExVALUE corresponde à resolução carregada na página. Para ver o arquivo original, você só precisa remover a query string adicionada na URL.

Execute a seguinte requisição PATCH em seu terminal, substituindo [TOKEN VALUE] por seu personal token e a variável <application_id> por seu ID de edge application para ativar os módulos Application Accelerator e Image Processor:

curl --request PATCH --url https://api.azion.com/v4/edge_application/applications/<application_id> --header 'Accept: application/json' --header 'Authorization: Token [TOKEN VALUE]]' --header 'Content-Type: application/json' --data '{
"modules": {
  "application_accelerator": {
    "enabled": true
  },
  "image_processor": {
    "enabled": true
  }
},
"active": true,
"debug": false
}'

Você receberá uma resposta com o valor atualizado.
Execute a seguinte requisição POST em seu terminal, substituindo [TOKEN VALUE] por seu personal token e a variável <application_id> pelo id de sua application:

curl --request POST --url https://api.azion.com/v4/edge_application/applications/<application_id>/cache_settings --header 'Accept: application/json' --header 'Authorization: Token [TOKEN VALUE]' --header 'Content-Type: application/json' --data '{
"name": "QS15D img",
"browser_cache": {
  "behavior": "override",
  "max_age": 60
},
"modules": {
  "edge_cache": {
    "behavior": "override",
    "max_age": 1296000
  },
  "application_accelerator": {
    "cache_vary_by_method": [
      "options"
    ],
    "cache_vary_by_querystring": {
      "behavior": "allowlist",
      "fields": ["ims"],
      "sort_enabled": true
    },
    "cache_vary_by_cookies": {
      "behavior": "ignore",
      "cookie_names": []
    },
    "cache_vary_by_devices": {
      "behavior": "ignore"
    }
  }
}
}'

Você receberá uma resposta semelhante a esta:

{
"state": "executed",
"data": {
  "id": <cache_setting_id>,
  "name": "QS15D img",
  "browser_cache": {
    "behavior": "override",
    "max_age": 60
  },
  "modules": {
    "edge_cache": {
      "behavior": "override",
      "max_age": 1296000,
      "stale_cache": {
        "enabled": false
      },
      "large_file_cache": {
        "enabled": false,
        "offset": 1024
      }
    },
    "tiered_cache": null,
    "application_accelerator": {
      "cache_vary_by_method": [
        "options"
      ],
      "cache_vary_by_querystring": {
        "behavior": "allowlist",
        "fields": [
          "ims"
        ],
        "sort_enabled": true
      },
      "cache_vary_by_cookies": {
        "behavior": "ignore",
        "cookie_names": []
      },
      "cache_vary_by_devices": {
        "behavior": "ignore",
        "device_group": []
      }
    }
  }
}
}

Copie o ID da configuração de cache recebido na resposta.
Execute a seguinte requisição POST para criar uma regra na Request Phase, substituindo o valor do ID da application e o ID de configuração de cache que você recebeu na resposta anterior:

curl --request POST --url https://api.azion.com/v4/edge_application/applications/<application_id>/request_rules --header 'Accept: application/json' --header 'Authorization: Token [TOKEN VALUE]' --header 'Content-Type: application/json' --data '{
  "name": "ImgProcessor",
  "active": true,
  "criteria": [
    [
      {
        "variable": "${request_uri}",
        "operator": "matches",
        "conditional": "if",
        "input_value": "\.(jpg|jpeg|gif|bmp|png)"
      },
      {
        "variable": "${uri}",
        "operator": "matches",
        "conditional": "or",
        "input_value": "\.(jpg|jpeg|gif|bmp|png)$"
      }
    ]
  ],
  "behaviors": [
    {
      "type": "set_cache_settings",
      "cache_settings_id": "<cache_settings_id>"
    },
    {
      "type": "optimize_images"
    }
  ],
  "description": "Apply cache settings and optimize images"
}'

Para confirmar se sua imagem está sendo otimizada, inspecione a página usando seu navegador e encontre o caminho correspondente na imagem. Na query string da URL, o campo ims=VALUExVALUE corresponde à resolução carregada na página. Para ver o arquivo original, você só precisa remover a query string adicionada na URL.