Spring Boot跨域请求

跨域请求（CORS）是什么？

跨域请求（Cross-Origin Resource Sharing, CORS）是指浏览器出于安全限制，阻止网页从一个域名（源）向另一个域名发起 HTTP 请求的行为。例如：
• 前端页面运行在 https://example.com，但请求的后端 API 是 https://api.another.com。
• 浏览器会拦截这种跨域请求，除非服务器明确允许。

---

1. 为什么需要跨域？

浏览器的同源策略（Same-Origin Policy）

• 规则：浏览器默认禁止网页通过 JavaScript 访问不同源（协议、域名、端口任一不同）的资源。
• 目的：防止恶意网站窃取用户数据（如 Cookie）。
• 示例：

请求来源	目标 API	是否跨域	原因
https://example.com	https://example.com/api	否	同源
http://example.com	https://example.com	是	协议不同（HTTP vs HTTPS）
https://example.com	https://api.example.com	是	子域名不同
https://example.com	https://example.com:8080	是	端口不同

---

2. 如何解决跨域问题？

（1）服务端配置 CORS

后端服务器Spring Boot开启跨域支持：

方案一：在IndexController上添加**@CrossOrigin**注解

@RestController
@RequestMapping(value = "/admin/system/index")
@CrossOrigin(allowCredentials = "true" , originPatterns = "*" , allowedHeaders = "*") 
public class IndexController {

}

弊端：每一个controller类上都来添加这样的一个接口影响开发效率、维护性较差

方案二：添加一个配置类配置跨域请求

@Component
public class WebMvcConfiguration implements WebMvcConfigurer {

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")      // 添加路径规则
                .allowCredentials(true)               // 是否允许在跨域的情况下传递Cookie
                .allowedOriginPatterns("https://example.com")           // 允许请求来源的域规则
            	.allowedMethods("*")
                .allowedHeaders("*") ;                // 允许所有的请求头
    }
    
}

（2）代理服务器（Proxy）

让前端请求同域名的代理服务，由代理转发请求到目标 API：

# Nginx 配置示例
location /api/ {
    proxy_pass https://api.example.com/;
}

---

3. 预检请求（Preflight Request）

对于复杂请求（如带自定义头或非简单方法的请求），浏览器会先发送一个 OPTIONS 预检请求，确认服务器是否允许跨域。
示例流程：

1. 浏览器发送 OPTIONS 请求：

   Access-Control-Request-Method: POST
   Access-Control-Request-Headers: Content-Type
   

2. 服务器响应：

   Access-Control-Allow-Origin: *
   Access-Control-Allow-Methods: POST, GET, OPTIONS
   Access-Control-Allow-Headers: Content-Type
   

3. 浏览器确认后，才发送真正的 POST 请求。