Hello all!
I have a a nuxt app (SSR) living at mairie-poullaouen.fr that fetches data from Directus.
the homepage has a component that shows the 3 last “actualités” from Directus.
There is a “actualites” page that shows all of the “actualités” from Directus.
the problem: When I post a new “actualité” in Directus, it doesn’t show up on the homepage. Then, if I navigate to the “actualites” page, the new article is displayed. If I navigate back to the homepage, the new article is now shown. But, if I refresh the page, it’s no longer visible.
After testing, I realised that the homepage is being cached and visitors get older versions.
I tried editing the netlify.toml file in two ways:
[[headers]]
for = "/*"
[headers.values]
Cache-Control = "no-cache"
and
[[headers]]
for = "/*"
[headers.values]
Cache-Control = "max-age=0, must-revalidate, public"
but the problem persists…
For now, I created a webhook in Directus that triggers a new build everytime a new article gets posted, updated or deleted. But It seems a bit overkill…
my questions:
Why is the homepage cached, but not the second page?
Who could be responsible for this cache situation? Netlify? Nuxt? the browser?
What should I do to make sure that the latest articles posted are being shown on the homepage?
Knowing that most of the other pages won’t be updated often, what would be the best way to allow some pages to be cached, but not other?
Thanks in advance!
Eric
