摘要
请求跨域问题常见解决方案有以下几种
- jsonp
- iframe
cors
这几种解决方案的对比
jsonp只支持get请求,cors支持全部请求
- cors可以使用普通的XMLHttpRequest,比JSONP有更好的错误处理
- 老式浏览器支持jsonp,不一定支持cors,现代浏览器基本支持cors
iframe不了解,很多人都说尽量避免使用
本文介绍如何使用cors解决跨域问题
正文
支持cors的浏览器
- Chrome 3+
- Firefox 3.5+
- Opera 12+
- Safari 4+
- IE 8+
- …
通过过滤器或拦截器解决cors跨域
添加拦截器或过滤器,加入以下响应头。
response.setHeader("Access-Control-Allow-Origin", "*");
response.setHeader("Access-Control-Allow-Credentials", "true");
response.setHeader("Access-Control-Allow-Headers", "Accept, Accept-Encoding, Accept-Language, Connection, Host, Origin, Referer, User-Agent, Access-Control-Allow-Headers, Authorization, X-Requested-With, Content-Type, DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization,SessionToken");
response.setHeader("Access-Control-Allow-Methods", "*");
response.setHeader("Access-Control-Max-Age", "1728000");
response.setHeader("Access-Control-Allow-Credentials", "true");
response.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
response.setHeader("XDomainRequestAllowed", "1");
response.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
具体原理可以查看该文章或类似文章:https://www.cnblogs.com/keyi/p/6726089.html
通过添加WebMvcConfigurer实现跨域
在WebMvc配置类中重写addCorsMappings方法加入自定义跨域配置即可。
注:jdk1.7以及以下版本应该实现WebMvcConfigurerAdapter类
@Configuration
public class WebConfig implements WebMvcConfigurer {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**").allowedMethods("*");
}
}
针对具体方法设置跨域
@CrossOrigin(origins="http://localhost:8080")
@RestController
@RequestMapping("/api")
public class TestController{
}
通过Spring Boot Actuator配置跨域
若项目中引入了Spring Boot Actuator依赖,可以通过配置Actuator的web端点加入支持
例如:下面的配置表示允许来自example.com的GET和POST请求
management.endpoints.web.cors.allowed-origins = http://example.com
management.endpoints.web.cors.allowed-methods = GET,POST
该配置的相关配置类CorsEndpointProperties
本小节内容来源
SpringBoot参考文档:https://docs.spring.io/spring-boot/docs/2.0.0.RELEASE/reference/htmlsingle/#production-ready-endpoints-cors