1,JavaScript因为安全性方面的考虑,不容许页面跨域调用其余页面的对象,那么问题来了,什么是跨域问题?前端
答:这是因为浏览器同源策略的限制,如今全部支持JavaScript的浏览器都使用了这个策略。那么什么是同源呢?所谓的同源是指三个方面“相同”:
1,域名相同
2,协议相同
3,端口相同ajax
2,下面就举几个例子来帮助更好的理解同源策略。
URL 说明 是否容许通讯json
http://www.a.com/a.js http://www.a.com/b.js 同一域名 容许 http://www.a.com/a.js http://www.b.com/a.js 不一样域名 不容许 http://www.a.com:8000/a.js http://www.a.com/b.js 同一域名不一样端口 不容许 https://www.a.com/a.js http://www.a.com/b.js 同一域名不一样协议 不容许
3,在JAVA中处理跨域问题,一般有如下两种经常使用的解决方法。
1,第一种解决方法
后台代码在被请求的Servlet中添加Header设置:跨域
response.setHeader("Access-Control-Allow-Origin", "*");
PrintWriter out =null;
try
{
out = response.getWriter();
} catch (IOException e)
{
// TODO Auto-generated catch block
e.printStackTrace();
}
out.print("{'status':'ok'}");
out.flush();
out.close();浏览器
Access-Control-Allow-Origin这个Header在W3C标准里用来检查该跨域请求是否能够被经过,若是值为*则代表当前页面能够跨域访问。默认的状况下是不容许的。安全
在前端JS中须要向Servlet发出请求,请求代码以下所示:async
$.ajax({ url: "your url", type:"get or post", dataType:"json", data:{ .... }, success:function(data){ ... }
第二种解决方法
经过jsonp跨域请求的方式。JSONP和JSON虽然只有一个字母的区别,可是他们彻底就是两回事,不少人很容易把他们搞混。JSON是一种数据交换的格式,而JSONP则是一种非官方跨域数据交互协议。
首先来讲一下前端JS是怎么发送请求。代码以下所示:函数
$.ajax({ url:"your url", type:"get or post", async:false, dataType : "jsonp", //服务端用于接收callback调用的function名的参数 jsonp:"callbackparam", //callback的function名称 jsonpCallback:"success_jsonpCallback", success:function(data){ console.log(data); }, error:function(data){ console.log(data); } });
这里的callbackparam和success_jsonpCallback能够理解为发送的data数据的键值对,能够自定义,可是callbackparam须要和后台约定好参数名称,由于后台须要获取到这个参数里面的值(即success_jsonpCallback)。post
4,下面,最重要的来了,后台怎么样获取和返回数据呢。代码以下所示:jsonp
PrintWriter out =null;
String callback=req.getParameter("callbackparam");
String json=callback+"({'status':'ok'})";
try
{
out = resp.getWriter();
} catch (IOException e)
{
// TODO Auto-generated catch block
e.printStackTrace();
}
out.print(json);
out.flush();
out.close();
首先须要获取参数名为callbackparam的值,这里获取到的值就是“success_jsonpCallback”。而后将这个值加上一对小括号。小括号里放入你须要返回的数据内容,好比这里我返回一个JSON对象。固然你也能够返回其余对象,好比只返回一个字符串类型数据也能够。最后前端JS返回的数据就是这样的:
success_jsonpCallback({'status':'ok'})
浏览器会自动解析为json对象,这时候你只须要在success回调函数中直接用data.status就能够了。