什么情况下会遇到跨域的问题?
前端做数据交互,比如在数据获取的时候经常会遇到跨域的问题。
- 跨域
跨域是指一个域下的文档或脚本试图请求另一个域下的资源。
广义跨域有以下的情况:
(1) 资源跳转:a链接,表单提交;
(2) 资源嵌入:link标签、script标签、img标签等dom标签,还有样式中background:url()等文件外链;
(3) 脚本请求:js发起的ajax请求、dom和js对象的跨域操作。
我们经常所遇到的跨域往往是狭义跨域,即由浏览器同源策略限制的一类请求场景。
同源策略:同源指“协议+域名+端口”三者全部相同;是浏览器最核心最基本的安全功能,如果缺少了同源策略,那么浏览器很容易受到XSS、CSFR等攻击。 - 跨域解决方案
(1) 通过json跨域
我们可以通过动态去创建script,再请求一个带参网址实现跨域通信;
jquery ajax:
$.ajax({
url:'http://www.xxx.com',
type:'get',
datatype:'jsonp',
//自定义回调函数
jsonpCallback:'dataCallback'
data:{ }
})
注意jsonp的缺点:只能实现get一种请求。
(2) WebSocket协议跨域
WebSocket protocol是HTML5一种新的协议,实现了浏览器与服务器全双工通信,同时允许跨域通信。