Using Cors to implement POST method to request data across domains

Cors Full name Cross-origin Resource sharing, as the name suggests: cross-domain sharing of resources, this is the cross-site resource sharing standard established by the consortium.

At present, including ie10+, Chrome, Safari, FF have provided the XMLHttpRequest object to the standard support, in the older IE8 provided Xdomainrequest object, partially achieved the standard;

Here is the code to create the request object:

var url = "http://www.111cn.net/1.php";

if (XMLHttpRequest) {
var req = new XMLHttpRequest ();
Use the Withcredentials property to determine whether Cross-domain requests are supported
if (! () Withcredentials "in req)" {//The first-instance of the consortium
if (window. Xdomainrequest) {
req = new Xdomainrequest ();
}
}
Req.open (' POST ', url, true);
Req.onload = function (data) {
alert (This.responsetext);
};
Req.send ();
}

Note the Xdomainrequest object supports only HTTP and HTTPS protocols

An options sniffer is sent before a POST request is made using the XMLHttpRequest object to determine if there is a cross-domain request, and a Origin message is brought to the header header to indicate the source site information. Whether the value of the Access-control-allow-origin header needs to be matched with the origin information when the server responds.

Header ("Access-control-allow-origin:http://localhost"); * For all domain names

The disadvantage of cors is that you must be able to control server-side permissions, allowing you to access across domains

Setting up cors to implement cross domain requests

First, the use of PHP code to achieve

#
# CORS config for PHP
# Code by anrip[mail@anrip.com]
#

function make_cors ($origin = ' * ') {

$request _method = $_server[' Request_method '];

if ($request _method = = ' OPTIONS ') {

Header (' Access-control-allow-origin: '. $origin);
Header (' access-control-allow-credentials:true ');
Header (' Access-control-allow-methods:get, POST, OPTIONS ');

Header (' access-control-max-age:1728000 ');
Header (' Content-type:text/plain charset=utf-8 ');
Header (' content-length:0 ', true);

Header (' status:204 ');
Header (' http/1.0 204 No Content ');

}

if ($request _method = = ' POST ') {

Header (' Access-control-allow-origin: '. $origin);
Header (' access-control-allow-credentials:true ');
Header (' Access-control-allow-methods:get, POST, OPTIONS ');

}

if ($request _method = = ' Get ') {

Header (' Access-control-allow-origin: '. $origin);
Header (' access-control-allow-credentials:true ');
Header (' Access-control-allow-methods:get, POST, OPTIONS ');

}

}

Second, using Nginx configuration implementation

# CORS config for Nginx
# Code by anrip[mail@anrip.com]
#

Location/{

Set $origin ' * ';

if ($request _method = ' OPTIONS ') {

Add_header ' Access-control-allow-origin ' $origin;

#
# Om Nom Nom cookies
#
Add_header ' access-control-allow-credentials ' true;
Add_header ' Access-control-allow-methods ' Get, POST, OPTIONS ';

#
# Custom headers and headers various browsers *should* is OK with but aren ' t
#
Add_header ' Access-control-allow-headers ' Dnt,x-mx-reqtoken,keep-alive,user-agent,x-requested-with, If-modified-since,cache-control,content-type ';

#
# Tell client, this, pre-flight info is valid for
#
Add_header ' Access-control-max-age ' 1728000;
Add_header ' Content-type ' Text/plain charset=utf-8 ';
Add_header ' content-length ' 0;

return 204;

}

if ($request _method = ' POST ') {

Add_header ' Access-control-allow-origin ' $origin;
Add_header ' access-control-allow-credentials ' true;
Add_header ' Access-control-allow-methods ' Get, POST, OPTIONS ';
Add_header ' Access-control-allow-headers ' Dnt,x-mx-reqtoken,keep-alive,user-agent,x-requested-with, If-modified-since,cache-control,content-type ';

}

if ($request _method = ' get ') {

Add_header ' Access-control-allow-origin ' $origin;
Add_header ' access-control-allow-credentials ' true;
Add_header ' Access-control-allow-methods ' Get, POST, OPTIONS ';
Add_header ' Access-control-allow-headers ' Dnt,x-mx-reqtoken,keep-alive,user-agent,x-requested-with, If-modified-since,cache-control,content-type ';

}

}