Dynamic rendering
Unanswered
sohunn posted this in #help-forum
sohunnOP
I have a server component that fetches data using
When i navigate back, why doesn’t the server component re-fetch the data? But rather displays the same data
fetch(). It has a few links that take you to a different url (belonging to the same app) When i navigate back, why doesn’t the server component re-fetch the data? But rather displays the same data
8 Replies
Chub mackerel
this is because Nextjs caches server components by default
@Chub mackerel this is because Nextjs caches server components by default
sohunnOP
You mean it caches the fetch request?
Can i prevent that by using
noStore()?Chub mackerel
yeah
use this on fetch method
cache: 'no-store'export default async function Page() {
// Fetch data without caching
const data = await fetch('https://api.example.com', { cache: 'no-store' }).then((res) =>
res.json()
);
return (
<div>
<h1>Data:</h1>
<pre>{JSON.stringify(data, null, 2)}</pre>
<a href="/another-page">Go to Another Page</a>
</div>
);
}@Chub mackerel
export default async function Page() {
// Fetch data without caching
const data = await fetch('https://api.example.com', { cache: 'no-store' }).then((res) =>
res.json()
);
return (
<div>
<h1>Data:</h1>
<pre>{JSON.stringify(data, null, 2)}</pre>
<a href="/another-page">Go to Another Page</a>
</div>
);
}
sohunnOP
GET requests aren't cached by default as far as i'm aware and it skips the cache. the problem is, when i navigate to that
/another-page route and come back, the fetch request doesn't trigger againChub mackerel
which next version did you use?