# Corrija erros da política CORS na aplicação

**Cross-Origin Resource Sharing (CORS)** é um mecanismo que se utiliza de cabeçalhos do protocolo HTTP para dar permissão de acesso a determinados recursos que estão em uma origem diferente do documento em uso. No entanto, uma política de CORS pode bloquear a requisição de um recurso localizado em um domínio a partir de um outro domínio.

Para resolver esse erro, vamos utilizar o seguinte exemplo para guiar o passo a passo:

Domínios:

- `http://a.domain.com/` (origem)
- `http://b.domain.com/` (destino)

Mensagem de erro:

Access to XMLHttpRequest at `http://a.domain.com/page-cors-subdomain-a.txt` from origin `http://b.domain.com` has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Para resolver esse tipo de erro, você precisa configurar o browser no **Azion Console** usando o [Rules Engine](/pt-br/documentacao/produtos/build/applications/rules-engine/).

No Google Chrome, siga os passos:

1. Selecione **Ver** > **Desenvolvedor** > **Ferramentas para desenvolvedores**.
2. Selecione a aba **Network**.
3. Clique na primeira linha **page-cors-subdomain.a.html** e observe as informações de **Request URL** apresentadas no painel localizado à direita.
4. Clique em **Test CORS on click** e observe a linha vermelha na seção **Name**.
5. Posicione o cursor sobre a legenda/linha **page-cors-subdomain-a.txt** e observe o texto da tooltip.
6. Selecione **page-cors-subdomain-a.txt** e observe as informações apresentadas no painel localizado à direita.
7. Selecione a aba **Console** > **Erros** e observe, na linha de erro do CORS, os domínios de origem e de destino.

Vá para a plataforma da Azion e siga os seguintes passos:

1. Acesse o [Console](/pt-br/documentacao/produtos/guias/como-acessar-o-azion-console/) > **Applications**.
2. Selecione a aplicação do *domain A (a.domain)* > **Rules Engine**.
3. Clique no botão **Add Rule** para criar uma nova regra e selecione **Response Phase**.
4. Nomeie sua regra.
5. Selecione **Response Phase**.
6. Na seção **Criteria**, preencha os campos com os seguintes conteúdos:
    *If `${http_origin}` is equal `http://b-domain.com`* (sem terminar em `/`)
7. Na seção **Behaviors**, selecione o comportamento **Add Response Header**.
8. Preencha o campo de argumento com `Access-Control-Allow-Origin: ${http_origin}`.

Em seguida, vá para a página HTML e digite o seguinte código:

```html
#1 page-cors-subdomain-a.html
<h2>Using the XMLHttpRequest Object</h2>

<div id="demo">
<button type="button" onclick="loadXMLDoc()">Test CORS on click
</div>

<script>
function loadXMLDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
	if (this.readyState == 4 && this.status == 200) {
  	document.getElementById("demo").innerHTML =
  	this.responseText;
	}
  };
  xhttp.open("GET", "http://a.domain.com/page-cors-subdomain-a.txt", true);
  xhttp.send();
}
</script>

</body>
</html>

#2 page-cors-subdomain-a.txt
You clicked!
I belong to the domain a.
Domain b shall call me.
```

Por último, para validar que o erro foi corrigido, siga os seguintes passos:

1. No **Google Chrome**, selecione **Ver** > **Desenvolvedor** > **Ferramentas para desenvolvedores**.
2. Selecione a aba **Network**.
3. Clique na primeira linha **page-cors-subdomain.a.html** e observe as informações apresentadas no painel localizado à direita da página.
4. Clique em **Test CORS on click** e visualize a mensagem:
    `You clicked! I belong to the domain a. Domain b shall call me.`
5. Selecione a aba **Console** > **Errors** e verifique se não há erros apresentados.

Agora, a política de CORS está funcionando corretamente.

---

## Trademarks

[Chrome browser](https://www.google.com/chrome/) é uma marca registrada de Google LLC nos Estados Unidos e/ou outros países.

---