什么是AJAX跨域
发生AJAX跨域的条件
- 先看协议是否一致
- 再看地址是否一致,注意在浏览器上127.0.0.1和localhost不是一个地址
- 最后看端口号是否一致。
跨域的原理
我们发现Web页面上调用js文件时则不受是否跨域的影响,拥有“src”这个属性的标签都却拥有跨域的能力,比如<\script>、<\img>、<\iframe>。那么跨域访问数据就有了一种可能,那就是在远程服务器上设法把数据装进js格式的文件里,供客户端调用和进一步处理。
JSONP实现跨域
对于AJAX异步请求的方式要实现跨域可以在ajax方法里加一个dataType:'jsonp’即可实现跨域,不过此跨域是以指向js中src的方式指向后台地址,要在浏览器中成功响应数据并回显一些效果,此时的success方法失效了,但后台可以传递js格式的数据,因此可以在前端写对应的函数及实现逻辑,后台接收这个函数及赋予数据,浏览器即可成功响应数据。
但这种方式还是不太友好,为了前端也更好的使用,可以在ajax方法里加个jsonp属性,属性值是一个方法,传给后台接收的参数,在加了jsonp后可以调用原来的success函数了,即原来的回调函数有用了。
getJSON简化跨域请求
对于上文在ajax中采用jsonp实现跨域可以采用getJSON方法进一步简化跨域请求,具体格式如下:
$.getJSON(
url,//在这里必须加jsoncallback=?
data,
function (data) {
}
)
为什么要加jsoncallback=?原因在于可以自动的生成回调函数名,将后台返回的数据响应到function函数中。