35 pontos por xguru 2022-09-22 | 2 comentários | Compartilhar no WhatsApp

O que é preflight de CORS?

  • Antes de enviar uma solicitação complexa, faz-se primeiro uma requisição OPTIONS para verificar se há permissão
  • Mas, na prática, a maioria das solicitações precisa disso (por ter corpo JSON/XML, incluir credenciais etc.)
  • O problema disso é que aumenta o tempo necessário para a solicitação real
    • Requisições OPTIONS não podem ser armazenadas em cache por padrão, então os CDNs normalmente também não as processam em cache, fazendo com que a requisição chegue até o servidor
    • Esses valores são armazenados em cache no cliente e, por padrão, duram apenas 5 segundos
      • Ou seja, se uma página web faz polling da API a cada 10 segundos, haverá um preflight a cada 10 segundos
    • Em muitos casos, isso aumenta a latência da API no cliente do navegador, fazendo com que, do ponto de vista do usuário, o desempenho caia pela metade
    • Além disso, gera carga desnecessária no servidor de API e aumenta os custos
    • Especialmente em serverless. Lambda, Netlify Functions, Cloudflare Workers e Google Cloud Functions cobram por invocação de função, e esse preflight também entra nessa conta

Como armazenar em cache a resposta de preflight

  • Fazer o cache no navegador para evitar o envio de solicitações de preflight idênticas e desnecessárias
  • Fazer o cache na camada de CDN para que essas requisições sejam respondidas sem que o servidor de backend real precise processá-las

Cache de CORS para navegadores

  • Adicione o seguinte cabeçalho à resposta de preflight: Access-Control-Max-Age: 86400
  • O Firefox permite até 86400 (24 horas), mas em navegadores baseados em Chromium o valor máximo é 7200 (2 horas)

Cache de CORS para CDNs

  • Para fazer cache em um CDN ou proxy, adicione os seguintes cabeçalhos
    Cache-Control: public, max-age=86400
    Vary: origin
  • O importante é que OPTIONS não é armazenado em cache por padrão, então isso não é parte do padrão. Ainda assim, a maioria dos CDNs oferece suporte

Exemplos de configuração

  • Caching CORS with AWS Lambda
  • Caching CORS in Node.js
  • Caching CORS in Python
  • Caching CORS with Java Spring

2 comentários

 
nicewook 2022-09-23

Eu estava vendo justamente essa parte e achei bem interessante.

 
kofmania 2022-09-22

O desempenho foi reduzido pela metade -> O desempenho foi reduzido à metade