跨域的三种实现方式

一.跨域
　　由于浏览器同源策略，凡是发送请求url的协议、域名、端口三者之间任意一个与当前页面地址不同即为跨域
　　前页面地址与发送请求的url的协议、域名、端口三者之间任意一个地址不同，既为跨域，哪怕不同域名指向的同一地址，也是跨域。

二.方案

1.script标签加载

browser：html>js

document.getElementById("btn").onclick=function(){    var str=$('<script type="text/javascript" src="http://127.0.0.1:8080/testJsonp/test.jsp?name=fun">');    $(document).append(str);}

Server:jsp

<%String name=request.getParameter("name");String html="\'<div id=\"gg\" name=\"ggb\" style=\"color:red\">fdsfdsfd</div>\'";out.print(“$(document.body).append(”+html+“)”);//自动在body添加html%>

或者在html定义方法,在jsp调用方法,并传参

2.Ajax的Jsonp，自动解析json为js对象（底层还是通过script标签）
browser：html>jq

$.ajax("http://127.0.0.1:8080/testJsonp/test.jsp",{        dataType:'jsonp',        jsonp:'funName',        error:function(xhr,errMes,errObj){            alert(errMes);        },        success:function(data){//jQuery18309719266761046812_1484988035397({name:'xiaoming',age:20})            alert(data.name);        }});

Server:jsp

<%String name=request.getParameter("funName");name+="({name:\'xiaoming\',age:20})";out.print(name);%>

3.CORS简单请求
在想跨域的服务器中添加:

response.setHeader("Access-Control-Allow-Origin", "http://client1.tiglle.com");

参数一:固定Access-Control-Allow-Origin
参数二:允许跨域访问的域名，或者ip
多个用”,”分隔。”*”代表所有域都能跨域,不安全:

response.setHeader("Access-Control-Allow-Origin", "http://client1.tiglle.com,http://client2.tiglle.com");response.setHeader("Access-Control-Allow-Origin", "*");

4.CORS非简单请求
1.非简单请求会先请求发送OPTIONS请求验证
域a的jsp:

<script type="text/javascript">    function launch(){        $.ajax({            url:'http://server.tiglle.com/server/corsServlet',            method:'post',            beforeSend:function(xhr){                xhr.setRequestHeader("a","b");            },            success:function(){                console.log(arguments[0]);            }        });    }  </script>

域b的服务器的servlet：

    protected void doPost(HttpServletRequest request, HttpServletResponse response)            throws ServletException, IOException {        response.setHeader("Access-Control-Allow-Origin", "http://client1.tiglle.com");        response.getWriter().print("haha,ok le");    }    @Override    protected void doOptions(HttpServletRequest request, HttpServletResponse response)            throws ServletException, IOException {        response.addHeader("Access-Control-Allow-Origin", "*");        response.addHeader("Access-Control-Allow-Methods", "GET,POST,OPTIONS,DELETE");        response.addHeader("Access-Control-Allow-Headers", "a,b");    }

三.通过nginx解决
页面地址和nginx监听地址一致，然后页面请求地址指向统一nginx，由nginx根据规则转发到不同服务器，然后通过nginx返回。

cors详见:http://www.ruanyifeng.com/blog/2016/04/cors.html