JSONP 是JSON with padding(填充式JSON 或参数式JSON)的简写,是应用JSON 的一种新方法,在后来的Web 服务中非常流行。JSONP 看起来与JSON 差不多,只不过是被包含在函数调用中的JSON,就像下面这样。

callback({ "name": "Nicholas" });

JSONP 由两部分组成:回调函数和数据。回调函数是当响应到来时应该在页面中调用的函数。回调函数的名字一般是在请求中指定的。而数据就是传入回调函数中的JSON数据。下面是一个典型的JSONP请求。

http://freegeoip.net/json/?callback=handleResponse

这个URL 是在请求一个JSONP 地理定位服务。通过查询字符串来指定JSONP 服务的回调参数是很常见的,就像上面的URL 所示,这里指定的回调函数的名字叫handleResponse()。

JSONP 是通过动态<script>元素来使用的,使用时可以为src 属性指定一个跨域URL。这里的<script>元素与<img>元素类似,都有能力不受限制地从其他域加载资源。因为JSONP 是有效的JavaScript 代码,所以在请求完成后,即在JSONP 响应加载到页面中
以后,就会立即执行。来看一个例子。

<!DOCTYPE html>
<html>
<head>
<title>JSONP Example</title>
</head>
<body>
<script>

function handleResponse(response){
alert("You're at IP address " + response.ip + ", which is in " + response.city + ", " + response.region_name);
}

var script = document.createElement("script");
script.src = "http://freegeoip.net/json/?callback=handleResponse";
document.body.insertBefore(script, document.body.firstChild);
</script>
</body>
</html>

什么JSONP的更多相关文章

  1. 实例操作JSONP原理

    絮语:按这个步骤走,你就会明白JSONP是什么鬼. 1.工程目录: ng-mywork demo.html test.js 2.nginx的server配置 server { listen ; ser ...

  2. angular2系列教程(九)Jsonp、URLSearchParams、中断选择数据流

    大家好,今天我们要讲的是http模块的第二部分,主要学习ng2中Jsonp.URLSearchParams.observable中断选择数据流的用法. 例子

  3. 疯狂的JSONP

    何为跨域?何为JSONP?JSONP技术能实现什么?是否有必要使用JSONP技术? 跨域 就是由于JavaScript同源策略的限制,使得a.com域名下的js无法操作b.com或c.a.com域名下 ...

  4. 通过扩展让ASP.NET Web API支持JSONP

    同源策略(Same Origin Policy)的存在导致了"源"自A的脚本只能操作"同源"页面的DOM,"跨源"操作来源于B的页面将会被拒 ...

  5. 跨域的jsonP

    1.出现原因:因为web中的同源策略(域名,协议,端口号)限制了跨域访问.   2.区别于json (个人理解)json是数据交换格式,jsonp是数据通信中的交互方式   3.jsonp的get与p ...

  6. ASP.NET Web API 配置 JSONP

    之前的一篇博文:jsonp跨域+ashx(示例) 1. 安装 Jsonp 程序集: PM> Install-Package WebApiContrib.Formatting.Jsonp PM&g ...

  7. 原生JS封装Ajax插件(同域&&jsonp跨域)

    抛出一个问题,其实所谓的熟悉原生JS,怎样的程度才是熟悉呢? 最近都在做原生JS熟悉的练习... 用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的...简单说说思路,如有不正 ...

  8. 跨域之jsonp

    我们都知道使用<script>标签可以引入外部的JS文件,即使这个JS文件来自于其他的网站,比如我们引用存放在网络服务器上的jQuery框架.在这个过程中,我们已经实现跨域访问.像< ...

  9. 由浅入深学习ajax跨域(JSONP)问题

    什么是跨域?说直白点就是获取别人网站上的内容.但这么说貌似又有点混淆,因为通常我们用ajax+php就可以获取别人网站的内容,来看下面这个例子. 来看看跨域的例子,jquery+ajax是不能跨域请求 ...

  10. JSONP的诞生、原理及应用实例

    问题: 页面中有一个按钮,点击之后会更新网页中的一个盒子的内容. Ajax可以很容易的满足这种无须刷新整个页面就可以实现数据变换的需求. 但是,Ajax有一个缺点,就是他不允许跨域请求资源. 如果我的 ...

随机推荐

  1. 《Java程序性能优化》学习笔记 程序优化

    这一部分主要介绍代码层的优化.了解如何编写高效而精炼的代码,正确的使用函数方法.1.字符串优化处理Java语言中,String对象可以认为是对char数组的眼神和进一步封装.它主要由3部分组成:cha ...

  2. 《MySQL必知必会》笔记 事务、安全及性能等

    二十六 管理事务处理 1.并非所有引擎都支持事务处理,如MyIASM和InnoDB,关于事务处理的几个术语:事务(Transaction)指一组sql语句:回退(rollback)指撤销指定SQL语句 ...

  3. phpstorm 8 license key

    Learn Programming===== LICENSE BEGIN =====63758-1204201000000Ryqh0NCC73lpRm!XVcxFChJ2gTUR2lZtlLXrPLb ...

  4. 深入剖析PHP输入流 php://input(与POST/GET的区别)

    PHP输入流php://input 转:http://www.nowamagic.net/academy/detail/12220520 在使用xml-rpc的时候,server端获取client数据 ...

  5. 烟大 Contest1024 - 《挑战编程》第一章:入门 Problem E: Graphical Editor(模拟控制台命令形式修改图形)

    Problem E: Graphical Editor Time Limit: 1 Sec  Memory Limit: 64 MBSubmit: 2  Solved: 2[Submit][Statu ...

  6. poj 3928 树状数组

    题目中只n个人,每个人有一个ID和一个技能值,一场比赛需要两个选手和一个裁判,只有当裁判的ID和技能值都在两个选手之间的时候才能进行一场比赛,现在问一共能组织多少场比赛. 由于排完序之后,先插入的一定 ...

  7. 电赛总结(三)——DA芯片总结

    一.AD7890 1.特性参数 (1)高速12位DA,转换速度5.9us (2)具有8个通道. (3)串行通信 2.芯片管脚图 3.管脚功能 管脚名称 功能 AGND 模拟地 SMODE 控制端,&q ...

  8. Struts2拦截器原理以及实例

    一.Struts2拦截器定义 1. Struts2拦截器是在访问某个Action或Action的某个方法,字段之前或之后实施拦截,并且Struts2拦截器是可插拔的,拦截器是AOP的一种实现. 2. ...

  9. Windows Phone 执行模型概述

    Windows Phone 执行模型控制在 Windows Phone 上运行的应用程序的生命周期,该过程从启动应用程序开始,直至应用程序终止. 该执行模型旨在始终为最终用户提供快速响应的体验.为此, ...

  10. 枚举GC Roots的实现

    枚举根节点 从可达性分析中从GC Roots节点找引用链这个操作为例,可作为GC Roots的节点主要在全局性的引用(例如常量或类静态属性)与执行上下文(例如栈帧中的本地变量表)中,现在很多应用仅仅方 ...