SpringMVC解决跨域问题的⼏种⽅式
现在越来多的地⽅⽤到CORS来处理跨域问题，主要还是在于JSONP有⼀定的条件约束，先看⼀下对⽐，本⽂会介绍包括JSONP和CORS在内的⼏种解决跨域问题的⽅式
⼀、JSONP和CORS 区别
JSONP的原理是动态创建script标签
  1.JSONP发送的不是真正的ajax请求
  2.JSONP不⽀持post请求
  3.JSONP没有兼容问题
CORS中⽂意思是跨域资源共享，需要在服务器端设置
cops配置
  1.CORS发送的是真正的ajax请求，它允许浏览器向跨源服务器，发出XMLHttpRequest请求，从⽽克服了AJAX只能同源使⽤              的限制。
  2.CORS既⽀持get ⼜⽀持post
  3. CORS需要浏览器和服务器同时⽀持。⽬前，所有浏览器都⽀持该功能，IE浏览器不能低于IE10。
⼆、JSONP实现跨域原理
JSONP能实现跨域源于其使⽤了回调函数，整个过程就是前端声明好⼀个函数，后端返回执⾏函数。执⾏函数参数中携带所需的数据，所以要求前后端定义⼀个回调函数，
1.通过添加⼀个<script src=""> 来完成⼀个跨域请求，⽤于发起跨域请求，后台则把此回调函数返回
前端代码：
//回调函数
function showData (result) {
var data = JSON.stringify(result); //json对象转成字符串
$("#text").val(data);
}
$(document).ready(function () {
$("#btn").click(function () {
//向头部输⼊⼀个脚本，该脚本发起⼀个跨域请求
$("head").append("<script src='localhost:8080/test?callback=showData'><\/script>");
});
});
后台代码：
springmvc常用标签//前端传过来的回调函数名称
String callback = Parameter("callback");//前端定义的名称
//⽤回调函数名称包裹返回数据，这样，返回数据就作为回调函数的参数传回去了
result = callback + "(" + result + ")";
2.通过jquery来实现jsonp跨域请求：
服务端代码不变，js代码如下：
最简单的⽅式，只需配置⼀个dataType:'jsonp'，就可以发起⼀个跨域请求。jsonp指定服务器返回的数据类型为jsonp格式，可以看发起的请求路径，⾃动带了⼀个callback=xxx，xxx是jquery随机⽣成的⼀个回调函数名称。
这⾥的success就跟上⾯的showData⼀样，如果有success函数则默认success()作为回调函数。
<%@ page pageEncoding="utf-8" contentType="text/html;charset=UTF-8"  language="java" %>
<html>
<head>
<title>跨域测试</title>
<script src="js/jquery-1.7.2.js"></script>
<script>
$(document).ready(function () {
$("#btn").click(function () {
$.ajax({
url: "localhost:8080/test",
type: "GET",
dataType: "jsonp", //指定服务器返回的数据类型
success: function (data) {
var result = JSON.stringify(data); //json对象转成字符串
$("#text").val(result);
}
});
});
});
</script>
</head>
<body>
<input id="btn" type="button" value="跨域获取数据" />
<textarea id="text" ></textarea>
</body>
</html>
三、使⽤CORS解决跨域问题
在HTML5中有“Cross-Origin Resource Sharing”的新特性，来赋予开发者权⼒决定资源是否允许被跨域访问。CORS是⼀个W3C 标准，全称是"跨域资源共享"（Cross-origin resource sharing）。它允许浏览器向跨源服务器，发出XMLHttpRequest请求，从⽽克服了AJAX只能同源使⽤的限制。整个CORS通信过程，都是浏览器⾃动完成，不需要⽤户参与。对于开发者来说，CORS通信与同源的AJAX通信没有差别，代码完全⼀样。浏览器⼀旦发现AJAX请求跨源，就会⾃动添加⼀些附加的头信息，有时还会多出⼀次附加的请求，但⽤户不会有感觉。
因此，实现CORS通信的关键是服务器。只要服务器实现了CORS接⼝，就可以跨源通信
1.注解⽅式解决跨域
使⽤springMVC的注解必须是spring 4.2及以上的版本才⽀持
@CrossOrigin(origins = "*", maxAge = 3600)
@RestController
@RequestMapping("/test")
public class TestController{
@RequestMapping("/{id}")
public Account retrieve(@PathVariable Long id) {
// DO
}
@RequestMapping(method = RequestMethod.DELETE, path = "/{id}")
public void remove(@PathVariable Long id) {
// DO
}
}
这⾥指定当前的TestController中所有的⽅法可以处理所有域上的请求，当然能加在每⼀个单独的请求接⼝之上

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。