Using Cache-Control header with react-query

Question

I was wondering whether react-query take Cache-Control header coming from the server into consideration.

I want to set the staleTime based on the instructions coming from the server about how long should the data be cached.

I went through the docs, but it seems like all the docs are related to setting it manually and hardcoding it.

Do I have to set the staleTime & cacheTime manually or can it be automated based on headers sent from server?

Thanks in advance...

Answer 1

React Query has no knowledge of response headers. It's promise based, and you can use any way you want to produce a promise. So by that definition, it cannot know about network headers.

Imo there also isn't much value in syncing these two things - they are different layers of caches that build upon each other. If you have browser caching enabled via the Cache-Control header, you can just as well keep staleTime to zero and let the background refetches trigger when necessary, because they will read from the browser cache anyways.