By default, the Angular Universal app makes HTTP requests again when app is bootstrapped even app is already rendered on the server side. Though there is a really simple solution which can be implemented without any actual code changes. At first when I tried to find how to prevent requests I only found tutorials how to implement this at the component level. After googling a while I luckily found an easier way to implement this.
Solution is in the TransferHttpCacheModule.
TransferHttpCacheModule installs a Http interceptor that avoids duplicate HttpClient requests on the client, for requests that were already made when the application was rendered on the server side.
Since this is a HTTP interceptor it automatically affects all requests and does all the hard work under the hood.
I don't repeat installation steps here because up-to-date instructions can be found from the Angular Universal Common Module readme. I just want to point this out in case someone also has a hard time to find a proper solution.
Did you find this article helpful?