JS跨域请求

跨域资源共享:

JS跨域请求:
	通过JS在不同的域之间进行数据传输或通信
不同域:
	只要协议,IP(域名),端口这三者有任何一个不同都认为是不同域
跨域测试:
	在端口号为9105的工程下,在js的service层发送请求$http.get("http://localhost:9107/cart/addGoodsToCartList.do")
测试结果:
XMLHttpRequest cannot load
http://localhost:9107/cart/addGoodsToCartList.do?itemId=112344&num=1.
No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin
'http://localhost:9100' is therefore not allowed access. The response had HTTP status code 400.
结果分析:
	浏览器一旦发现AJAX 请求跨源,就会自动添加一些附加的头信息,有时还会多出一次附加的请求;浏览器在真正发送请求前,会先预请求,预响应一次,相当于三次握手的前两次,当进行预请求响应的时候,发现附加的头信息,导致请求失败
<!-------------------------------使用原生的响应头解决--------------------------------------->
跨域资源共享(CORS):
	Cross-Origin Resource Sharing
	CORS是 HTML5 中定义的一种解决资源跨域的策略。
在需要被跨域访问的方法中设置:
	9107的addGoodsToCartList方法中设置:
	//第一个参数固定值:允许访问的域,第二个参数:指定具体的域,可以使用通配符"*",表示允许所有与访问
	response.setHeader("Access-Control-Allow-Origin", "http://localhost:9105");
	//如果需要操作cookie就设置下面这个响应头,并且上面的响应头不能使用"*",必须指定具体的域
	response.setHeader("Access-Control-Allow-Credentials", "true");
如果操作了cookie,还需要在ajax请求中,添加一个请求参数:{'withCredentials':true}
<!---------------------------使用spring4.2后提供的注解解决---------------------------------->
在需要跨域的方法上添加注解@CrossOrigin,eg:
@CrossOrigin(origins="http://localhost:9105",allowCredentials="true")
跨域资源共享:

猜你喜欢
