使用Axios调用SpringBoot REST API提示No 'Access-Control-Allow-Origin'错误如何解决

1. 优先修正错误的全局CORS配置 #

你现有配置中对同一个路径/**重复注册了两次CORS规则，第二次allowedOrigins()为空的配置会直接覆盖之前的合法配置，是核心问题，修正后代码如下：

@Bean
public WebMvcConfigurer corsConfigurer() {
    return new WebMvcConfigurer() {
        @Override
        public void addCorsMappings(CorsRegistry registry) {
            registry.addMapping("/**")
                    // 允许的前端源地址，多个用逗号分隔
                    .allowedOrigins("http://localhost:3000")
                    // 允许的请求方法，必须包含OPTIONS预检请求
                    .allowedMethods("GET", "POST", "PUT", "DELETE", "OPTIONS")
                    .allowedHeaders("*")
                    // 如果需要跨域传Cookie设为true，不需要可以省略
                    .allowCredentials(true)
                    // 预检请求缓存时间，减少重复预检请求
                    .maxAge(3600);
        }
    };
}

2. 若集成Spring Security必须额外开启CORS支持 #

Spring Security的请求拦截优先级高于WebMvc的CORS配置，未单独开启的话CORS规则不会生效，在Security配置类中添加cors()开启即可：

@Configuration
public class SecurityConfig extends WebSecurityConfigurerAdapter {
    @Override
    protected void configure(HttpSecurity http) throws Exception {
        http
            // 开启CORS支持，自动复用上面的全局CORS配置
            .cors().and()
            // 其余你原有Security配置保持不变即可，示例如下：
            .csrf().disable()
            .authorizeRequests()
            .anyRequest().authenticated();
    }
}

3. 清理所有重复的CORS配置 #

删除以下冗余配置，多份CORS规则会导致响应头冲突、覆盖问题：

• 控制器类/方法上添加的@CrossOrigin注解
• @ModelAttribute中手动给HttpServletResponse设置Access-Control-Allow-Origin的代码
• Axios拦截器中手动添加的跨域相关请求头

4. 可选配置：Axios跨域传Cookie适配 #

如果你的请求需要携带Cookie，只需在Axios全局配置中加一行即可，不需要额外加其他跨域头：

axios.defaults.withCredentials = true

5. 特殊场景排查 #

如果以上配置都做完仍报错，排查是否有自定义过滤器/拦截器优先级高于CORS过滤器，提前返回了响应导致CORS头未被写入。如果有自定义过滤器，调整其优先级低于CORS过滤器，或者在过滤器中对OPTIONS预检请求直接返回200状态并带上CORS响应头。

内容的提问来源于stack exchange，提问作者Khushbu Patel