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 相关文章推荐
ExtJs使用IFrame的实现代码
Mar 24 Javascript
使用jquery清空、复位整个输入域
Apr 02 Javascript
基于jQuery实现响应式圆形图片轮播特效
Nov 25 Javascript
大型JavaScript应用程序架构设计模式
Jun 29 Javascript
AngularJS Select(选择框)使用详解
Jan 18 Javascript
jQuery异步提交表单实例
May 30 jQuery
在Vue组件化中利用axios处理ajax请求的使用方法
Aug 25 Javascript
记录一次完整的react hooks实践
Mar 11 Javascript
回顾Javascript React基础
Jun 15 Javascript
Vue发布项目实例讲解
Jul 17 Javascript
vue 中 命名视图的用法实例详解
Aug 14 Javascript
Vue表单控件数据绑定方法详解
Feb 05 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函数in_array()使用详解
2014/08/20 PHP
php curl抓取网页的介绍和推广及使用CURL抓取淘宝页面集成方法
2015/11/30 PHP
Yii2框架中一些折磨人的坑
2019/12/15 PHP
Js+XML 操作
2006/09/20 Javascript
如何在Mozilla Gecko 用Javascript加载XSL
2007/01/09 Javascript
javascript[js]获取url参数的代码
2007/10/17 Javascript
JavaScript CSS修改学习第三章 修改样式表
2010/02/19 Javascript
JavaScript对象链式操作代码(jquery)
2010/07/04 Javascript
javascript中获取下个月一号,是星期几
2012/06/01 Javascript
javascript动态加载二
2012/08/22 Javascript
JS取request值以及自动执行使用示例
2014/02/24 Javascript
jquery实现的美女拼图游戏实例
2015/05/04 Javascript
JavaScript使用DeviceOne开发实战(二) 生成调试安装包
2015/12/01 Javascript
javascript实现label标签跳出循环操作
2016/03/06 Javascript
JavaScript中绑定事件的三种方式及去除绑定
2016/11/05 Javascript
Vue.js第三天学习笔记(计算属性computed)
2016/12/01 Javascript
原生Javascript插件开发实践
2017/01/09 Javascript
Vue 父子组件、组件间通信
2017/03/08 Javascript
vue cli升级webapck4总结
2018/04/04 Javascript
jQuery中的for循环var与let的区别
2018/04/21 jQuery
layui 表格的属性的显示转换方法
2018/08/14 Javascript
使用validate.js实现表单数据提交前的验证方法
2018/09/04 Javascript
ES6 Map结构的应用实例分析
2019/06/26 Javascript
IE11下CKEditor在Bootstrap Modal中下拉问题的解决
2019/09/25 Javascript
vue 实现websocket发送消息并实时接收消息
2019/12/09 Javascript
Vue watch响应数据实现方法解析
2020/07/10 Javascript
微信小程序实现购物车功能
2020/11/18 Javascript
[01:04:09]DOTA2-DPC中国联赛 正赛 iG vs VG BO3 第二场 2月2日
2021/03/11 DOTA
Python2中的raw_input() 与 input()
2015/06/12 Python
让Python代码更快运行的5种方法
2015/06/21 Python
python反转列表的三种方式解析
2019/11/08 Python
使用Python和百度语音识别生成视频字幕的实现
2020/04/09 Python
史上最详细的Python打包成exe文件教程
2021/01/17 Python
教师岗位职责
2015/02/03 职场文书
2015年班级工作总结范文
2015/04/03 职场文书
2015年挂职干部工作总结
2015/05/14 职场文书