(一)跨域的原因
浏览器的同源策略:
限制了从一个源加载的文档或脚本如何与来自另一个源的资源进行交互。这是用于隔离潜在恶意文件的重要安全机制
只有协议、主机、端口三者都相等才算同源(某些浏览器端口不计入标准中,公司域名等高可信度的域名也不必遵守同源策略)
(二)跨域访问过程
跨源网络访问:
通常允许跨域写操作 例如:链接、重定向、以及表单提交 (少数http请求需要加preflight)
preflight请求首次通过options方法向另一个域上的资源发送HTTP请求,以确定实际请求是否可以安全发送
CORS是W3C制定的一种跨域资源共享技术标准,其目的是解决前端的跨域请求
假如服务端支持CORS,响应头中有一个Access-Control-Allow-Orign字段,用来记录可以访问该资源的域
当浏览器收到这样的响应信息之后,会提取出这个字段的值,如果发现该值包含请求的域,就知道该跨域是被允许的
(三)spring boot中三种配置方式
1.使用@CrossOrigin注解
@CrossOrigin(value="http://localhost:3000",maxAge=1800,allowedHeaders="*")
@RequestMapping("/get")
public String get() {
return "get";
}
这是一种细粒度的配置,具体到接口,其中
value值表示支持的域
maxAge表示探测请求的有效期(对于delete、put或者自定义头信息的复杂请求,往往会先发送options探测请求,看看是否支持跨域访问,探测请求不用每次都发送,过期后才会再次发送)
allowedHeaders表示允许的头信息
2.通过覆写WebMvcConfigurer中的addCorsMappings方法进行配置
@Configuration
public class CorsConfig implements WebMvcConfigurer{
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**")
.allowedHeaders("*")
.allowedMethods("*")
.maxAge(1800)
.allowedOrigins("http://localhost:3000");
}
}
3.通过CorsFilter进行配置
@Configuration
public class CorsConfiguratin{
@Bean
public CorsFilter corsFilter() {
final UrlBasedCorsConfigurationSource urlBasedCorsConfigurationSource = new UrlBasedCorsConfigurationSource();
final CorsConfiguration corsConfiguration = new CorsConfiguration();
corsConfiguration.setAllowCredentials(true);
corsConfiguration.addAllowedOrigin("*");
corsConfiguration.addAllowedHeader("*");
corsConfiguration.addAllowedMethod("*");
urlBasedCorsConfigurationSource.registerCorsConfiguration("/**", corsConfiguration);
return new CorsFilter(urlBasedCorsConfigurationSource);
}
}