Neste artigo
O que e CORS?
Cross-Origin Resource Sharing (CORS) e um mecanismo de seguranca do navegador que controla quais origens web podem aceder aos recursos do seu servidor. Por defeito, os navegadores aplicam a politica de mesma origem, bloqueando pedidos JavaScript para um dominio, porta ou protocolo diferente.
Os cabecalhos CORS indicam ao navegador quais pedidos cross-origin permitir. Sem os cabecalhos corretos, chamadas API de um frontend num dominio para um backend noutro falharao com um erro CORS. Um gerador de cabecalhos CORS cria os cabecalhos Access-Control-Allow-* corretos.
Como funcionam os cabecalhos CORS
CORS funciona atraves de um conjunto de cabecalhos de resposta HTTP que o servidor envia para indicar quais origens, metodos e cabecalhos sao permitidos.
- Access-Control-Allow-Origin — especifica quais origens podem aceder ao recurso (um dominio especifico ou * para qualquer origem)
- Pedidos preflight — para pedidos nao simples, os navegadores enviam primeiro um pedido OPTIONS para verificar se o pedido real e permitido
- Tratamento de credenciais — Access-Control-Allow-Credentials: true permite cookies e cabecalhos de autenticacao, mas requer uma origem especifica
Experimente gratuitamente — sem cadastro
Gerar cabecalhos CORS →Quando configurar CORS
A configuracao CORS e necessaria quando o frontend e backend sao servidos a partir de origens diferentes.
- Desenvolvimento API — APIs REST ou GraphQL acedidas por apps frontend em dominios diferentes precisam de cabecalhos CORS
- Configuracao CDN — servir assets estaticos a partir de um subdominio CDN requer CORS para ficheiros de fontes e pedidos API
- Microsservicos — servicos a correr em portas diferentes durante o desenvolvimento local precisam de CORS para comunicar atraves do navegador
Perguntas frequentes
Porque nao posso usar Access-Control-Allow-Origin: * para tudo?
O wildcard * permite qualquer origem, o que e adequado para APIs publicas. No entanto, nao pode ser usado com credenciais (cookies, cabecalhos Authorization). Se a sua API requer autenticacao, deve especificar a origem exata.
O que e um pedido preflight?
Um preflight e um pedido HTTP OPTIONS que o navegador envia automaticamente antes do pedido real. Verifica se o servidor permite o metodo, os cabecalhos e a origem.
Como corrijo o erro 'No Access-Control-Allow-Origin header'?
Adicione o cabecalho Access-Control-Allow-Origin a resposta do seu servidor com o dominio da origem solicitante. Para Express use o middleware cors, para Nginx adicione diretivas add_header.