CORS blocks the requests

Question

Hello, I’m developing a web application with Vue JS in a discipline and another person is making a Rest api with Spring, but when I run the api locally and try to access some of the resources through Postman, it works normally, but when accessing the same resource through the web application CORS blocks and the request does not even reach the api. The same happens if the api is hosted in Heroku for example.

This annotation has already been added to all controllers

And in the VUE JS application

The token I also store in localStorage and set as default header

I’ve tried disabling and activating this extension and it’s the same

That is the mistake:

I don’t know what else to do :/

Answer 1

Try this way, go to your configuration class, this class is annotated with @Configuration if you don’t have create one, and create the following Bean:

@Bean
public CorsFilter corsFilter() {
    final CorsConfiguration config = new CorsConfiguration();
    config.addAllowedHeader("*");
    config.addAllowedMethod("GET");
    config.addAllowedMethod("POST");
    config.addAllowedMethod("PUT");
    config.addAllowedMethod("OPTIONS");
    config.setMaxAge(3600L);

    final UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
    source.registerCorsConfiguration("/**", config);

    return new CorsFilter(source);
}

Some settings change from version to spring version, so when asking always inform the versions you are using.