java - Spring Boot 应用程序与 Angular 应用程序的集成

Question

我想将 Spring Boot 应用程序与 Angular 应用程序集成。两个应用程序都在不同的服务器上运行。当我尝试从 Angular 应用程序 API 访问 REST API 时，成功命中，但在 UI 上收到错误响应。

Access to XMLHttpRequest at 'http://localhost:9092/jobs/postal/launch' from origin 'http://localhost:4200' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

我在后端实现了CORS协商。所以我只是希望能够在没有任何安全性的情况下从 UI 访问后端。

我还阅读了下面的文章来了解 CORS 和 CSRF。

https://markitzeroday.com/x-requested-with/cors/2017/06/29/csrf-mitigation-for-ajax-requests.html

@Bean
public WebMvcConfigurer corsConfigurer() {
    return new WebMvcConfigurer() {
        @Override
        public void addCorsMappings( CorsRegistry registry) {
            registry.addMapping(corsMapping)
                .allowedOrigins(allowedOrigins)
                .allowedMethods(allowedMethods).allowedHeaders("X-Requested-With");
        }
    };
}

我只是想知道如何成功地将 Spring Boot 应用程序与 Angular 应用程序集成。

如果有任何文档或链接可以帮助我，请告诉我。

Answer 1

CORS 管理对来自部署后端应用程序之外的服务器的请求的访问。默认情况下，出于安全原因，它设置为仅后端托管服务器，这意味着仅允许来自后端托管服务器的请求。

在您的情况下，由于后端和 UI 都在单独的服务器上运行，您需要在后端添加一些代码更改以允许 UI 访问后端。

您可以拥有一个类ResourceApplication.java，如下所示:

@RequestMapping("/")
@CrossOrigin(origins="*", maxAge=3600)
public Message home() {
  return new Message("Hello World");
}

以上摘自this教程由 spring.io 提供，如果您将 spring-boot 与 Angular 集成，那么它是一个很好的指南。如果向下滚动，您将找到 CORS 部分。