客户端的跨域访问,可以通过jsonp方式来实现,jquery提供了跨域访问的方法,
jQuery.ajax()支持get方式的跨域。当然支持跨域还需要服务器端相应的处理。
$.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/
分享到:
相关推荐
jquery下利用jsonp跨域访问实现方法.docx
本文将给您介绍如何使用getJSON来实现异步跨域提交表单
本文给大家汇总介绍了JavaScript的AJax,JQuery的AJax以及利用jsonp实现跨域访问的问题,非常的细致全面,有需要的小伙伴可以参考下。
JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题。由于同源策略,一般来说位于 server1.example.com 的网页无法与不是 server1.example.com的服务器沟通,而 HTML 的...
主要给大家介绍了关于利用jsonp解决js读取本地json跨域的问题,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
使用Jquery中的Aajx方法利用Jsonp方式访问豆瓣公开的api接口,跨域获取书籍信息。
什么是域,简单来说就是协议+域名或地址+端口,3者只要有任何一个不同就表示不在同一个域。跨域,就是在一个域中访问另一个...顾名思义,JSONP是利用JSON作为垫片,从而实现跨域请求的一种技术手段。其基本原理是利用HT
很多开发人员在使用jquery在前端和服务器端进行数据交互,所以很容易会认为在前端利用jquery就可以读取任何站点的数据了。近日在进行开 发时,因为要和第三方公司的一个项目进行数据的共享,因为考虑多不占用服务器...
JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题。由于同源策略,一般来说位于 server1.example.com 的网页无法与不是 server1.example.com的服务器沟通,而 HTML 的...
本文主要讲解了如何去解决AJAX跨域的问题,从跨域的简单原理到JONP实现模式详细的讲解整个解决方案,最后利用jQuery可以很方便的实现JSONP来进行跨域访问。
20.3 利用IE userData持久化数据 20.4 应用程序存储和离线Web应用 第21章 多媒体和图形编程 21.1 脚本化图片 21.2 脚本化音频和视频 21.3 SVG:可伸缩的矢量图形 21.4 中的图形 第22章 HTML5 API 22.1 地理位置 22.2...
20.3 利用IE userData持久化数据 20.4 应用程序存储和离线Web应用 第21章 多媒体和图形编程 21.1 脚本化图片 21.2 脚本化音频和视频 21.3 SVG:可伸缩的矢量图形 21.4 中的图形 第22章 HTML5 API 22.1 地理位置 22.2...
20.3 利用IE userData持久化数据 20.4 应用程序存储和离线Web应用 第21章 多媒体和图形编程 21.1 脚本化图片 21.2 脚本化音频和视频 21.3 SVG:可伸缩的矢量图形 21.4 中的图形 第22章 HTML5 API 22.1 地理位置 22.2...
20.3 利用ie userdata持久化数据 592 20.4 应用程序存储和离线web应用 594 第21章 多媒体和图形编程 606 21.1 脚本化图片 606 21.2 脚本化音频和视频 608 21.3 svg:可伸缩的矢量图形 615 21.4 [canvas]中的图形 623...
20.3 利用ie userdata持久化数据 592 20.4 应用程序存储和离线web应用 594 第21章 多媒体和图形编程 606 21.1 脚本化图片 606 21.2 脚本化音频和视频 608 21.3 svg:可伸缩的矢量图形 615 21.4 [canvas]中的图形 623...
20.3 利用ie userdata持久化数据 592 20.4 应用程序存储和离线web应用 594 第21章 多媒体和图形编程 606 21.1 脚本化图片 606 21.2 脚本化音频和视频 608 21.3 svg:可伸缩的矢量图形 615 21.4 [canvas]中的图形 623...