JQuery Ajax 跨域访问不能返回数据问题

时间:2015-12-11
简介:WEB前端|我们知道ajax本身实际上是通过XMLHttpRequest对象来异步进行数据的交互,而浏览器出于安全考虑,不允许js代码进行跨域操作,所以js跨域操作会被拒绝

我们知道ajax本身实际上是通过XMLHttpRequest对象来异步进行数据的交互,而浏览器出于安全考虑,不允许js代码进行跨域操作,所以js跨域操作会被拒绝。

具体情况有: 
一、本域和子域的相互访问: http://www.ablanxue.com/和http://wap.ablanxue.com/
二、本域和其他域的相互访问: http://www.aa.com/和http://www.bb.com/ 用 iframe 
三、本域和其他域的相互访问: http://www.aa.com/和http://www.bb.com/ 用 XMLHttpRequest访问代理 
四、本域和其他域的相互访问: http://www.aa.com/和http://www.bb.com/ 用 JS创建动态脚本

今天主要讨论第4中解决方案,这个和上个的区别就是请求是使用<script>标签来请求的,这个要求也是两个域都是由你来开发才行。原理就是JS文件注入,在本域内的a内生成一个JS标签,它的SRC指向请求的另外一个域的某个页面b,b返回数据即可,可以直接返回JS的代码。因为script的src属性是可以跨域的。

这里我们需要用到JQuery.getScript(url, callback)方法,url是脚本文件的URL路劲,callback函数在脚本资源已被加载和求值后调用的回调函数。

首先在bb.com创建一个js文件,test.js 

1 var ojb = {msg:'js跨域请求成功'};

然后在aa.com的页面上使用$.getScript加载test.js脚本 

1 $(function() { 
2 $.getScript('http://www.bb.com/test.js', function() { 
3 if (ojb) { 
4 alert(obj.msg); 
5 } 
6 }); 
7 }); 

使用$.getScript函数的最大好处就是可以保证,脚本加载完毕后调用回调函数。 

个人感觉这种方法比使用代理和iframe要简单一些。

TAGS:JQuery Ajax 跨域访问

上一编:jquery背景图片全屏插件(Full Size Background Image)

下一编:jQuery.data( )方法与内存泄漏问题

New Hot