在现代web应用开发中，前后端分离架构日益普及。当后端（如spring boot）和前端（如react）部署在不同的域或端口时，浏览器出于安全考虑会实施同源策略，从而引发跨域资源共享（cors）错误。即使服务器端配置了看似允许所有来源、所有方法和所有头的cors策略，开发者仍可能遇到类似get http://your-ec2-ip:8080/api/... net::err_failed 200的错误。这个错误信息尤其令人困惑，因为它显示请求成功到达服务器并返回了200 ok状态码，但浏览器最终阻止了响应数据的加载。
开发者通常会尝试以下方法来解决CORS问题：
客户端代理配置： 在开发环境中，使用http-proxy-middleware等工具将前端请求代理到后端，但这仅限于开发阶段，部署后无效。
客户端axios配置： 设置baseURL、添加{withCredentials: true}到请求头，或者使用axios实例。
服务器端CorsConfigurationSource Bean： 在Spring Boot应用中，通过定义CorsConfigurationSource类型的@Bean来配置CORS策略，例如：
@Bean
CorsConfigurationSource corsConfigurationSource() {
CorsConfiguration configuration = new CorsConfiguration();
configuration.setAllowedOrigins(Arrays.asList("*")); // 允许所有来源
configuration.setAllowedMethods(Arrays.asList("GET","POST", "PATCH", "DELETE")); // 允许所有方法
configuration.setAllowedHeaders(Arrays.asList("*")); // 允许所有头
configuration.setAllowCredentials(true); // 允许发送凭证
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
source.registerCorsConfiguration("/**", configuration);
return source;
}尽管上述代码看起来已经非常宽松，但在许多情况下，尤其当项目中引入了Spring Security时，这种独立的CorsConfigurationSource Bean可能不会被Spring Security的过滤器链正确识别或优先处理，导致CORS问题依然存在。
当Spring Security被引入项目时，它会接管HTTP请求的安全管理，包括CORS处理。因此，最可靠的CORS配置方法是将其直接整合到Spring Security的配置中。
核心思想： 在Spring Security的WebSecurityConfig中，通过HttpSecurity对象显式地配置CORS策略。
以下是解决此类CORS问题的推荐Spring Security配置示例：
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.security.config.annotation.web.builders.HttpSecurity;
import org.springframework.security.config.annotation.web.configuration.EnableWebSecurity;
import org.springframework.security.config.annotation.web.configuration.WebSecurityConfigurerAdapter;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.CorsConfigurationSource;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import java.util.Arrays;
import java.util.Collections; // 导入Collections
@Configuration
@EnableWebSecurity
public class WebSecurityConfig extends WebSecurityConfigurerAdapter {
@Override
protected void configure(HttpSecurity httpSecurity) throws Exception {
// 创建一个CorsConfiguration实例
CorsConfiguration corsConfiguration = new CorsConfiguration();
// **重要：如果客户端使用withCredentials，AllowedOrigins不能为"*"。**
// 建议明确列出允许的来源。例如：
// corsConfiguration.setAllowedOrigins(Arrays.asList("http://localhost:3000", "http://pre-project-038-client.s3-website.ap-northeast-2.amazonaws.com"));
// 如果不使用withCredentials，或者确定不会有凭证，可以允许所有来源
corsConfiguration.setAllowedOrigins(Collections.singletonList("*")); // 或者明确列出
corsConfiguration.setAllowedMethods(Arrays.asList("GET", "POST", "PUT", "DELETE", "OPTIONS", "PATCH")); // 允许所有常用HTTP方法
corsConfiguration.setAllowedHeaders(Collections.singletonList("*")); // 允许所有请求头
corsConfiguration.setAllowCredentials(true); // 允许发送Cookie等凭证信息
// 将CORS配置源注册到URL路径
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
source.registerCorsConfiguration("/**", corsConfiguration); // 对所有路径应用CORS配置
httpSecurity
// 启用CORS并使用上面定义的配置源
.cors().configurationSource(request -> corsConfiguration)
.and()
// 禁用CSRF防护，对于无状态的RESTful API通常需要禁用
.csrf().disable()
// 配置授权规则
.authorizeRequests()
.antMatchers("/**").permitAll() // 允许所有请求访问所有路径
.anyRequest().permitAll(); // 兜底规则，允许所有其他请求
// .anyRequest().authenticated(); // 如果需要认证，则改为此行
}
}代码解析：
在Spring Boot应用中处理CORS问题，尤其当Spring Security活跃时，最佳实践是将CORS配置直接嵌入到WebSecurityConfig中。通过httpSecurity.cors().configurationSource(...)，您可以确保Spring Security的过滤器链正确应用您的CORS策略。同时，务必注意withCredentials与AllowedOrigins之间的严格匹配要求，这是许多开发者容易忽视的关键细节。遵循这些指南，您将能够有效地解决跨域问题，确保前后端应用在部署后正常通信。
以上就是解决Spring Boot与React应用在AWS部署中CORS错误的终极指南的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
602
收藏
