Spring Boot 跨域问题终极拆解

Spring Boot 跨域问题终极拆解——从同源策略到一行配置搞定面试常问、开发必会。本文用大白话把跨域、CORS、WebMvcConfigurer三个概念彻底拆开附门禁比喻助记。一、什么是跨域为什么端口不同也算跨域浏览器的核心安全规则——同源策略Same-Origin Policy。判断两个 URL 是否同源看三样东西要素示例协议httpvshttps域名localhostvswww.baidu.com端口号8080、8081、3000三样全一样才算同源任意一个不同就是跨域浏览器直接拦截前端拿后端数据。典型场景前端http://localhost:8080 后端http://localhost:8081域名都是localhost但端口8080 ≠ 8081浏览器判定为跨域前端fetch/axios请求直接报错。二、CORS 是什么CORS Cross-Origin Resource Sharing跨域资源共享。它是一个标准机制用来告诉浏览器这个后端允许被其他源的网页访问。工作流程前端(8080) → 发请求 → 后端(8081) ↓ 后端在响应头里加一句 Access-Control-Allow-Origin: http://localhost:8080 ↓ 浏览器看到这个头 → 放行数据给前端 没看到这个头 → 报跨域错误核心结论解决跨域的唯一手段就是让后端响应时带上允许跨域的 HTTP 头。三、WebMvcConfigureraddCorsMappings是什么这是 Spring Boot 提供的全局 CORS 配置入口。组件角色比喻WebMvcConfigurerSpring MVC 的装修队实现它就拿到整个 Web 模块的配置权addCorsMappings装修队里专门负责跨域通访规则的那支小队你只需一次配置Spring 会在每次响应时自动帮你加上允许跨域的头不用每个 Controller 都写一遍。标准写法Configuration public class CorsConfig implements WebMvcConfigurer { ​ Override public void addCorsMappings(CorsRegistry registry) { registry.addMapping(/**) // 所有路径 .allowedOrigins(http://localhost:8080) // 允许的前端源 .allowedMethods(GET, POST, PUT, DELETE) // 允许的请求方法 .allowedHeaders(*) // 允许的请求头 .allowCredentials(true); // 允许携带 Cookie } }四、门禁比喻助记概念生活类比跨域你家大楼前端要去隔壁小区后端拿快递保安浏览器发现你不是该小区的不让进CORS隔壁小区业主后端提前跟保安说允许 A 栋 8080 室的人来取件门口贴了许可条WebMvcConfigurer addCorsMappings在隔壁物业一次性登记所有房间通访规则以后不用每次都去门口贴条五、一句话总结后端通过一个Configuration类实现WebMvcConfigurer在addCorsMappings方法里声明允许前端 8080 端口跨域访问Spring 自动在每次响应时带上Access-Control-Allow-Origin头——跨域问题解决。