在开发Spring Boot和reactjs应用程序期间处理CORS

Question

this problem is kinda new to me because I used to develop angular applications earlier but now I have reactjs as a front-end technology.

My problem is CORS. My react app works on port 3000 and my spring boot app on 8080. Adding @CrossOrigin on my controller handles the problem pretty well but is there a way to somehow configure this on the front-end side? Something like a switch that you flip when app is supposed to work locally and stop this when working in production environment?

Answer 1

Yes. You can use reverse proxy.

It's very common problem.

See here.

http://www.pierre-beitz.eu/2017/01/24/Dealing-with-CORS-in-a-Development-Environment-Using-a-Reverse-Proxy.html

By that all requests would be going to api and will further resolve issue.

Right now on phone. Can come on lappy if you have any more questions.

Adding another solution post comment

Add the following code in your MainApplication.java

@Bean
    public FilterRegistrationBean corsFilter() {
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        CorsConfiguration config = new CorsConfiguration();
        config.setAllowCredentials(true);
        config.addAllowedOrigin("http://domain1.com");
        config.addAllowedHeader("*");
        config.addAllowedMethod("*");
        source.registerCorsConfiguration("/**", config);
        FilterRegistrationBean bean = new FilterRegistrationBean(new CorsFilter(source));
        bean.setOrder(0);
        return bean;
    }

and map the class with @Configuration annotation