Http request caching not working in angular 17

After updating to angular 17 ssr rendering by default use caching for the http get methods, this is confirmed by the angular team. For me the caching not really works. My backend is .Net Core.

As you can see the GetProducts request is loaded after the html is loaded..

Here is the app.component.ts

export interface Product {
  productId: number;
  name: string;
  price: number;
  color: string;
  size: string;
  description: string,
  orderItems: any[],
  productImages: any[]
}

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [CommonModule, RouterOutlet],
  templateUrl: './app.component.html',
  styleUrl: './app.component.css'
})
export class AppComponent {
  products: Product[] = []
  title = 'Gyakor';

  constructor(private productService: ProductService, private httpClient: HttpClient) {

  }

  ngOnInit() {
        this.httpClient.get<Product[]>("https://localhost:7283/api/Products/GetProducts").subscribe((result) => {
      this.products = result;
    })
  }
}

The app.config

import { ApplicationConfig } from '@angular/core';
import { provideRouter } from '@angular/router';

import { routes } from './app.routes';
import { provideClientHydration } from '@angular/platform-browser';
import { provideHttpClient, withFetch } from '@angular/common/http';

export const appConfig: ApplicationConfig = {
  providers: [provideRouter(routes), provideHttpClient(withFetch()), provideClientHydration()]
};

The app.config.server.ts

import { mergeApplicationConfig, ApplicationConfig } from '@angular/core';
import { provideServerRendering } from '@angular/platform-server';
import { appConfig } from './app.config';

const serverConfig: ApplicationConfig = {
  providers: [
    provideServerRendering()
  ]
};

export const config = mergeApplicationConfig(appConfig, serverConfig);

I tried changing the imports, and updating Angular. A little detail is that I get a Error: self-signed certificate when trying to fetch, but the fetch still runs, so I don't think this is caching problem. But change my mind if you can, I'm open for ideas.

I got it, I post my answer, hopefully it will help anybody else who gets this error!

Basically the Error: self-signed certificate which I mentioned was the problem. Seems like if any error happens at the nodeJs part of the application the client will fetch the data not the nodeJs.

I basically updated my backend to a hosting server (because the certificate over there is correct), and tried to fetch from over there. And it works flawlessly.

So basically any nodeJs side error must be resolved or the fetch will happen on the client side!