前言
第一次听说jsonp，其实早在2年之前。当时在做一个活动页面的抽奖模块，要从服务端get一个概率，当时什么都不懂，同事说用ajax，我就用ajax，同事说dataType改成jsonp，我就改成jsonp。于是乎活动页面做完了，以后也没有碰到过jsonp，在这期间我一直以为jsonp跟ajax息息相关，是xhr的一种特殊的跨域形式...直到一个月前的一次面试，问到jsonp我被虐成狗，才决定看下jsonp，好吧，原来jsonp也不是很难。
为什么要用jsonp？
相信大家对跨域一定不陌生，对同源策略也同样熟悉。什么，你没听过？没关系，既然是深入浅出，那就从头说起。
假如我写了个index页面，页面里有个请求，请求的是一个json数据（不知道json数据的猛戳JSON简介以及用法汇总），简单思考写下如下代码：
<script src='https://img.devbox.cn/3cccf/16086/243/7a4ce818aebe26ff.png" />但是如果我的json文件和index文件不在一个域下，即跨域（不懂跨域的可参考JavaScript 的同源策略）了呢？
试着在wamp下新开个apache端口（不知道怎么开的可参考WampServer下使用多端口访问），将json文件放到该服务端口的文件夹下（楼主设置的端口号为8080，默认的是80端口），试着发送请求：
<script src='https://img.devbox.cn/3cccf/16086/243/0a4b7fe46a4eae26.png" />很显然，提示跨域了！怎么搞？这时jsonp就要出马了！
神奇的script标签
与jsonp息息相关的是script标签，而xhr或者说传统意义上的ajax与之没有半毛钱关系！
接着看上面的index.html代码，我们看到页面引用了百度cdn的jquery路径，对于这样的方式我们似乎已经习以为常，但是仔细一想，script标签可是完完全全的跨域的啊...没错，jsonp的实现核心就是利用script标签的跨域能力！于是我们灵机一动，似乎可以这么搞，动态生成一个script标签，把json的url赋值给script的src属性，然后再把这个script标签插入dom里...
<body> <script src='https://img.devbox.cn/3cccf/16086/243/01d99e3f02db9d45.png" />原因是因为json数据并不是合法的js语句，把上面的json数据放在一个回调函数中是最简单的方法：
<body> <script src='https://img.devbox.cn/3cccf/16086/243/927c0cdb72fe5ad0.png" />当然，这时的a.json文件并不一定要这样命名，改成a.js也不会有一点问题。
而如果是与服务端交互也是一样的道理，比如和php：
<body> <script src='https://img.devbox.cn/3cccf/16086/243/89e8e7df87d832a6.png" />总结
由于同源策略的限制，XmlHttpRequest只允许请求当前源（域名、协议、端口）的资源，为了实现跨域请求，可以通过script标签实现跨域请求，然后在服务端输出JSON数据并执行回调函数，从而解决了跨域的数据请求，这就是jsonp的核心。
jsonp原理：
1.首先在客户端注册一个callback, 然后把callback的名字传给服务器。
2.服务器先生成 json 数据。 然后以 javascript 语法的方式，生成一个function , function 名字就是传递上来的参数 jsonp. 最后将 json 数据直接以入参的方式，放置到 function 中，这样就生成了一段 js 语法的文档，返回给客户端。
3.客户端浏览器，解析script标签，并执行返回的 javascript 文档，此时数据作为参数，传入到了客户端预先定义好的 callback 函数里.（动态执行回调函数）json和jsonp的区别，ajax和jsonp的区别
json和jsonp虽然只有一个字母的区别，但是它们之间扯不上关系。
json是一种轻量级的数据交换格式。
jsonp是一种跨域数据交互协议。
json的优点：（1）基于纯文本传递极其简单，（2）轻量级数据格式适合互联网传递，（3）容易编写和解析。
ajax和jsonp的区别：
相同点：都是请求一个url
不同点：ajax的核心是通过xmlHttpRequest获取内容
jsonp的核心则是动态添加<script>标签来调用服务器 提供的js脚本。
涵涵Json知识小博士7.1k 经验值 | 10.8k 粉丝Json热门文章 | Json Hot Blog
- asp实现读取数据库输出json代码
- 比getjson好的底层函数是哪个有什么优点
- Ajax jsonp跨域请求实现方法
- ajax请求后台得到json数据后动态生成树形下拉框的方法
- nginx配置返回文本或json的方法
- 服务端拼接json数据格式的正确写法(Append方式)
- 关于go语言载入json可能遇到的一个坑
- nginx配置返回文本或json的方法
- Jsonp 关键字详解及json和jsonp的区别，ajax和jsonp的区别
- C#实现集合转换成json格式数据的方法
- IOS json 解析遇到错误问题解决办法
- iOS开发中以application/json上传文件实例详解
- PHP使用json_encode函数时不转义中文的解决方法
- PHP去掉json字符串中的反斜杠\及去掉双引号前的反斜杠
- php中输出json对象的值(实现方法)
- php将从数据库中获得的数据转换成json格式并输出的方法
- PHP下ajax跨域的解决方案之jsonp实例分析
- PHP实现chrome表单请求数据转换为接口使用的json数据
- 源码分析系列之json_encode()如何转化一个对象
- java使用淘宝API读写json实现手机归属地查询功能代码
