JavaScript - CORS - Cross Origin Resource Sharing
https://www.sitepoint.com/an-in-depth-look-at-cors/
// JavaScript - CORS:
Cross-Origin Resource Sharing (CORS) is a specification to allow cross-domain
communication from the browser. This is done by including a new
Access-Control-Allow-Origin HTTP header in the response.
We could add the following to a .htaccess file (assumes Apache) to permit
requests from a different origins:
Header add Access-Control-Allow-Origin "http://my-domain.com"
Header set Access-Control-Allow-Origin "*"
<?php
header("Access-Control-Allow-Origin: *")
header("Access-Control-Allow-Origin: http://example.com");
?>
Access-Control-Allow-Origin header itself does not allow multiple hosts inserted
in the header, no matter the delimiter. This means that if you want to allow a
cross-origin request from various different domains, you have to dynamically
generate your header.
<?php
$allowedOrigins = array("http://example.com", "http://localhost:63342");
$headers = getallheaders();
if ($headers["Origin"] && in_array($headers["Origin"], $allowedOrigins)) {
header("Access-Control-Allow-Origin: " . $headers["Origin"]);
}
?>
If you are running something other than Apache, look here:
http://enable-cors.org/server.html
If you open your browser’s console, you would get a message similar to:
XMLHttpRequest cannot load http://example.com. No ‘Access-Control-Allow-Origin’
header is present on the requested resource.
Internet Explorer 8 and 9 support CORS only through the XDomainRequest class.
The main difference is that instead of doing a normal instantiation with something
like var xhr = new XMLHttpRequest() you would have to use
var xdr = new XDomainRequest();.
IE 11, Edge and all recent and not-really-recent versions of Firefox, Safari, Chrome,
Opera fully support CORS. IE10 and Android’s default browser up to 4.3 only lack
support for CORS when used for images in <canvas> elements.
Some safety is maintained in the cross-origin request and the credentials (such as
cookies) are not leaked during the request-response exchange. Furthermore, if
the remote server does not specifically allow the user credentials for its website to
be included in a cross-origin request from another website and that website does
not explicitly declare it wants the user credentials to be passed to the remote server,
then the site making the request will most likely get a response that is not
personalized. This happens because the user session cookies would not go to the
request and the response will not contain data relevant to a particular logged-in
user which reduces CSRF and other exploits.
If we want to include the user credentials with the remote request, we have to do
two changes, the first in the code of the website making the request and the
second in the website receiving the request. In the website making the request
we have to set the withCredentials property of the Ajax request to true:
var xhr = new XMLHttpRequest();
xhr.withCredentials = true;
The remote server itself, besides allowing our origin, has to set an
Access-Control-Allow-Credentials header and set its value to true. Using the
numbers 1 or 0 would not work.
However, allowing the credentials to be passed to a cross-origin request is quite
dangerous, since it opens up the possibility for various attacks such as CSRF
(Cross-Site Request Forgery), XSS (Cross-Site Scripting) and an attacker could
take advantage of the user’s logged in status to take actions in the remote
server without the user knowing (such as withdrawing money if the remote
server is banking website).
Internet Explorer 8 and 9 support CORS only through the XDomainRequest class. The main difference is that instead of doing a normal instantiation with something like var xhr = new XMLHttpRequest() you would have to use var xdr = new XDomainRequest();.
IE 11, Edge and all recent and not-really-recent versions of Firefox, Safari, Chrome, Opera fully support CORS. IE10 and Android’s default browser up to 4.3 only lack support for CORS when used for images in <canvas> elements.
page revision: 5, last edited: 14 Nov 2016 20:37