问题将cookie从Angular Frontend发送到Spring Boot后端

Question

我有一个小项目，我想从我的Angular 18前端发送一个cookie到我的春季启动后端Java版本17中的tomcat10.1.

没有登记，如果我在eclipse内部或与Catalina的常规tomcat一起运行tomcat。我会遇到问题。 我试图在端口4200上使用“ ng Serve”运行时设置CORS过滤器，并在8080的Eclipse上运行tomcat。 我已经在tomcat web.xml中使用corsfilter的cors设置了，并从我的angular呼叫。 我已经在网络上查看了许多教程，并在Stackoverflow上进行了问题。 在我注意到的事情上，许多解释最终设置了会话cookie来验证用户。 我不想要会话cookie。我想要一个常规的cookie，可以跟踪用户。但是我将扩大这个小项目，也许需要处理更多的饼干。

在这里遵循我相信的代码，可以帮助您告诉我我做错了什么。

角代码

export class CabinService {
  private baseURL = environment.domain;

  public httpClient = inject(HttpClient);

  headers: HttpHeaders;

  constructor() {
    this.headers = new HttpHeaders();
    this.headers = this.headers.set('cookie', 'cabinCTRLclientID=a88ce069-74f6-43be-be27-5c02901bb246');
  }

  getClients(): Observable<Client[]> {
    console.log("CabinService - getClients - headers", this.headers);
    return this.httpClient.get<Client[]>(this.baseURL + "clients", { headers: this.headers });
  }

java代码

    @GetMapping("/clients")
    public String getClients(@CookieValue(value = Util.CLIENT_ID_COOKIE_NAME, defaultValue = "") String clientId,
            HttpServletRequest request) {

        List<Client> clients;
        try {
            clients = Util.getClients(request.getLocalAddr(), clientId);
        } catch (CabinException e) {
            logger.error("Failed to get the clients", e);
            clients = new ArrayList<Client>();
        }

        Gson gson = new Gson();
        return gson.toJson(clients, List.class);

    }

web.xml中的CORS过滤器。

    <filter>
        <filter-name>CorsFilter</filter-name>
        <filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
        <init-param>
            <param-name>cors.allowed.origins</param-name>
            <param-value>http://localhost:4200</param-value>
        </init-param>
        <init-param>
            <param-name>cors.support.credentials</param-name>
            <param-value>true</param-value>
        </init-param>
        <init-param>
            <param-name>cors.preflight.maxage</param-name>
            <param-value>10</param-value>
        </init-param>
    </filter>
    <filter-mapping>
        <filter-name>CorsFilter</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>

如果您需要更多我将提供的信息。

我知道图片并不是很受欢迎，但这里有几个。

当我接到邮递员的电话时，后端得到了饼干。如您所见，cookie“ clientId”已填充，请求具有cookie。

流动的图像是我从角应用程序打电话时。如您所见，cookie clientid是空的，请求中的cookie字段为null。

这是来自Firefox的Devtools，标头包含cookie。

问题是，我从Angular In Header发送的cookie并没有一路进入我的春季启动服务。 当我通过Postman发送呼叫，http：// localhost：8080/cabinctrlws/api/客户端时，它可以正常工作。这就是为什么我相信这与我的Corsfilter有关。 另一方面，我可能是错的，这就是为什么我输入这个问题。

任何帮助都会受到赞赏。 对不起，拼写不好。 您不在问题中包含安全过滤器配置，但是我相信，如果您将其添加到Spring Boot应用中的任何

@Configuration

注销的类中，则应该解决该问题。我在运行Localhost上的Spring Back后端运行NextJS-App时正在使用此操作。

    public WebMvcConfigurer corsConfigurer() {
        return new WebMvcConfigurer() {
            @Override
            public void addCorsMappings(@NonNull CorsRegistry registry) {
                registry.addMapping("/**")
                        .allowedOrigins("http://localhost:4200")
                        .allowedMethods("GET", "POST", "OPTIONS", "HEAD")
                        .allowCredentials(true);
            }
        };
    }