1,JavaScript由于安全性方面的考虑,不允许页面跨域调用其他页面的对象,那么问题来了,什么是跨域问题?
下面就举几个例子来帮助更好的理解同源策略。
同源策略需要同时满足以下三点要求:
1)协议相同
2)域名相同
3)端口相同

http:www.test.com与https:www.test.com 不同源——协议不同
 http:www.test.com与http:www.admin.com 不同源——域名不同
 http:www.test.com与http:www.test.com:8081 不同源——端口不同


2、 只要不满足其中任意一个要求,就不符合同源策略,就会出现“跨域”

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发出请求,请求代码如下所示:

$.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)。

4,下面,最重要的来了,后台怎么样获取和返回数据呢。代码如下所示:

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就可以了。