跨域资源访问:CORS
介绍:
CORS(Cross-origin resource sharing)是由W3C定制的一种跨域资源共享技术,其目的就是为例解决前端的跨域请求。在javaEE开发中,最常见的前端跨域请求解决方案时JSONP,但是JSONP只支持GET请求;
什么是JavaEE请求:
它的原理是借助script
标签不受浏览器同源策略限制,允许跨域请求资源,因此可以通过script
标签的src
属性,进行跨域访问。
代码如下:
// 1. 前端定义一个 回调函数 handleResponse 用来接收后端返回的数据
function handleResponse(data) {
console.log(data);
};
// 2. 动态创建一个 script 标签,并且告诉后端回调函数名叫 handleResponse
var body = document.getElementsByTagName('body')[0];
var script = document.gerElement('script');
script.src = 'http://www.laixiangran.cn/json?callback=handleResponse';
body.appendChild(script);
// 3. 通过 script.src 请求 `http://www.laixiangran.cn/json?callback=handleResponse`,
// 4. 后端能够识别这样的 URL 格式并处理该请求,然后返回 handleResponse({"name": "laixiangran"}) 给浏览器
// 5. 浏览器在接收到 handleResponse({"name": "laixiangran"}) 之后立即执行 ,也就是执行 handleResponse 方法,获得后端返回的数据,这样就完成一次跨域请求了。
CORS 支持多种 HTTP 请求,它其实就是定义了一套跨域资源请求时,浏览器与服务器之间的交互方式。基本的原理就是通过自定义的 HTTP 请求头来传递信息,进行验证。
CORS的用法:
方法一:使用**@CrossOrigin
**
该注解可用于方法和类上,注解在方法上,表示对该方法的请求进行 CORS 校验,注解在类上(即Controller
上),表示该类内的方法都遵循该 CORS 校验。如下所示:
@Slf4j
@RestController
@RequestMapping("cors")
@CrossOrigin(value = "http://127.0.0.1:5500", maxAge = 1800,allowedHeaders = "*"