=波波日志 > JavaScript/Ajax > jQuery jsonp跨域原理=

jQuery jsonp跨域原理

  实际上单jQuery还是实现不了跨域加载数据的,由于XMLHttpRequest的安全设置,是不允许直接跨域的。jQuery的jsonp虽然能跨域,但是还得请求的页面支持才行,如果请求的页面不理会jQuery发送的参数,是无法跨域的,实际上来说是获取不到输出的页面内容。

  jQuery jsonp跨域原理实际就是使用script标签加载配置对象中的跨域url,再使用script标签加载之前,会在客户端中注册一个新的函数作为回调函数提供给跨域页面使用,然后将函数名称替换掉url中jsoncallback=?后面的问号,最后请求的页面获取发送的回调函数名称,输出类似“回调函数名称(json数据)”的JavaScript代码来执行回调函数,参数为json数据。和代理意义差不多,jsonp需要代理页面输出执行回调函数的js代码。

  通过jQuery的跨域原来我们知道,如果跨域页面不理会回调函数,不执行它,那么就无法获取到跨域页面输出的json函数,甚至可能会出现脚本错误,因为是使用script来加载跨域页面。
  
  下面是一个jQuery jsonp跨域调用

test.html
+展开
-HTML
<script type="text/javascript" src="jquery-1.4.2.min.js"></script> 
<script type="text/javascript">
$.getJSON('http://www.code-design.cn/json.asp?jsoncallback=?',//请求另外一个跨跨域的页面
function(data){
 alert(data.name)
});</script>

  上面的代码中,实际请求的页面类似http://www.code-design.cn/json.asp?jsoncallback=jsonp1279531004015,后面一长串的数字为jQuery动态加上的。

json.asp
+展开
-VBScript

'输出js脚本执行jQuery注册回调函数,参数为json对象
'如果我们不理会jq发送的回调函数名称,而是直接输出json数据,这样是获取不到json数据的
response.write request.querystring("jsoncallback")&"({name:'showbo'})"

  
类别:JavaScript/Ajax 作者:波波 日期:2010-07-19 【评论:0】 
 
暂时没有评论!
发表留言
  • *昵称:
  • 头像:
  • 电子邮件: [留下您的邮件,方便管理员回复您。]
  • 个人网站: *验证码:
声明:本网站尊重并保护知识产权,根据《信息网络传播权保护条例》,如果我们转载或引用的作品侵犯了您的权利,请通知我们,我们会及时删除!
Powered by showbo,©2012WEB编程网桂ICP备05005887号 京公网安备1101055090