从托管前端访问 API 时出现 CORS 错误（但适用于本地主机）

Question

当我尝试从托管前端访问后端 API 时，我遇到了 CORS 问题，但当前端在本地运行时，相同的请求也有效。

详情如下：

前端（本地）：

http://localhost:3000

前端（托管）：

http://example.com:3000

（example.com 被替换 通过 IP 地址）

后端：

http://example.com:3500

（example.com 替换为 IP 地址）

错误：

"Access to XMLHttpRequest at 'http://example.com:3500/api/login' from origin 'http://example.com:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource."

当我在 http://localhost:3000 上本地运行前端并向后端发出请求时 http://example.com:3500 ，一切正常。 当我将前端部署到 http://example.com:3000 并尝试访问后端 http://example.com:3500 时，我收到了上面提到的 CORS 错误。

以下是cors配置。

@Bean
public CorsConfigurationSource corsConfigurationSource() {
    CorsConfiguration corsConfiguration = new CorsConfiguration();        corsConfiguration.setAllowedOrigins(List.of("http://example.com:3000"));
    corsConfiguration.setAllowedMethods(List.of("GET", "POST", "OPTIONS", "PUT", "DELETE"));
    corsConfiguration.setAllowCredentials(true);
    corsConfiguration.setAllowedHeaders(List.of("*"));
    corsConfiguration.setMaxAge(3600L);
    UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
    source.registerCorsConfiguration("/**", corsConfiguration);
    return source;
}

Answer 1

在安全过滤器链中，禁用 cors 配置。这是代码行：

.cors(cors-> cors.disable())

不要使用 corsConfigurationSource()，而是使用上面的代码行（此代码行应该位于安全过滤器链内）。