在已部署的 reactjs + springboot 应用程序上启用 CORS 请求 [关闭]答案

【问题标题】：Enable CORS request on deployed reactjs + springboot application [closed]在已部署的 reactjs + springboot 应用程序上启用 CORS 请求 [关闭]
【发布时间】：2020-09-06 20:37:56
【问题描述】：

我有全栈应用程序，前端带有 reactjs，后端带有 springboot。在本地主机上完美运行，但是当我将它部署在谷歌计算引擎虚拟机上时，它停止工作并开始抛出 CORS 错误。
代码：
反应：

class RegisterPage extends Component {
    constructor(props) {
....
    axios.defaults.headers.post['Content-Type'] = 'application/json;charset=utf-8';
    axios.defaults.headers.post['Access-Control-Allow-Origin'] = '*';
}
....
handleRegister(event) {
...
axios.post('http://localhost:8443/api/v1/auth/sign-up', credentials)
            .then((response) => {
                this.setState({
                    requestResult: "registration successful!"
                })
            }).catch(resp => {
            this.setState({
                requestResult: "something went wrong :("
            })
        })
...
}

我还向 Spring 添加了映射：

@SpringBootApplication
public class PoisApplication {
    public static void main(String[] args) {
        SpringApplication.run(PoisApplication.class, args);
    }
    @Bean
    public WebMvcConfigurer corsConfigurer() {
        return new WebMvcConfigurer() {
            @Override
            public void addCorsMappings(CorsRegistry registry) {
                registry.addMapping("/**")
                .allowedOrigins("*")
                .allowedMethods("GET", "POST", "PUT", "DELETE", "HEAD");
            }
        };
    }
}

可能是什么问题？我现在没有想法，所以任何帮助都会很棒。

编辑：尝试将其添加到 spring security

protected void configure(HttpSecurity http) throws Exception {
        http.cors().and(). ...
...
}

@Bean
    CorsConfigurationSource corsConfigurationSource() {
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**", new CorsConfiguration().applyPermitDefaultValues());
        return source;
    }

甚至这个

@Bean
    CorsConfigurationSource corsConfigurationSource() {
        CorsConfiguration configuration = new CorsConfiguration();
        configuration.setAllowedOrigins(Arrays.asList("http://localhost:3000",
"http://my_ip:3000"));
        configuration.setAllowedMethods(Arrays.asList("GET", "POST", "PUT", "DELETE", "HEAD", "OPTIONS"));
        configuration.setAllowedHeaders(Arrays.asList("Access-Control-Allow-Headers", "Access-Control-Allow-Origin",
                "Access-Control-Request-Method", "Access-Control-Request-Headers", "Origin",
                "Cache-Control", "Content-Type"));
        final UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**", configuration);
        return source;
    }

没有任何帮助！

【问题讨论】：

如何发送参数？
发送参数是什么意思？
删除axios.defaults.headers.post['Access-Control-Allow-Origin'] = '*'。 Access-Control-Allow-Origin 不是请求标头。
已删除，没有帮助:(
您的发送凭证类型？

标签： reactjs spring-boot deployment cors google-compute-engine

【解决方案1】：

所以，问题和我想的不一样。浏览器控制台中的 CORS 错误可能意味着“服务器没有响应”，这就是问题所在——我的 React 前端向错误的地址发出请求（部署在谷歌计算引擎上的 React 服务器正在向 localhost 发出请求——不知何故 localhost 意味着我的计算机，我正在使用的那个，很明显，我没有在我的本地主机上启动 spring 服务器）。如果有人遇到此问题，请检查您期望响应的域。

【讨论】：