jsonp的作用,大家都知道jsonp是用来跨域的,那么什么是跨域呢?跨域指的是不同源下面的脚本不能调用其他源下面的对象。这受制于浏览器的同源策略。
同源策略指的就是不同源的客户端脚本在没有授权的情况下无法访问其他源下面的资源,比如你再baidu.com下面使用ajax请求qq.com的数据会报错的。因为两个网站是不同源的。
源指的就是域名、协议和端口号。只有在三者都相同的情况下才是同源,才可以互相访问对方的资源。三个只要有一个不相同,如果想要访问对方的资源就需要跨域。
① 页面里面的连接(比如a标签,重定向或者表单的提交是不受同源策略影响的)
②跨域资源的引入是可以的。但是js不能读写加载的内容。如嵌入到页面中的<script src="..."></script>,<img>,<link>,<iframe>等。
通过上面两点可以知道我们如果想实现跨域可以通过那些不受同源策略影响的标签来实现。jsonp使用的就是script标签。
他的原理就是通过script标签获取不同源下面的数据直接来进行解析调用。当我们使用< script src = "">浏览器会自动引入对方的数据,因为是script标签,那么浏览器也会自动执行标签下面的函数。也就是说浏览器得事先知道获取到的数据的名称才可以进行调用,并且需要对方把数据包装秤指定的格式供浏览器解析。这该如何实现呢?
jsonp的原理是在原始的请求url上面加上callback=?的参数,后面的值可以自己定义,自己没有定义,jquery封装的jsonp也会自动随机生成一个字符串,这个字符串的作用就是告诉对方你需要将数据包装秤这个名字,然后我直接会对这个数据进行调用。所以,跨域也同样需要服务端的支持,否则也没办法随意跨域的。
前段调用jsonp代码
$.ajax({
type: "GET",
async: false,
url: "http://localhost:616/api/UserService/GetAll",
dataType: "jsonp",
jsonp: "callback",
jsonpCallback:"handler",
success: function (result) {
alert(result[0].UserName);
},
error: function (e) {
var test = e;
}
});
java里面支持jsonp的代码
protected static String callback(String json) {
try {
String callback = BeatContextUtils.getCurrent().getRequest().getParameter("callback");
if (StringUtils.isNotBlank(callback)) {
json = callback + "(" + json + ");";
}
} catch (Exception e) {
return null;
}
return json;
}
java里面之所以加上"("和")"的原因是因为js里面定义对象的方式就是
var myFather=new person("Bill","Gates",56,"blue"); 这种类型的。