JavaScript的同源政策是互联网安全的基石,即不同源的网页之间的资源不能彼此调用彼此的资源的,判断是否同源的依据是:
协议相同,是http还是https。
域名相同,一级,二级等是否相同
端口相同,服务器默认端口是省略掉了的80端口,用其他端口则需要显式指定
而事实上为了提升网页性能,我们常常需要打破同源限制,比如单独假设图片服务器以突破浏览器同源资源请求数。
跨域请求最常用的有JSONP和CORS
JSONP
JSONP的说明见:http://www.cnblogs.com/zhouxiaohouer/p/7900602.html
CORS
现在浏览器(IE10+)基本上都支持了CORS,所以CORS的关键就是服务器是否定义了CORS的接口,所谓接口无非就是是否在响应头里设置了跨域许可Access-Control-Allow-Origin,
"‘Access-Control-Allow-Origin‘:‘*‘"表示允许任何客户端访问。
CORS的具体流程以浏览器的简单请求说明
在请求头里写入origin字段,标注同源信息,即协议+域名+端口,此请求到达服务器后,服务器比对origin同源信息是否在跨域许可Access-Control-Allow-Origin范围内,在的话就正常走请求流程,不在的话就返回一个错误,并且被XMLHttpRequest的onerror回调函数捕获。注意,这种错误无法通过状态码识别,因为HTTP回应的状态码有可能是200。
router.post(‘/poststh‘,(req,res,next)=>{ res.header(‘Access-Control-Allow-Origin‘, ‘*‘) console.log(req.body.filter) goodsModel.find((err,doc)=>{ if (err) { res.json({ status:1, msg:err, }) }else{ res.json({ status:0, msg:req.body.filter }) } }) })
CORS跨域的简单请求和非简单请求可以参考阮老师的文章:http://www.ruanyifeng.com/blog/2016/04/cors.html