Erro XML jQuery: "Nenhum cabeçalho 'Access-Control-Allow-Origin' está presente no recurso solicitado"

Ao tentar acessar um arquivo XML localizado em um domínio diferente usando jQuery, você poderá encontrar a mensagem de erro: "Nenhum cabeçalho 'Access-Control-Allow-Origin' está presente no recurso solicitado." Este erro ocorre devido à Política de Mesma Origem, que restringe chamadas AJAX de origem cruzada.

Compreendendo a Política de Mesma Origem

A Política de Mesma Origem impõe que os navegadores da web permitem apenas chamadas AJAX para serviços hospedados no mesmo domínio da página HTML que faz a solicitação. No exemplo dado, a página HTML está hospedada em http://run.jsbin.com/, enquanto o arquivo XML está localizado em http://www.ecb.europa.eu/, resultando em uma solicitação de origem cruzada que é bloqueado pelo navegador.

Habilitando solicitações de origem cruzada (CORS)

Para permitir solicitações de origem cruzada, um servidor deve incluir cabeçalhos apropriados em sua resposta. Um desses cabeçalhos é o cabeçalho Access-Control-Allow-Origin, que especifica as origens que têm permissão para acessar o recurso.

No caso do arquivo XML, o servidor do BCE não fornece o CORS necessário cabeçalhos, daí a mensagem de erro. Para resolver isso, o servidor precisaria ser configurado para incluir os seguintes cabeçalhos:

Access-Control-Allow-Origin: http://run.jsbin.com
Access-Control-Allow-Methods: GET
Access-Control-Allow-Headers: Content-Type

Nota sobre solicitações de comprovação

Em certos casos, como ao fazer solicitações POST com cabeçalhos não simples, o o navegador pode executar uma solicitação de simulação OPTIONS para determinar se o servidor oferece suporte a CORS para a solicitação específica. Se a resposta do servidor a esta solicitação de simulação não contiver os cabeçalhos CORS apropriados, a solicitação principal falhará com a mesma mensagem de erro. Portanto, é importante incluir os cabeçalhos necessários nas respostas tanto à simulação quanto às solicitações principais.