Cross-Origin Resource Sharing (CORS) is a mechanism that uses additional HTTP headers to tell browsers to give a web application running at one origin, access to selected resources from a different origin.
它允许浏览器向跨源服务器发出XMLHttpRequest，从而克服了AJAX只能同源使用的限制。CORS也已成为主流的跨域解决方案。
浏览器将CORS跨域请求分为简单请求和非简单请求，浏览器对这两种的处理是不一样的。
只要同时满足两个条件，就属于简单请求：
(1)使用下列方法之一：
head/get/post
(2)请求的Heder是
Accept
Accept-Language
Content-Language
3）Content-Type只限于三个值：
application/x-www-form-urlencoded
multipart/form-data
text/plain
对于简单请求浏览器直接发出CORS请求，具体就是在头信息之中增加一个Origin字段。
GET /cors HTTP/1.1
Origin: http://api.bob.com
Host: api.alice.com
Accept-Language: en-US
Connection: keep-alive
User-Agent: Mozilla/5.0...
上面的头信息中，Origin字段用来说明本次请求来自哪个源（协议 + 域名 + 端口），服务器根据这个值决定是否同意这次请求。
CORS请求设置的响应头字段，都以 Access-Control-开头：
1）Access-Control-Allow-Origin：必选
它的值要么是请求时Origin字段的值，要么是一个*，表示接受任意域名的请求。
2）Access-Control-Allow-Credentials：可选
它的值是一个布尔值，表示是否允许发送Cookie。默认情况下Cookie不包括在CORS请求之中，设为true即表示服务器明确许可，Cookie可以包含在请求中一起发给服务器。这个值也只能设为true，如果服务器不要浏览器发送Cookie，删除该字段即可。
需注意的是：由于同源策略的限制，所读取的cookie为跨域请求接口所在域的cookie，而非当前页。
3）Access-Control-Expose-Headers：可选
CORS请求时，XMLHttpRequest对象的getResponseHeader()方法只能拿到6个基本字段：Cache-Control、Content-Language、Content-Type、Expires、Last-Modified、Pragma。如果想拿到其他字段，就必须在Access-Control-Expose-Headers里面指定。上面例子指定，getResponseHeader('FooBar')可以返回FooBar字段的值。
非简单请求是那种对服务器有特殊要求的请求，比如请求方法是PUT或DELETE，或者Content-Type字段的类型是application/json。非简单请求的CORS请求，会在正式通信之前，增加一次HTTP查询请求，称为"预检"请求（preflight）。
预检请求用的请求方法是OPTIONS，表示这个请求是用来询问的。请求头信息里面，关键字段是Origin，表示请求来自哪个源。除了Origin字段，预检请求的头信息包括两个特殊字段。
OPTIONS /cors HTTP/1.1
Origin: http://api.bob.com
Access-Control-Request-Method: PUT
Access-Control-Request-Headers: X-Custom-Header
Host: api.alice.com
Accept-Language: en-US
Connection: keep-alive
User-Agent: Mozilla/5.0..
1）Access-Control-Request-Method：必选
用来列出浏览器的CORS请求会用到哪些HTTP方法，上例是PUT。
2）Access-Control-Request-Headers：可选
该字段是一个逗号分隔的字符串，指定浏览器CORS请求会额外发送的头信息字段，上例是X-Custom-Header。
服务器收到预检请求，检查了Origin、Access-Control-Request-Method和Access-Control-Request-Headers字段以后，确认允许跨源请求，就可以做出回应。
HTTP回应中，除了关键的是Access-Control-Allow-Origin字段，其他CORS相关字段如下：
1）Access-Control-Allow-Methods：必选
它的值是逗号分隔的一个字符串，表明服务器支持的所有跨域请求的方法。注意，返回的是所有支持的方法，而不单是浏览器请求的那个方法，这是为了避免多次预检请求。
2）Access-Control-Allow-Headers
如果浏览器请求包括Access-Control-Request-Headers字段，则Access-Control-Allow-Headers字段是必需的。它也是一个逗号分隔的字符串，表明服务器支持的所有头信息字段，不限于浏览器在预检中请求的字段。
3）Access-Control-Allow-Credentials：可选
该字段与简单请求时的含义相同。
4）Access-Control-Max-Age：可选
用来指定本次预检请求的有效期，单位为秒。
普通跨域请求只服务端设置Access-Control-Allow-Origin即可，前端无须设置。若要带cookie请求，前后端都需要设置。
1、 前端设置：
1.）原生ajax
// 前端设置是否带cookie
xhr.withCredentials =true;
示例代码：
var xhr = new XMLHttpRequest();
// 前端设置是否带cookie
xhr.withCredentials =true;
xhr.open('post', 'http://www.domain2.com:8080/login', true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xhr.send('user=admin');
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
alert(xhr.responseText);
}
};
2.）jQuery ajax
$.ajax({
...
xhrFields: {
withCredentials: true // 前端设置是否带cookie
},
crossDomain: true, // 会让请求头中包含跨域的额外信息，但不会含cookie
...
});
3.）vue框架
a.) axios设置：
axios.defaults.withCredentials = true
b.) vue-resource设置：
Vue.http.options.credentials = true
2、 服务端设置：
若后端设置成功，前端浏览器控制台则不会出现跨域报错信息，反之，说明没设成功。
1.）Java后台：
/*
* 导入包：import javax.servlet.http.HttpServletResponse;
* 接口参数中定义：HttpServletResponse response
*/
// 允许跨域访问的域名：若有端口需写全（协议+域名+端口），若没有端口末尾不用加'/'
response.setHeader("Access-Control-Allow-Origin", "http://www.domain1.com");
// 允许前端带认证cookie：启用此项后，上面的域名不能为'*'，必须指定具体的域名，否则浏览器会提示
response.setHeader("Access-Control-Allow-Credentials", "true");
// 提示OPTIONS预检时，后端需要设置的两个常用自定义头
response.setHeader("Access-Control-Allow-Headers", "Content-Type,X-Requested-With");
2.）Nodejs后台示例：
var http = require('http');
var server = http.createServer();
var qs = require('querystring');
server.on('request', function(req, res) {
var postData = '';
// 数据块接收中
req.addListener('data', function(chunk) {
postData += chunk;
});
// 数据接收完毕
req.addListener('end', function() {
postData = qs.parse(postData);
// 跨域后台设置
res.writeHead(200, {
'Access-Control-Allow-Credentials': 'true', // 后端允许发送Cookie
'Access-Control-Allow-Origin': 'http://www.domain1.com', // 允许访问的域（协议+域名+端口）
/*
* 此处设置的cookie还是domain2的而非domain1，因为后端也不能跨域写cookie(nginx反向代理可以实现)，
* 但只要domain2中写入一次cookie认证，后面的跨域接口都能从domain2中获取cookie，从而实现所有的接口都能跨域访问
*/
'Set-Cookie': 'l=a123456;Path=/;Domain=www.domain2.com;HttpOnly' // HttpOnly的作用是让js无法读取cookie
});
res.write(JSON.stringify(postData));
res.end();
});
});
server.listen('8080');
console.log('Server is running at port 8080...');
cors要允许*.qq.com访问怎么设置？有一个a.qq.com的图片发到百度贴吧上，会不会带上那个cookie？
能说说同源策略吗，那如果是直接请求ip会有同源策略吗，如果一个域名对应多个ip的情况呢？
