Link to the code that reproduces this issue

https://github.com/joostmeijles/cache-revalidate-404-issue

To Reproduce

1. Set item value by performing a POST call to http://localhost:3000/set-item with body:

{
  "item": "example value"
}

2. Visit http://localhost:3000 → page correctly displays actual data
3. Unset item value by performing a POST call to http://localhost:3000/set-item with body

{
  "item": null
}

4. Verify that a 404 is returned by visiting http://localhost:3000/get-item
5. Revalidate the data cache by performing a POST call to http://localhost:3000/revalidate
6. Visit http://localhost:3000 → page shows a 404
7. Set item value by performing a POST call to http://localhost:3000/set-item with body:

{
  "item": "example value"
}

8. Revalidate the data cache by performing a POST call to http://localhost:3000/revalidate
9. 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.