CORS (Cross-Origin Resource Sharing em Inglês e Compartilhamento de recursos de origem cruzada em português) é um acordo sobre como trocar recursos entre browser e servidor quando o browser tenta aceder a um domínio diferente daquele em que está a navegar.
É um conjunto de regras, uma especificação da W3C, para que tipo de recursos podem ser acedidos, e como os limitar. Estas regras são implementadas pelos browsers/navegadores, e é este (o browser) que limita o acesso.
Estas regras impuseram-se por razões de segurança. Para evitar que scripts na página possam aceder livremente e fazer pedidos a outros sites e interagir com eles.
Na parte do servidor pode ou não "abrir-se" a porta a um, vários ou todos os pedidos/domínios. Esta implementação é específica da linguagem mas no fundo implica que haja headers presentes que o browser possa ler:
Access-Control-Allow-Origin: * // <- aberto para todos
Access-Control-Allow-Origin: http://example.com:8080 http://foo.example.com // <- só estes dois dominios podem aceder
Em relação ao erro:
XMLHttpRequest cannot load http://localhost/. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://127.0.0.1' is therefore not allowed access.
Quando o browser lê no url por exemplo http:
ele assume que é um url externo. Na verdade http://localhost/
devia ser interpretado como "mesmo domínio" mas por causa do http
o browser pensa que não é... Para resolver esse problema, que se aplica também em domínios online, deve usar-se caminhos relativos, e não absolutos com http... etc
.
Mais leitura:
. Wikipedia: https://pt.wikipedia.org/wiki/Cross-origin_resource_sharing
. W3C: https://www.w3.org/TR/cors/ Em Inglês
. MDN: https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS Em Inglês