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(跨域请求) —— 一种非官方跨域数据交互协议的更多相关文章

  1. JSONP -- 跨域数据交互协议

    一.概念 ①传统Ajax:交互的数据格式——自定义字符串或XML描述: 跨域——通过服务器端代理解决. ②如今最优方案:使用JSON格式来传输数据,使用JSONP来跨域. ③JSON:一种数据交换格式 ...

  2. javascript 跨域请求详细分析(终极跨域解决办法)

    自从我接触前端以来,接手的项目里面很大部分都是前后端分离的,后端只提供接口,前端根据后端接口渲染出实际页面.个人觉得这是一个挺好的模式,前后端各自负责各自的模块,分工明确,而且也给前端更大的发挥空间. ...

  3. Ajax跨域请求附带Cookie/Ajax跨域请求附带身份凭证

    一.跨域请求中默认不带cookie等验证凭证 尤其对于post请求. 对于ajax请求,其中post,get都可以正常访问. withCredentials: false, // 允许携带cookie ...

  4. CSRF跨站请求伪造与XSS跨域脚本攻击讨论

    今天和朋友讨论网站安全问题,聊到了csrf和xss,刚开始对两者不是神明白,经过查阅与讨论,整理了如下资料,与大家分享. CSRF(Cross-site request forgery):跨站请求伪造 ...

  5. java 后台实现ajax post跨域请求传递json格式数据获取json数据问题

    参考大神:http://blog.csdn.net/chunqiuwei/article/details/19924821 java后台: public String ajaxProxy(Intege ...

  6. 关于试用jquery的jsonp实现ajax跨域请求数据的问题

    我们在开发过程中遇到要获取另一个系统数据时,就造成跨域问题,这就是下文要说的解决办法: 先我们熟悉下json和jsonp的区别: 使用AJAX就会不可避免的面临两个问题,第一个是AJAX以何种格式来交 ...

  7. JSON和JSONP有哪些区别,PhoneGap跨域请求如何实现

    前言 由于Sencha Touch 2这种开发模式的特性,基本决定了它原生的数据交互行为几乎只能通过AJAX来实现. 当然了,通过调用强大的PhoneGap插件然后打包,你可以实现100%的Socke ...

  8. Ajax的跨域请求——JSONP的使用

    一.什么叫跨域 域当然是别的服务器 (说白点就是去别服务器上取东西) 只要协议.域名.端口有任何一个不同,都被当作是不同的域. 总而言之,同源策略规定,浏览器的ajax只能访问跟它的HTML页面同源( ...

  9. 使用Jsonp实现跨域请求

    来自百度百科的一段话: JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题.由于同源策略,一般来说位于 server1.exampl ...

随机推荐

  1. CCNA 例题精选

    3. Refer to the exhibit. Whichtwo statements are true about interVLAN routing in the topology that i ...

  2. iOS完美的网络状态判断工具

    大多数App都严重依赖于网络,一款用户体验良好的的app是必须要考虑网络状态变化的.iOSSinger下一般使用Reachability这个类来检测网络的变化. Reachability 这个是苹果开 ...

  3. log_slave_updates在线修改

    http://planet.mysql.com/entry/?id=20450 mysql> show variables like 'log_slave_updates'; +-------- ...

  4. mysql 源码--xpchild

    http://www.cnblogs.com/xpchild/p/3825309.html

  5. page cache和buffer cache 图解

    http://www.cnblogs.com/yrpen/p/3777963.html http://www.cnblogs.com/hustcat/archive/2011/10/27/222699 ...

  6. C#中Strings VS. StringBuilder

    string mappingHandler = String.Format(@"""[name='BTSHTTPReceiveModule',path='BTSHTTPR ...

  7. 信号之alarm和pause函数

    使用alarm函数可以设置一个计时器,在将来某个指定的时间,该计时器会超时.当计时器超时时,产生SIGALRM信号.如果不忽略或不捕捉此信号,则其默认动作是终止调用该alarm函数的进程. #incl ...

  8. 网络请求OkHttp的使用

     okHttp: 1.okHttp是squere公司出的,在Android4.0以后盛行 2.httpClient 在5.0中弃用,在6.0以Google的sdk中没有该api 3.httpUrlCo ...

  9. C++的4种编程范型

    基于过程procedural-based 基于对象object-based 面向对象object-oriented 泛型技术generics

  10. 命令行界面下用户和组管理之groupmod的使用

    NAME    groupmod - modify a group definition on the system SYNOPSIS       groupmod [options] GROUP O ...