前言
Jsonp(JSON with Padding) 是 json 的一种"使用模式",可以让网页从别的域名(网站)那获取资料,即跨域读取数据。
为什么我们从不同的域(网站)访问数据需要一个特殊的技术(JSONP )呢?这是因为同源策略。
同源策略,它是由Netscape提出的一个著名的安全策略,现在所有支持JavaScript 的浏览器都会使用这个策略。
使用JSONP解决跨域问题,只改前端不改后端报语法错误(如图中第二条错误)的原因:JSONP是使用动态创建的一个script标签,而script标签返回的是JS代码,但是服务器后台代码没有做任何改动,返回的还是json对象。浏览器会把json对象和字符串当作是JS代码来解析所以就会报错了。解决方法:需要修改后台代码,新建一个类在构造方法里写super("callback")。
Jsonp实现原理:
1、Jsonp的请求类型是script,而非一般ajax的请求类型:xhr,这样浏览器就不会做安全校验;
2、Jsonp的返回类型是js,而非一般ajax的返回类型:json对象;
3、Jsonp请求携带一个前后台约定的参数(eg:callback),便于让后台识别是jsonp请求,后台则返回js数据而非json数据。
4、默认值:callback
若要修改约定的默认值话,需要修改2处:
(1)ajax代码中jsonp:"callback2",或者请求参数中的callback修改成对应的callback2。
(2)后台 super("callback2")。
5、后台与前台约定使用相同的如callback函数,服务器返回的就会是javascript脚本,不是json。jsonp除了callback还有一个_的函数,是防止缓存的。如果cache设置为true,就没有_函数了。
JSONP的弊端:
- 服务器需要改动代码支持-如果调用的接口不是我们自己的,那么改动就很麻烦。
- 只支持GET方法,JSONP是通过动态创建一个script发送请求的,而script只支持GET方法。
- 发送的不是XHR请求,XHR有许多新的特性,如异步、各种事件等,JSONP则没有。