Link to the code that reproduces this issue
https://github.com/joostmeijles/cache-revalidate-404-issue
To Reproduce
- Set item value by performing a POST call to http://localhost:3000/set-item with body:
{
"item": "example value"
}
- Visit http://localhost:3000 → page correctly displays actual data
- Unset item value by performing a POST call to http://localhost:3000/set-item with body
- Verify that a 404 is returned by visiting http://localhost:3000/get-item
- Revalidate the data cache by performing a POST call to http://localhost:3000/revalidate
- Visit http://localhost:3000 → page shows a 404
- Set item value by performing a POST call to http://localhost:3000/set-item with body:
{
"item": "example value"
}
- Revalidate the data cache by performing a POST call to http://localhost:3000/revalidate
- Visit http://localhost:3000 → page wrongly displays 404
Current vs. Expected behavior
The page is not revalidated after the underlying cached fetch value was updated and cached item revalidated. Revalidation has no effect on this. I expect the page to be regenerated when the cached value is revalidated.
Details
The rendered page retrieves the data from the backend using a fetch call. The fetch call has the following properties set:
const res = await fetch(`https://${process.env.VERCEL_URL}/get-item`, {
cache: 'force-cache',
next: {
tags: ['my-cachetag']
}
});
After the page rendered a 404 cache revalidation no longer works, i.e. the page is never re-rendered.
Provide environment information
Operating System:
Platform: win32
Arch: x64
Version: Windows 10 Enterprise
Available memory (MB): 32472
Available CPU cores: 16
Binaries:
Node: 18.20.2
npm: 10.5.0
Yarn: 1.22.19
pnpm: 9.9.0
Relevant Packages:
next: 15.1.1-canary.6 // Latest available version is detected (15.1.1-canary.6).
eslint-config-next: N/A
react: 19.0.0
react-dom: 19.0.0
typescript: 5.3.3
Next.js Config:
output: N/A
Which area(s) are affected? (Select all that apply)
Runtime
Which stage(s) are affected? (Select all that apply)
Vercel (Deployed)
Additional context
This can be reproduced locally in production mode by npm run build and npm run start.
NB. Set VERCEL_URL="cache-revalidate-404-issue.vercel.app" in your env for the page pre-render to work.
Link to the code that reproduces this issue
https://github.com/joostmeijles/cache-revalidate-404-issue
To Reproduce
Current vs. Expected behavior
The page is not revalidated after the underlying cached fetch value was updated and cached item revalidated. Revalidation has no effect on this. I expect the page to be regenerated when the cached value is revalidated.
Details
The rendered page retrieves the data from the backend using a fetch call. The fetch call has the following properties set:
After the page rendered a 404 cache revalidation no longer works, i.e. the page is never re-rendered.
Provide environment information
Which area(s) are affected? (Select all that apply)
Runtime
Which stage(s) are affected? (Select all that apply)
Vercel (Deployed)
Additional context
This can be reproduced locally in production mode by
npm run buildandnpm run start.NB. Set
VERCEL_URL="cache-revalidate-404-issue.vercel.app"in your env for the page pre-render to work.