I have a strange problem, I have a spring boot backend and angular frontend from localhost:4200

The csrf works perfectly from postman, but does not work from angular

I don’t understand the problem, I did several tests

I don’t use interceptors, I’m testing by obtaining the token directly, which I then reuse, from postman it works perfect

my securconfig.java

@Bean
    public SecurityFilterChain securityFilterChain(HttpSecurity http) throws Exception {
        http.cors(cors -> cors.configurationSource(request -> {
            List<String> allowedOrigins = new ArrayList<>();
            allowedOrigins.add("http://localhost");
            allowedOrigins.add("http://localhost:4200");
            CorsConfiguration config = new CorsConfiguration();
            config.setAllowedOrigins(allowedOrigins);
            config.setAllowedMethods(Arrays.asList("GET", "POST", "PATCH", "DELETE"));
            config.setAllowedHeaders(Arrays.asList("*"));
            config.setAllowCredentials(true);
            return config;
        }))
                .authorizeHttpRequests((requests) -> requests
                        .requestMatchers(HttpMethod.OPTIONS, "/api/v1/**").permitAll()
                        .requestMatchers("/", "/home", "/public", "/actuator/**", "/api/v1/error", "/api/v1/login",
                                "/api/v1/csrf",
                                "swagger-ui.html", "/swagger-ui/**", "/v3/**")
                        .permitAll()
                        .anyRequest().authenticated())

                .formLogin((form) -> form
                        .loginPage("/api/v1/signin")
                        .permitAll())
                .logout((logout) -> logout.permitAll())

                .authenticationProvider(authenticationProvider())
                
                .csrf(csrf -> csrf
                        .requireCsrfProtectionMatcher(new AntPathRequestMatcher("/api/v1/**", "POST"))
                         .requireCsrfProtectionMatcher(new AntPathRequestMatcher("/api/v1/**",
                         "PATCH"))
                         .requireCsrfProtectionMatcher(new AntPathRequestMatcher("/api/v1/**",
                         "DELETE"))
                        .ignoringRequestMatchers(new AntPathRequestMatcher("/api/v1/csrf", "POST"),
                                new AntPathRequestMatcher("/api/v1/login", "POST")))
                .addFilterBefore(authFilter, UsernamePasswordAuthenticationFilter.class)
                .exceptionHandling((exceptionHandling) -> exceptionHandling
                        .authenticationEntryPoint((request, response, authException) -> {
                            response.setContentType("application/json");
                            response.setStatus(HttpServletResponse.SC_UNAUTHORIZED);
                            response.getWriter().write("{ "message": "Unauthorized" }");
                        }));
        return http.build();
    }

angular request

  createProduct(
    id: string,
    name: string,
    description: string,
    idCategory: number,
    price: number
  ) {
    const bearerToken = this.bearerToken;
    const csrfUrl = 'http://localhost:8081/api/v1/csrf';

    this.http
      .post(csrfUrl, null, {
        headers: new HttpHeaders({
          Authorization: `Bearer ${bearerToken.trim()}`,
        }),
      })
      .subscribe(
        (response: any) => {
          const csrfToken = response.token.trim();


          const headers = new HttpHeaders({
            'Content-Type': 'application/json',
            'X-CSRF-TOKEN': csrfToken,
            Accept: '*/*',
            Authorization: `Bearer ${bearerToken.trim()}`,
          });

         
          const postData: Product = {
            id,
            name,
            description,
            idCategory,
            price,
          };

      
          this.http
            .post(`http://localhost:8081/api/v1/products/add`, postData, {
              withCredentials: true,
              headers,
            })
            .subscribe(
              (response) => {
                this.error.next(null);
                console.log('Product added successfully', response);
              },
              (error) => {
                console.error('Error adding product', error);
                this.error.next(error.message);
              }
            );
        },
        (error) => {
          console.error('Error fetching CSRF token', error);
          this.error.next(error.message);
        }
      );
  }

Please help me solve this problem