跨域定义:
当前页面中的某个接口请求的地址和当前页面的地址如果协议、域名、端口其中有一项不同,就说该接口跨域了。
跨域限制的原因:浏览器为了保证网页的安全,出的同源协议策略。
解决方式:
cors(后端设置)
CORS 全称 Cross-Origin Resource Sharing,即跨域资源共享。
CORS 是一种基于 HTTP Header 的机制,该机制通过允许服务器标示除了它自己以外的其它域。服务器端配合浏览器实现 CORS 机制,可以突破浏览器对跨域资源访问的限制,实现跨域资源请求。
过程:
- 如果是简单请求,浏览器会直接发出正常请求;
- 如果是复杂请求,浏览器会进行预检,根据服务器的响应头是否包含关键字段决定是否接受响应;
- 服务器会根据已有的域配置决定是否在响应头里面加入关键字段。
服务器
jsonp(前后端配合)
jsonp的核心则是动态添加script标签来调用服务器提供的js脚本。
src不受同源策略的限制
过程:
前端将回调函数作为参数拼接在url中。后端收到请求,调用该回调函数,并将数据作为参数返回去。
注意:
- jsonp只支持get请求而不支持post请求
node中间件、nginx反向代理
跨域限制的时候浏览器不能跨域访问服务器,node中间件和nginx反向代理,都是让请求发给代理服务器,静态页面面和代理服务器是同源的,然后代理服务器再向后端服务器发请求,服务器和服务器之间不存在同源限制。