从 JS UI 发布到 Java API 时，如何防止 CORS 策略错误

Question

My front end application gives this error:

Access to XMLHttpRequest at 'http://localhost:9025/customer/registerDocs/' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

when this is called:

updateDocsStatus() {
    return ApiService.postData('http://localhost:9025/customer/registerDocs');
}

This is the controller method in the API:

@PostMapping(value = Constants.REGISTER_DOCS_PATH,
        consumes = {MediaType.APPLICATION_JSON_VALUE},
        produces = {MediaType.APPLICATION_JSON_VALUE})
@ResponseStatus(HttpStatus.OK)
public void registerUserForDocs(HttpServletRequest request){
    String username = securityService.getUsername(request);
    customerHelper.registerCustomerForEdocs(username);
}

I can't help feel like the issue is something on the front end. Am I missing anything obvious here?

Answer 1

this is what i use, probably best to use this with a specific development profile

@Configuration
public class CorsConfiguration implements WebMvcConfigurer {

@Override
public void addCorsMappings(CorsRegistry registry) {
    registry.addMapping("/api/**")
            .allowedMethods("*")
            .allowedOrigins("http://localhost:3000")
            .allowedHeaders("*");
}
}

Answer 2

If you're using Spring Security, CORS can be disabled for all paths (not best practice) by adding the follow bean

@Configuration
public class WebConfiguration implements WebMvcConfigurer {

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**").allowedMethods("*");
    }
}

Or you can fine tune to the POST method and your specific documentation path (customer/registerDocs)