Spring Boot配置CORS后React Admin跨域及restProvider报错解决

一、Spring Boot端CORS策略拦截报错解决方案 #

以下是该场景下常见的配置失效原因及对应解决方法：

• Spring Security兼容问题：如果项目引入了spring-boot-starter-security依赖，单纯实现WebMvcConfigurer的addCorsMappings配置不会生效——Spring Security的过滤链优先级高于MVC的CORS处理逻辑，会直接拦截跨域预检的OPTIONS请求。
  解决方案：
  1. 在Security配置类的HttpSecurity配置中添加http.cors(withDefaults())，启用Security层的CORS支持；
  2. 也可直接注册最高优先级的CorsFilterBean，替代原有MVC配置：

  @Bean
  public CorsFilter corsFilter() {
      CorsConfiguration config = new CorsConfiguration();
      config.addAllowedOriginPattern("http://localhost:3000");
      config.addAllowedHeader("*");
      config.addAllowedMethod("*");
      config.setAllowCredentials(true); // 需携带JWT、Cookie时必须开启
      UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
      source.registerCorsConfiguration("/**", config);
      return new CorsFilter(source);
  }
  

• 配置类未被Spring扫描：如果CorsConfig放置在主启动类的包路径之外，@Configuration注解不会被组件扫描捕获，配置等于未加载。
  解决方案：将CorsConfig移动到主启动类的同包或子包下，或在主启动类上添加@ComponentScan指定扫描该配置类所在路径。
• 自定义拦截器/过滤器拦截预检请求：如果项目加了JWT校验、权限拦截的自定义过滤器/HandlerInterceptor，会默认拦截跨域的OPTIONS预检请求，导致CORS报错。
  解决方案：在自定义过滤器/拦截器中添加逻辑，对所有OPTIONS类型的请求直接放行，不做权限校验。
• Spring Boot 2.4+版本兼容问题：如果后续需要携带凭证（如JWT Token、会话Cookie），原allowedOrigins("http://localhost:3000")在开启allowCredentials(true)时，部分版本会触发跨域校验报错，可替换为allowedOriginPatterns("http://localhost:3000")兼容处理。

二、ra-data-simple-rest（restProvider）运行报错解决方案 #

这类报错很多时候是CORS拦截连带导致的，可先解决CORS问题后再排查以下专属问题：

• 接口路径不匹配：ra-data-simple-rest会自动按照约定拼接请求路径：传入的基础地址 + /<Resource的name值>。比如你定义了<Resource name="list">，前端会默认请求http://localhost:8080/list，如果你的后端接口统一加了前缀（如/api），就会出现404报错。
  解决方案：修改restProvider的基础地址为restProvider("http://localhost:8080/api")，匹配后端实际接口路径；或调整Resource的name值与后端接口路径对应。
• 不符合接口规范要求：ra-data-simple-rest对后端返回格式有固定约定：
  1. 列表接口（GET请求）需在响应头中返回X-Total-Count字段，表示资源总条数；
  2. 返回的资源数据格式需匹配约定的数组/对象结构，不能有多余的封装层级。
     解决方案：调整后端接口格式符合上述约定，或更换为适配你后端格式的dataProvider。
• Resource命名不规范：React Admin默认会将Resource的name值直接拼接为请求路径，大写开头的命名（如DashBoard）会请求对应大写路径的接口，若后端无对应路径就会报错。
  解决方案：将Resource的name修改为小写约定格式，如dashboard、lists，匹配后端接口命名。

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