ajax同源
- 协议相同
- 域名相同
- 端口相同
CORS cross-origin resource sharing()
是一个w3c的标准
允许浏览器向跨源服务器,发出XMLHttpRequest请求,从而克服了AJAX只能同源使用的限制。
CORS需要浏览器和服务器同时支持
目前,所有浏览器都支持该功能
实现CORS通信的关键是服务器。只要服务器实现了CORS接口,就可以跨源通信。
简单请求(同时满足下面两种条件):
- get或者post
- Content-Type的值只能为下面三种:application/x-www-form-urlencoded、multipart/form-data、text/plain
浏览器发现这次跨源AJAX请求是简单请求,就自动在头信息之中,添加一个Origin字段
,用于请求来自哪个源(协议 + 域名 + 端口)
例如:Origin: http://api.bob.com
如果源不在许可范围内,服务器回应的头信息没有包含Access-Control-Allow-Origin字段,浏览器发现后会抛出错误,但是状态码依旧可能是200
如果源在许可范围内,服务器返回的响应,会多出几个头信息字段,这里主要说一下必须的那个字段
- Access-Control-Allow-Origin
该字段是必须的。它的值要么是请求时Origin字段的值,要么是一个*,表示接受任意域名的请求。
非简单请求
比如请求方法是PUT或DELETE,或者Content-Type字段的类型是application/json。
非简单请求的CORS请求,会在正式通信之前,增加一次HTTP查询请求,称为"预检"请求(preflight)。
预检成功,响应头会带下面几个
Access-Control-Allow-Methods: GET, POST, PUT
Access-Control-Allow-Headers: X-Custom-Header
Access-Control-Allow-Credentials: true
Access-Control-Max-Age: 1728000 // 预检成功后的有效时间 毫秒
具体解决
node express
var app = express();
app.all('*', function(req, res, next) {
res.header("Access-Control-Allow-Origin", "*"); // 这里设置请求服务器的ip
res.header("Access-Control-Allow-Headers", "X-Requested-With");
res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");
res.header("X-Powered-By",' 3.2.1')
res.header("Content-Type", "application/json;charset=utf-8");
next();
});
另外个有一个别人写好的github cors
感觉几行代码可以解决问题就不需要用工具了。