JSONP 原理

JSONP和AJAX相同，都是客户端向服务端发送请求：给服务器传递数据或者从服务器获取数据的方式

AJAX（async javascript and xml）属于同源策略

JSONP属于非同源策略（跨域请求）->实现跨域请求额方式有很多，只不过JSONP是最常用的

判断是否同源：

  1. 域名/IP
  2. 协议
  3. 端口号

以上三个都一样就是同源，其中有一个不一样就是非同源，我们一般用JSONP来获取数据

在script的世界中，没有同源跨域这一说，只要你给我src属性中的地址是一个合法的地址，script都可以把对应的内容请求回来（JSONP请求一定要对方服务器做支持才可以）

  1. 我们首先把需要请求数据的那个跨域API接口的地址赋值给src
  2. 把当前页面中的某一个函数名当作参数值传递给跨域服务器（URL问号传参：?callback=fn）
  3. 服务器收到请求后，需要进行特殊处理，把你传递进来的函数名和它需要给你的数据拼接成一个字符串，例如 fn([{"name":"xxx"}])
  4. 最后，服务器把准备好的数据通过http协议返回给客户端，客户端只需要执行fn即可

JQ中的JSONP

1
2
3
4
5
6
7
8
9
$.ajax({
    url: '',
    dataType: 'jsonp',
    jsonpCallback: 'fn', //=> 自定义传递给服务器的函数名，而不是用JQ自动生成的
    jsonp: 'cb', //=> 把传递函数名的那个形参改为cb
    success: function(){
        
    }
})