JSONP(跨域请求) —— 一种非官方跨域数据交互协议
1、JSONP的作用
由于同源策略的限制,XmlHttpRequest只允许请求当前源(域名、协议、端口)的资源,为
了实现跨域请求,可以通过script标签实现跨域请求,然后再服务器端输出JSON数据并执行回调函
数,从而解决了跨域的数据请求。
JSONP协议的一个要点:允许用户传递一个callback参数给服务器端,然后服务器端返回数据时
会将这个callback参数作为函数名来包裹住JSON数据,这样客户端就可以随意定制自己的函数来自
动处理返回函数了。
2、如何使用JSONP?
在客户端声明回调函数之后,客户端通过script标签向服务器跨域请求数据,然后服务器返回的相
应数据并动态执行回调函数
JSONP原理:
(1)首先在客户端注册一个callback,然后把callback的名字传给服务器、此时,服务器先生成
json数据
(2)然后以javascript语法的方式,放置到function中,function名字就是传递上来的参数jsonp
(3)最后将json数据直接以入参的方式,放置到function中中,这样就生成了一段js语法的文档,
返回给客户端。
eg.
<script type="text/javascript">
function jsonCallback(result){
for(var i in result){
alert(i+":"+result[i]);
}
}
var JSONP = document.createElement("script");
JSONP.type = "text/javascript";
JSONP.src = "http://crossdomain/services.php?callback=jsnopCallback";
document.getElementByTagName("head")[0].appendChild(JSONP);
</script> //或者
<script type="text/javascript" src="http://crossdomain/services.php?callback=jsnopCallback"></script>
JSONP(跨域请求) —— 一种非官方跨域数据交互协议的更多相关文章
- JSONP -- 跨域数据交互协议
一.概念 ①传统Ajax:交互的数据格式——自定义字符串或XML描述: 跨域——通过服务器端代理解决. ②如今最优方案:使用JSON格式来传输数据,使用JSONP来跨域. ③JSON:一种数据交换格式 ...
- javascript 跨域请求详细分析(终极跨域解决办法)
自从我接触前端以来,接手的项目里面很大部分都是前后端分离的,后端只提供接口,前端根据后端接口渲染出实际页面.个人觉得这是一个挺好的模式,前后端各自负责各自的模块,分工明确,而且也给前端更大的发挥空间. ...
- Ajax跨域请求附带Cookie/Ajax跨域请求附带身份凭证
一.跨域请求中默认不带cookie等验证凭证 尤其对于post请求. 对于ajax请求,其中post,get都可以正常访问. withCredentials: false, // 允许携带cookie ...
- CSRF跨站请求伪造与XSS跨域脚本攻击讨论
今天和朋友讨论网站安全问题,聊到了csrf和xss,刚开始对两者不是神明白,经过查阅与讨论,整理了如下资料,与大家分享. CSRF(Cross-site request forgery):跨站请求伪造 ...
- java 后台实现ajax post跨域请求传递json格式数据获取json数据问题
参考大神:http://blog.csdn.net/chunqiuwei/article/details/19924821 java后台: public String ajaxProxy(Intege ...
- 关于试用jquery的jsonp实现ajax跨域请求数据的问题
我们在开发过程中遇到要获取另一个系统数据时,就造成跨域问题,这就是下文要说的解决办法: 先我们熟悉下json和jsonp的区别: 使用AJAX就会不可避免的面临两个问题,第一个是AJAX以何种格式来交 ...
- JSON和JSONP有哪些区别,PhoneGap跨域请求如何实现
前言 由于Sencha Touch 2这种开发模式的特性,基本决定了它原生的数据交互行为几乎只能通过AJAX来实现. 当然了,通过调用强大的PhoneGap插件然后打包,你可以实现100%的Socke ...
- Ajax的跨域请求——JSONP的使用
一.什么叫跨域 域当然是别的服务器 (说白点就是去别服务器上取东西) 只要协议.域名.端口有任何一个不同,都被当作是不同的域. 总而言之,同源策略规定,浏览器的ajax只能访问跟它的HTML页面同源( ...
- 使用Jsonp实现跨域请求
来自百度百科的一段话: JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题.由于同源策略,一般来说位于 server1.exampl ...
随机推荐
- 【翻译】Ext JS最新技巧——2014-5-12
原文:mkt_tok=3RkMMJWWfF9wsRoluazJZKXonjHpfsX77OQlXK%2B%2FlMI%2F0ER3fOvrPUfGjI4AT8NjI%2BSLDwEYGJlv6SgFS ...
- Floating-Info---Android
https://github.com/alt236/Floating-Info---Android
- C#系列之String和StringBuilder
前言 首先和博园的各位打声招呼,小弟在博园呆了也有一年多了.平常一有时间就会过来看看文章,学习各位的经验,现在养成了一种一天不来博园,心里就不踏实的习惯,不知道在看我博文的大哥们有没有这个感觉. 读归 ...
- 标准I/O库之缓冲
标准I/O库提供缓冲的目的是尽可能减少使用read和write调用的次数.它也对每个I/O流自动地进行缓冲管理,从而避免了应用程序需要考虑这一点所带来的麻烦. 标准I/O提供了三种类型的缓冲: (1) ...
- a标签中关于javascript:void(0)的几个问题
最近看了好几个关于<a>标签和javascript:void(0)的帖子,谨记于此,以资查阅.注:以下代码未经全面测试,但每一种方法可能会出现的情况都基本做了说明. 在做页面时,如果想做一 ...
- js整理常用方法
javascript对象合并或追加属性的方法 function objMerger(obj1, obj2){ for(var r in obj2){ //eval("obj1."+ ...
- oracle“记录被另一个用户锁住”
1.查看数据库锁,诊断锁的来源及类型: select object_id,session_id,locked_mode from v$locked_object; 或者用以下命令: select b. ...
- jQuery mouseover与mouseenter,mouseout与mouseleave的区别
mouseover与mouseenter 不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件. 只有在鼠标指针穿过被选元素时,才会触发 mouseenter 事件. mouseou ...
- Lua - 基础语法
Hello World 交互式编程 Lua 交互式编程模式可以通过命令 lua -i 或 lua 来启用: [huey@huey-K42JE lua]$ lua Lua 5.1.4 Copyright ...
- scala学习笔记:函数与方法
http://stackoverflow.com/questions/2529184/difference-between-method-and-function-in-scala A Functio ...