1. 问题

在学习Angular时，使用以下代码发起POST请求，

this.http.post("", body, {headers: headers})

会出现以下错误提示。

已拦截跨源请求：同源策略禁止读取位于 的远程资源。（原因：CORS 头缺少 'Access-Control-Allow-Origin'）。

原因是使用得RESTful没有配置跨源CORS设置。

2. 解决

使用 Boot的@Configuration和@Bean追加一个基于Filter的CORS配置。使用到的类有：CorsConfiguration和UrlBasedCorsConfigurationSource。

代码如下：

 

@Configurationpublic class SecurityCorsConfiguration {		@Bean	public FilterRegistrationBean corsFilter() {		UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();		CorsConfiguration config = new CorsConfiguration();		config.setAllowCredentials(true);		config.addAllowedOrigin("http://localhost:4200");		config.addAllowedHeader(CorsConfiguration.ALL);		config.addAllowedMethod(CorsConfiguration.ALL);		source.registerCorsConfiguration("/**", config);		FilterRegistrationBean bean = new FilterRegistrationBean(new CorsFilter(source));		bean.setOrder(Ordered.HIGHEST_PRECEDENCE);		return bean;	}}

 

 

 

以上表示许可来自 的所有请求header、请求方法、请求路径。

有无跨源CORS设置时的OPTIONS请求的header，请参照：