Configure Cross-Origin Resource Sharing (CORS)

Cross-Origin Resource Sharing (CORS) é um mecanismo que se utiliza de cabeçalhos HTTP para dar permissão de acesso a determinados recursos que estão em uma origem diferente do documento em uso.

Um exemplo de cross-origin request é uma página HTML servida a partir de um domínio “A” que solicita um arquivo, como um CSS stylesheet ou um JavaScript, por exemplo, servido a partir de um domínio “B”. Por questões de segurança, muitos navegadores restringem cross-origin HTTP requests iniciadas por scripts.

Para permitir o CORS em uma configuração para requisições não complexas, você deve adicionar o cabeçalho Access-Control-Allow-Origin à resposta.

Já requisições HTTP complexas exigem cabeçalhos adicionais. Essas são requisições que podem envolver vários parâmetros, cabeçalhos, autenticação, corpos de requisição ou outras configurações especializadas. Qualquer requisição além de GET, POST e HEAD pode ser considerada complexa.

Habilite permissão CORS para requisições HTTP não complexas

A primeira etapa para permitir o acesso CORS é criar uma regra no Rules Engine:

  1. Acesse o Azion Console.
  2. Selecione Products Menu > Edge Application.
  3. Selecione a aplicação com a qual deseja trabalhar.
  4. Na aba Rules Engine, crie uma nova regra.
  5. Preencha os campos como no exemplo a seguir:
CampoValor
NameGET/POST/HEAD CORS
DescriptionPermite CORS para requisições GET em /sua-uri
PhaseResponse Phase
Criteria${uri} starts with /sua-uri
BehaviorAdd Response Header Access-Control-Allow-Origin: *
  1. Clique no botão Save.

Você acabou de criar uma regra para o compartilhamento de requisições não complexas com CORS.

Habilite permissão CORS para requisições HTTP complexas

No exemplo a seguir, o CORS está sendo permitido por meio do método OPTIONS. Para criar uma nova regra que permita habilitar o compartilhamento de recursos por meio de requisições complexas, siga as etapas:

  1. Acesse o Azion Console.
  2. Selecione Products Menu > Edge Application.
  3. Selecione a aplicação com a qual deseja trabalhar.
  4. Na aba Rules Engine, crie uma nova regra.
  5. Preencha os campos:
CampoValor
NameOPTIONS CORS
DescriptionPermite CORS para OPTIONS em /sua-uri e outras requisições não complexas
PhaseResponse Phase
Criteria${uri} starts with /your-uri
BehaviorAdd Response Header Access-Control-Allow-Origin: *
Add Response Header Access-Control-Allow-Headers: Content-Type, Authorization
Add Response Header Access-Control-Request-Method: POST, GET, OPTIONS, HEAD
Add Response Header Content-Type: application/json
Add Response Header Allow: POST, GET, OPTIONS, HEAD
Add Response Header Access-Control-Allow-Methods: POST, GET, OPTIONS, HEAD
  1. Clique no botão Save.

Habilite permissão CORS para origens específicas

Para ativar o CORS em uma configuração para servidores de origem específicos, você precisará ativar o módulo Application Accelerator:

  1. Acesse o Azion Console.
  2. Selecione Products menu > Edge Application.
  3. Selecione a aplicação com a qual deseja trabalhar.
  4. Na aba Main Settings, ative o módulo Application Accelerator.
  5. Clique no botão Save.

Agora você precisa criar uma regra que processe requisições de várias origens:

  1. Vá para a aba Rules Engine.
  2. Clique no botão + Rule.
  3. Preencha os campos como no exemplo a seguir, que habilita CORS para requisições complexas:
CampoValor
NameCORS para múltiplas origens
PhaseResponse Phase
Criteria${http_origin} is equal http://seu.domain1.com
OR ${http_origin} is equal http://seu.domain2.com
OR ${http_origin} is equal http://seu.domain3.com
BehaviorAdd Response Header Access-Control-Allow-Origin: *
Add Response Header Access-Control-Allow-Headers: Content-Type, Authorization
Add Response Header Access-Control-Request-Method: POST, GET, OPTIONS, HEAD
Add Response Header Content-Type: application/json
Add Response Header Allow: POST, GET, OPTIONS, HEAD
Add Response Header Access-Control-Allow-Methods: POST, GET, OPTIONS, HEAD
  1. Clique no botão Save.

Contribuidores