Jsonp原理简介：
- jsonp原理：利用script标签的特性
- script标签的特性 ：
- 会将引用的外部文件中的文本内容当作js代码进行解析
- 将远程服务器中的资源添加到当前位置进行解析
- json格式 ： 属性名必须有冒号， 例 {"c" : 123}
- jsonp == json + padding
Jsonp原理解析：
- json 演变一
- 当我们用script直接访问一个php页面时，控制台会报错，但报错并不是因为语法错误或者没有请求到数据，而是因为json数据没有赋变量名
例如：
1. 我们在script标签中直接写一个标准的json格式：
<script>
{"s" : 123}
</script>
注：这样写控制台会直接报错
2. 当我们给上变量名时：
<script>
var json = {"s" : 123}
</script>
注： 这样写就不会报错了
- 所以当我们把从远程服务器拿来的json对象赋值给一个变量时（后端也能访问到本地页面上的变量的），即远程服务器上的数据完全可以通过赋值的方式，赋值到我们本地的页面上。
例如：
<script>
var data
</script>
- 在本地设置一个变量data
- 然后在远程上将数据赋值给data
- 这样我们就能通过打印，在控制台得到该数据
- 但是这样做有可能会变量冲突，而且前后端的沟通成本大
- json 演变二
- 通过定义一个函数（远程服务器也能访问到函数）
- 通过传参来得到数据
例如
function fn(data){
//数据请求回来会被触发的函数
console.log(data)
}
- script标签在引入src地址时，发送的是get请求，而get请求可以附带参数
例如：
<script src="http://code.jquery.com/jquery-2.1.1.min.js？a=100"></script>
注：参数为问号（？）后面的，这里的地址只为举例用
- 因为地址栏可以传参，所以我们可以通过地址栏将函数名称传给后端
例如 ：
<script src="http://code.jquery.com/jquery-2.1.1.min.js？fnName = fn"></script>、
注：这里的地址只用于举例
这样就可以在控制台得到数据，这也是jsonp的实现原理
- 所以我们只需将传输数据的参数名称（fnName）告诉给后端就可以了，后期只需和后端统一参数名称即可
回忆 JQ 中的 jsonp：
- jq的有默认的参数名称 callback
- 因为jsonp使用广泛，所以jsonp接口大家都约定使用 callback，形成了标准约定，这样就大大减少了前后端的沟通成本
Jsonp原理总结：
- 前端部分
- 判断请求与当前页面的域是否同源，若同源则发送正常的ajax，就没有跨域的事情了
- 若不同源，生成一个script标签
- 之后生成一个随机的callback名字，并创建名为这个的方法
- 设置script标签的src，设置为请求的接口
- 将callback作为参数拼接在后面
- 后端部分
- 后端接收到请求d后，开始准备返回的数据
- 后端拼接数据，将要返回的数据用callback的值和括号包裹起来
例：
- callback = ad1222 要返回的数据为{'a':1,'b':2}
- 就要拼接为 ： ad1222({'a':1,'b':2})
- 浏览器接收到内容
- 其会当作js代码来执行
- 从而执行名为ad1222的方法，这样我们就接收到了后端返回给我们的对象
