No 'Access-Control-Allow-Origin' header is present on the requested resource SpringBoot 跨域

跨域说明

前后端分离下，跨域已是一个老生常谈的话题，但很多小伙伴还是经常面临这样的问题，且解决方案多变多样。这里介绍一种简单直接的后端解决方案。

解决跨域（服务端）

/**
 * CorsConfig-跨域
 * 
 * @author	ylyue
 * @since	2018年11月26日
 */
@Slf4j
@Configuration
public class CorsFilterConfig {
	
	// CorsConfig-跨域
	
	@Bean
	@ConditionalOnMissingBean
	public CorsFilter corsFilter() {
		final UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
		final CorsConfiguration config = new CorsConfiguration();
		
		config.setAllowCredentials(true);
		config.setAllowedHeaders(Arrays.asList("*"));
		config.setAllowedMethods(Arrays.asList("*"));
		config.setAllowedOrigins(Arrays.asList("*"));
		config.setMaxAge(3600L);
		
		// 设置response允许暴露的Headers
//		config.setExposedHeaders(exposedHeaders);
//		config.addExposedHeader("token");
		
		source.registerCorsConfiguration("/**", config);
		
		log.info("【初始化配置-跨域】默认任何情况下都允许跨域访问 ... 已初始化完毕。");
		return new CorsFilter(source);
	}
	
}

基于yue-library解决跨域

上述代码就是从yue-library中摘出来的，所以基于yue-library的项目默认已解决跨域等问题。yue-library是SpringBoot的一个增强库，引入项目依赖即可解决跨域

maven项目，在pom.xml文件中添加如下一段代码，并将${version}替换为对应版本号：

<parent>
	<groupId>ai.ylyue</groupId>
	<artifactId>yue-library-dependencies</artifactId>
	<version>${version}</version>
</parent>

随后引入所需要的模块，如基础库：yue-library-base

<dependencies>
	<dependency>
		<groupId>ai.ylyue</groupId>
		<artifactId>yue-library-base</artifactId>
	</dependency>
	...
</dependencies>

点击快速了解yue-library

结语

跨域问题建议服务端解决即可，没必要开启跨域安全访问限制，他也只能阻止一些浏览器中的JS脚本注入，并不能做到真正的安全访问限制。有问题欢迎在下方留言交流…