SpringBoot 跨域问题（CORS）彻底解决方案

在前后端分离项目中跨域CORS是前端同学联调时最常遇到的问题没有之一。浏览器同源策略限制、请求被拦截、控制台报CORS error都是典型的跨域现象。今天我们来讲讲什么是跨域、为什么会跨域、SpringBoot 最全跨域解决方案。一、什么是跨域为什么会出现1. 同源策略浏览器安全限制浏览器只允许协议 域名 端口 完全一致才能正常请求。只要有一项不一样就会触发跨域拦截http://localhost:8080→http://localhost:9090端口不同 → 跨域http://localhost:8080→http://127.0.0.1:8080域名不同 → 跨域http://localhost:8080→https://localhost:8080协议不同 → 跨域2. 跨域报错特征控制台红色错误Access to XMLHttpRequest at... blocked by CORS policy前端请求发送失败后端收不到请求OPTIONS 预检请求被拦截二、SpringBoot 跨域 4 种解决方案方案 1注解方式最简单单个接口/Controller在Controller 类上加一个注解1RestController 2RequestMapping(/user) 3CrossOrigin// 允许所有跨域 4publicclassUserController{ 5}支持精细化配置1CrossOrigin( 2 origins http://localhost:8081,// 只允许这个前端地址 3 maxAge 3600 4)优点简单缺点只能单个Controller生效不适合大型项目方案 2全局配置类企业最常用一次配置全局所有接口生效。创建CorsConfig.java1importorg.springframework.context.annotation.Bean; 2importorg.springframework.context.annotation.Configuration; 3importorg.springframework.web.cors.CorsConfiguration; 4importorg.springframework.web.cors.UrlBasedCorsConfigurationSource; 5importorg.springframework.web.filter.CorsFilter; 6 7/** 8* 全局跨域配置 9*/ 10Configuration 11publicclassCorsConfig{ 12 13Bean 14publicCorsFiltercorsFilter(){ 15CorsConfiguration config newCorsConfiguration(); 16// 1. 允许所有域名跨域生产可指定具体地址 17 config.addAllowedOriginPattern(*); 18// 2. 允许所有请求头 19 config.addAllowedHeader(*); 20// 3. 允许所有请求方法 21 config.addAllowedMethod(*); 22// 4. 允许携带CookieToken、Session 23 config.setAllowCredentials(true); 24// 5. 预检有效期 25 config.setMaxAge(3600L); 26 27UrlBasedCorsConfigurationSource source newUrlBasedCorsConfigurationSource(); 28 source.registerCorsConfiguration(/**, config); 29returnnewCorsFilter(source); 30} 31}✅ 复制即用全局所有接口立刻解决跨域方案 3Spring Security 中的跨域配置如果项目集成了Spring Security / Sa-Token / Shiro必须在安全框架中开启跨域1Bean 2publicSecurityFilterChainsecurityFilterChain(HttpSecurity http)throwsException{ 3 http 4.cors()// 开启跨域 5.and() 6.csrf().disable(); 7return http.build(); 8}重点安全框架拦截优先级最高只配置方案2会失效方案 4网关统一处理微服务项目Spring Cloud / Spring Gateway 项目必须在网关配置跨域不要在微服务里配置。application.yml1spring: 2 cloud: 3 gateway: 4 globalcors: 5 cors-configurations: 6 [/**]: 7allowedOriginPatterns:* 8allowedHeaders:* 9allowedMethods:* 10allowCredentials:true三、为什么配置了还跨域1. 配置不生效的常见原因Spring Security / 权限框架拦截→ 必须开启.cors()跨域配置类未被扫描→ 检查包路径、Configuration重复配置跨域→ 多个跨域配置冲突前端携带了自定义请求头→ 必须允许所有头使用了 CrossOrigin 全局配置冲突2. 解决方案直接使用方案2全局CorsFilter并且权限框架中开启 cors几乎 100% 解决所有跨域问题。四、生产环境跨域建议不要用 allowedOrigins(*)要指定前端域名1config.addAllowedOrigin(https://www.xxx.com);**允许携带Cookie时不能用 * **预检请求缓存时间设长一点maxAge微服务只在网关配置跨域五、一句话总结跨域是浏览器安全限制后端必须开启 CORS单体项目用全局 CorsFilter方案2安全框架项目必须.cors()开启微服务在网关统一配置配置一次永久告别 CORS 错误