jquery下利用jsonp跨域访问实现方法


Posted in Javascript onJuly 29, 2010
$.ajax({ 
async:false, 
url: '', // 跨域URL 
type: 'GET', 
dataType: 'jsonp', 
jsonp: 'jsoncallback', //默认callback 
data: mydata, //请求数据 
timeout: 5000, 
beforeSend: function(){ //jsonp 方式此方法不被触发。原因可能是dataType如果指定为jsonp的话,就已经不是ajax事件了 
}, 
success: function (json) { //客户端jquery预先定义好的callback函数,成功获取跨域服务器上的json数据后,会动态执行这个callback函数 
if(json.actionErrors.length!=0){ 
alert(json.actionErrors); 
} }, 
complete: function(XMLHttpRequest, textStatus){ 
}, 
error: function(xhr){ 
//jsonp 方式此方法不被触发 
//请求出错处理 
alert("请求出错(请检查相关度网络状况.)"); 
} 
});

$.getJSON(url+"?callback=?", 
function(json){ });

这种方式其实是上例$.ajax({..}) 的一种高级封装。

在服务端通过获得callback参数(如:jsonp*****)得到jQuery端随后要回调的
然后返回类似:"jsonp*****("+要返回的json数组+")";
jquery就会通过回调方法动态加载调用这个:jsonp*****(json数组);
这样就达到了跨域数据交换的目的.

JSONP是一种脚本注入(Script Injection)行为,所以也有一定的安全隐患。

注意:jquey是不支持post方式跨域的。
参考:http://www.ibm.com/developerworks/cn/web/wa-aj-jsonp1/

Javascript 相关文章推荐
List Information About the Binary Files Used by an Application
Jun 11 Javascript
使用jquery+CSS实现控制打印样式
Dec 31 Javascript
javascript 对象数组根据对象object key的值排序
Mar 09 Javascript
jquery 中ajax执行的优先级
Jun 22 Javascript
推荐阅读的js快速判断IE浏览器(兼容IE10与IE11)
Dec 13 Javascript
JavaScript中数组添加值和访问值常见问题
Feb 06 Javascript
使用bootstrapValidator插件进行动态添加表单元素并校验
Sep 28 Javascript
微信小程序  modal详解及实例代码
Nov 09 Javascript
JS基于递归实现倒计时效果的方法
Nov 26 Javascript
Vue2.0 实现歌手列表滚动及右侧快速入口功能
Aug 08 Javascript
通过js给网页加上水印背景实例
Jun 17 Javascript
小程序实现录音功能
Sep 22 Javascript
jquery-easyui关闭tab自动切换到前一个tab
Jul 29 #Javascript
jquery 图片轮换效果
Jul 29 #Javascript
jQuery的写法不同导致的兼容性问题的解决方法
Jul 29 #Javascript
基于jQuery制作迷你背词汇工具
Jul 27 #Javascript
IE之动态添加DOM节点触发window.resize事件
Jul 27 #Javascript
js操作二级联动实现代码
Jul 27 #Javascript
jquery.jstree 增加节点的双击事件代码
Jul 27 #Javascript
You might like
php实现Mongodb自定义方式生成自增ID的方法
2015/03/23 PHP
php调用KyotoTycoon简单实例
2015/04/02 PHP
php通过前序遍历树实现无需递归的无限极分类
2015/07/10 PHP
浅谈PHP实现大流量下抢购方案
2017/12/15 PHP
Z-Blog中用到的js代码
2007/03/15 Javascript
javaScript Array(数组)相关方法简述
2009/07/25 Javascript
基于jQuery的消息提示插件之旅 DivAlert(三)
2010/04/01 Javascript
extjs表格文本启用选择复制功能具体实现
2013/10/11 Javascript
js/jquery去掉空格,回车,换行示例代码
2013/11/05 Javascript
AngularJS入门教程(二):AngularJS模板
2014/12/06 Javascript
简介JavaScript中的italics()方法的使用
2015/06/08 Javascript
全面解析Bootstrap表单使用方法(表单控件)
2015/11/24 Javascript
举例讲解如何判断JavaScript中对象的类型
2016/04/22 Javascript
第五章之BootStrap 栅格系统
2016/04/25 Javascript
NodeJS中的MongoDB快速入门详细教程
2016/11/11 NodeJs
jquery实现拖动效果(代码分享)
2017/01/25 Javascript
基于cookie实现zTree树刷新后展开状态不变
2017/02/28 Javascript
基于vue打包后字体和图片资源失效问题的解决方法
2018/03/06 Javascript
NodeJS父进程与子进程资源共享原理与实现方法
2018/03/16 NodeJs
快速解决brew安装特定版本flow的问题
2018/05/17 Javascript
Express之托管静态文件的方法
2018/06/01 Javascript
Node.js log4js日志管理详解
2018/07/31 Javascript
[59:32]Liquid vs Fnatic 2019国际邀请赛淘汰赛败者组BO1 8.20.mp4
2020/07/19 DOTA
Python从MP3文件获取id3的方法
2015/06/15 Python
python实现上传文件到linux指定目录的方法
2020/01/03 Python
mac在matplotlib中显示中文的操作方法
2020/03/06 Python
用Python开发app后端有优势吗
2020/06/29 Python
Python安装第三方库攻略(pip和Anaconda)
2020/10/15 Python
python 中关于pycharm选择运行环境的问题
2020/10/31 Python
CSS3动画animation实现云彩向左滚动
2014/05/09 HTML / CSS
惠普新加坡官方商店:HP Singapore
2020/04/17 全球购物
英语硕士生求职简历的自我评价
2013/10/15 职场文书
个人职业生涯规划书1500字
2013/12/31 职场文书
tomcat的catalina.out日志按自定义时间格式进行分割的操作方法
2022/04/02 Servers
Spring Cloud OAuth2实现自定义token返回格式
2022/06/25 Java/Android
vue递归实现树形组件
2022/07/15 Vue.js