带有 Webflux 的 Spring Boot：请求的资源上不存在“Access-Control-Allow-Origin”标头答案

【问题标题】：Spring Boot with Webflux: No 'Access-Control-Allow-Origin' header is present on the requested resource带有 Webflux 的 Spring Boot：请求的资源上不存在“Access-Control-Allow-Origin”标头
【发布时间】：2020-05-14 05:59:44
【问题描述】：

我尝试构建一个 Spring Boot 后端并将我的 React 前端与它连接起来。在我的本地部署中，我的 API 请求失败，因为 localhost:3000 不支持 CrossOrigin。我在 Spring Boot 中插入了“CORSGlobalConfig”：

@Configuration
@EnableWebFlux
public class CorsGlobalConfig implements WebFluxConfigurer {
    @Override
    public void addCorsMappings(CorsRegistry corsRegistry) {
        corsRegistry.addMapping("/**")
                .allowedOrigins("http://localhost:3000")
                .allowedMethods("PUT","POST","GET");
    }
}

在我看来，这应该可以正常工作，但有些地方不对。我需要在某处实现我的配置吗？错误如下所示：

Access to XMLHttpRequest at 'http://localhost:8080/REQUESTPATH'
from origin 'http://localhost: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.

感谢您的帮助！

【问题讨论】：

标签： reactjs spring spring-boot cors spring-webflux

【解决方案1】：

如果您使用的是 Spring Securuty，请查看其 cors 配置。类似于 bnexd 的建议，但原生注入到安全过滤器链中

@Bean
public SecurityWebFilterChain securityFilterChain(ServerHttpSecurity http) {
    return http
        .cors().configurationSource(createCorsConfigSource()).and()
        // your security rules
        .build();
}

public CorsConfigurationSource createCorsConfigSource() {
    UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
    CorsConfiguration config = new CorsConfiguration();
    config.addAllowedOrigin("http://localhost:3000");
    config.addAllowedMethod("OPTIONS");
    config.addAllowedMethod("GET");
    config.addAllowedMethod("PUT");
    config.addAllowedMethod("POST");
    config.addAllowedMethod("DELETE");

    source.registerCorsConfiguration("/**", config);
    return source;
}

【讨论】：

【解决方案2】：

我通过将以下 CorsConfig 添加到“com.package.project.config”来解决此问题：

@Configuration
public class CorsConfig {

    @Bean
    public CorsFilter corsFilter() {
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        CorsConfiguration config = new CorsConfiguration();
        config.addAllowedOrigin("http://localhost:3000");
        config.addAllowedMethod("OPTIONS");
        config.addAllowedMethod("GET");
        config.addAllowedMethod("PUT");
        config.addAllowedMethod("POST");
        config.addAllowedMethod("DELETE");

        source.registerCorsConfiguration("/api/v2/**", config);
        return new CorsFilter(source);
    }

}

还为“Access-Control-Allow-Headers”、“Access-Control-Allow-Methods”和“Access-Control-Allow-Origin”添加过滤器（在“com.package.project.filter”处）。他们都是这样建立起来的：

@Component
public class AddControlHeaderWebFilter implements WebFilter {

    @Override
    public Mono<Void> filter(ServerWebExchange exchange, WebFilterChain chain) {
        exchange.getResponse()
                .getHeaders()
                .add("Access-Control-Allow-Headers", "*");
        return chain.filter(exchange);
    }
}

希望这可以帮助遇到同样问题的人！

来源：https://www.baeldung.com/spring-response-header
配置来源：https://github.com/szerhusenBC/jwt-spring-security-demo

【讨论】：

【解决方案3】：

通常，我认为您的配置没有问题。

但您可以添加选项 OPTIONS。

.allowedMethods("PUT","POST","GET" "OPTIONS");

【讨论】：

我之前用“OPTIONS”尝试过，但没有任何反应。当我禁止“GET”时，它将不起作用，而当我允许“GET”时，它会接收数据。这只是在我想“POST”或“PUT”时发生。我不确定为什么会这样。不过感谢您的帮助！
您一直在尝试删除 allowedMethods。
没有变化...我不认为我们的逻辑失败了。