介绍
JSONP是JSON with Padding(填充式JSON或参数式JSON)的简写,是一种非常常用的跨域请求方式。主要原理是利用了script
标签可以跨域请求的特性,由其 src
属性发送请求到服务器,服务器返回 JavaScript
代码,浏览器接受响应,然后就直接执行了,这和通过 script
标签引用外部文件的原理是一样的。
JSONP由两部分组成:回调函数
和数据
,回调函数是当响应到来时应该在页面中调用的函数,回调函数的名字一般在请求中指定。当服务器响应时,服务器端就会把该函数和数据拼成字符串返回。
JSONP的请求过程
- 请求阶段:浏览器创建一个
script
标签,并给其src
赋值(类似http://example.com/api/?callback=jsonpCallback
)。 - 发送请求:当给
script
的src
赋值时,浏览器就会发起一个请求。 - 数据响应:服务端将要返回的
数据
作为参数和函数名称
拼接在一起(格式类似”jsonpCallback({name: 'abc'})
”)返回。当浏览器接收到了响应数据,由于发起请求的是script
,所以相当于直接调用jsonpCallback
方法,并且传入了一个参数。