跨域 CORS解决跨域.txt

跨域 CORS解决跨域.txt
参考：https://www.cnblogs.com/boboooo/p/9779355.html
文章的中间偏下 4.2 CORS解决跨域
CORS是一个W3C标准，全称是”跨域资源共享”（Cross-origin resource sharing）。
CORS需要浏览器和服务器同时支持。
目前，所有浏览器都支持该功能，IE浏览器不能低于IE10。
整个CORS通信过程，都是浏览器自动完成，不需要用户参与。
对于开发者来说，CORS通信与同源的AJAX通信没有差别，代码完全一样。
浏览器一旦发现AJAX请求跨源，就会自动添加一些附加的头信息，
有时还会多出一次附加的请求，但用户不会有感觉。
如果想要详细理解原理，请参考维基百科。

CORS请求默认不发送Cookie和HTTP认证信息。
若要发送Cookie，浏览器和服务端都要做设置，
咱们要解决的是跨域后的登录问题，所以要允许跨域发送 Cookie。
后端要设置允许跨域请求的域和允许设置和接受Cookie。
@RequestMapping("setCookie")
@CrossOrigin(origins="http://www.a.com:8888",allowCredentials = "true")
public String setCookie(HttpServletResponse response){
    Cookie cookie = new Cookie("test","same");
    cookie.setPath("/");
    response.addCookie(cookie);
    return "success";
}

@RequestMapping("getCookie")
@CrossOrigin(origins="http://www.a.com:8888",allowCredentials = "true")
public String getCookie(HttpServletRequest request,HttpServletResponse response){
    Cookie[] cookies = request.getCookies();
    if (cookies != null && cookies.length >0) {
        for (Cookie cookie : cookies) {
            System.out.println("name:" + cookie.getName() + "-----value:" + cookie.getValue());
        }
    }
    return "success";
}
我们通过@CrossOrigin注解允许跨域，
origins设置了允许跨域请求的域，allowCredentials允许设置和接受Cookie。

前端要设置允许发送和接受Cookie。
<script>
    $(function () {
        $.ajax({
            url : "http://www.b.com:8888/test/setCookie",
            method: "get",
            success : function (json) {
                console.log(json);
            },
            xhrFields: {
                withCredentials: true
            }
        });
    })
</script>


<script>
    $(function () {
        $.ajax({
            url : "http://www.b.com:8888/test/getCookie",
            method: "get",
            success : function (json) {
                console.log(json);
            },
            xhrFields: {
                withCredentials: true
            }
        });
    })
</script>
我们使用CORS，也解决了跨域。