Ajax跨域问题产生的原因及解决方法

如果前后台不是同一域，就会产生跨域问题。

前端jasmine测试框架。

 

产生跨域的原因：

1.浏览器限制

2.跨域：协议，域名，端口任何一个不同就是跨域

3.Xhr(XMLHttpRequest)请求

 

解决思路：

1.改动客户端浏览器参数来解除限制 浏览器启动加入 --disable-web-security

2.Jsonp解决xhr请求问题.

        jsonp动态创建script标签,请求中类型type=script,返回类型application/javascript。Java后台需要extends AbstractJsonpResponseBodyAdvice  构造方法中 super(“callback”); @controllerAdvice

       弊端：1.服务器需要支持,2.只支持Get请求3.发送到不是XHR请求

3.跨域: 被调用方支持跨域，调用方隐藏请求

http协议中关于跨域的要求

服务端Filter解决方案：doFilter(){

 HttpServletResponse res = ()response;

res.addHeader(“Access-Control-Allow-Origin”,”域名”); *表示所有域

res.addHeader(“Access-Control-Allow-Methods”,”GET”); *表示所有方法

}

 

简单请求：Get, text/plain, application/url

非简单请求：application/json 等。需要

res.addHeader(“Access-Control-Allow-Header”,”Content-Type”);

 

带Cookie的跨域

$.ajax({

  xhrFields:{ withCredentials:true}

});

不能使用res.addHeader(“Access-Control-Allow-Origin”,”*”);，必须指定全匹配具体域名,并res.addHeader(“Access-Control-Allow-Credintials”,”true”);

 

支持任何域名的方法： 跨域调用时，浏览器会在请求头中创建origin字段，可以在后端filter中HttpServletrequest  request.getHeader(“Origin”)取出origin,加入允许的跨域字段中。

如果有自定义请求头，同样可以参考上面的方法取出所有请求头，并加入允许返回的字段中request.getHeader(“Access-Control-Request-Headers”);

 

Spring解决跨域方法：在类或方法上@CrossOrigin