前后端分离时候势必会遇到Ajax跨域请求。
Failed to load [http://localhost:8888/get](localhost:8888/get):
Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Origin '[http://localhost:8100](http://localhost:8100/)' is therefore not allowed access.
1. 关于跨域
CORS是一个W3C标准,全称是"跨域资源共享"(Cross-origin resource sharing)。
它允许浏览器向跨源服务器,发出XMLHttpRequest请求,从而克服了AJAX只能使用的限制。
CORS需要浏览器和服务器同时支持。目前,基本浏览器都支持该功能,所以只需要处理好服务端。
2. SpringBoot作为服务端时处理方法
暂发现两种方法。
2.1. 使用@Configuration注释
添加配置类CrossConfig.java
@Configuration
public class CrossConfig {
private CorsConfiguration buildConfig() {
CorsConfiguration corsConfiguration = new CorsConfiguration();
corsConfiguration.addAllowedOrigin("*");
corsConfiguration.addAllowedHeader("*");
corsConfiguration.addAllowedMethod("*");
return corsConfiguration;
}
@Bean
public CorsFilter corsFilter() {
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
source.registerCorsConfiguration("/**", buildConfig());
return new CorsFilter(source);
}
}
2.2 在Application.java中注册Filter
/**
* 跨域过滤器设置
*/
private CorsConfiguration buildConfig() {
CorsConfiguration corsConfiguration = new CorsConfiguration();
corsConfiguration.addAllowedOrigin("*");
corsConfiguration.addAllowedHeader("*");
corsConfiguration.addAllowedMethod("*");
return corsConfiguration;
}
/**
* 跨域过滤器
*/
@Bean
public CorsFilter corsFilter() {
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
source.registerCorsConfiguration("/**", buildConfig());
return new CorsFilter(source);
}
3. 结语
个人偏爱第二种方案,代码少,各种Filter都添加在启动类中便于管理。
网友评论