react-admin 否 'Access-Control-Allow-Origin'

Question

我正在尝试在我的项目中使用 react-admin，这需要 Content-Range。

所以在我的服务器中我写了：

@GetMapping("admin/user")
    ResponseEntity<List<User> > getAll()
    {
        System.out.println(new Date());;

        HttpHeaders responseHeaders = new HttpHeaders();
        responseHeaders.set("Content-Range",
                "posts 0-"+userRepository.findAll().size()+"/"+userRepository.findAll().size());

        return ResponseEntity.ok()
                .headers(responseHeaders)
                .body(userRepository.findAll());
    }

还配置了 CORS :

@Bean
    public WebMvcConfigurer corsConfigurer() {
        return new WebMvcConfigurer() {
            @Override
            public void addCorsMappings(CorsRegistry registry) {
                registry
                        .addMapping("/**")
                        .allowedOrigins("http://localhost:3000");
                registry
                        .addMapping("/admin*")
                        .allowedOrigins("http://localhost:3001")
                        .exposedHeaders("Content-Range");

            }
        };
    }

错误：访问“http://localhost:8080/admin/user?filter=%7B%7D&range=%5B0%2C9%5D&sort=%5B%22id%22%2C%22ASC%22%5D' from origin 'http://localhost:3001”已被 CORS 策略阻止：请求的资源上不存在 'Access-Control-Allow-Origin' header。如果不透明响应满足您的需求，请将请求的模式设置为 'no-cors' 以在禁用 CORS 的情况下获取资源。

为什么会出现此错误？

邮递员工作正常：

后来我还补充说：responseHeaders.set("Origin", "http://localhost:3001");

还是没有希望。

如何解决？

Answer 1

这是浏览器引起的cros错误。

您可以使用您的 React 应用配置您的代理 package.json 文件只需添加

"proxy" : "http://localhost:8080"

现在您只需提供 api 请求的相对路径

 Example : '/admin/user/'  // your app going to make request to http://localhost:8080/admin/user

还要确保您允许 url 您的后端

                  registry
                    .addMapping("/**")
                    .allowedOrigins("http://localhost:3000");   // make sure this is right url of your frontend

react-admin 否 'Access-Control-Allow-Origin'

react-admin No 'Access-Control-Allow-Origin'

spring

cors

reactjs

spring-boot

react-admin