Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

On-demand revalidation shows outdated data when using <Link>

See original GitHub issue

Verify canary release

I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 21.5.0: Tue Apr 26 21:08:29 PDT 2022; root:xnu-8020.121.3~4/RELEASE_ARM64_T8101
Binaries:
  Node: 16.15.1
  npm: 8.13.2
  Yarn: 1.22.19
  pnpm: 7.5.0
Relevant packages:
  next: 12.2.1-canary.3
  eslint-config-next: N/A
  react: 18.2.0
  react-dom: 18.2.0

What browser are you using? (if relevant)

No response

How are you deploying your application? (if relevant)

Vercel

Describe the Bug

When using on-demand revalidation with Sanity.io GROQ webhooks, I encountered an issue similar to the one described in #35195. The revalidation proceeds without any errors. When visiting the page directly, the content updated as intended. But when visiting the page via the <Link> component, the page shows the stale data. This does not change after time (I’ve waited 12+ hours so far). It seems to be affecting dynamic routes especially (though I can’t be too sure).

Below is a video of the reproduction repo showing the bug. The fresh dummy post data has no prose, whilst the previous version had. The dummy post shows the fresh data on external navigation or reloading the page. The old data shows on client-side navigation with <Link>.

https://user-images.githubusercontent.com/14236210/177207811-3cbeab95-fafa-4f36-ac4e-f917e0cc4929.mp4

Expected Behavior

Revalidation of both the cached static page and the data route.

Link to reproduction

https://github.com/jopesh/nextjs-issue-odr

To Reproduce

Create a dynamic route with data from Sanity.io based on the slug
Fill in your data in Sanity Studio for the desired slug
Build the Next.js app
Update the content for the desired slug in the Sanity Studio
Revalidate the desired slug via on-demand revalidation

Issue Analytics

State:
Created a year ago
Reactions:2
Comments:25 (6 by maintainers)

Top GitHub Comments

8reactions

mediabeastnzcommented, Jul 13, 2022

Same issue on 12.2.2. Is this an issue or are we all misunderstanding how ISR / On demand works?

The issue seems to be that the json for that page is never cleared. So when navigating by <Link> the old stale data is used not the updated data.

You can verify this by checking the pageProps

7reactions

ijjkcommented, Jul 13, 2022

@jopesh thanks for that reproduction, I’ve narrowed in on the issue here and will respond here when we have an update!

Top Results From Across the Web

Incremental Static Regeneration - Data Fetching - Next.js

Note: Middleware won't be executed for On-Demand ISR requests. Instead, call revalidate() on the exact path that you want revalidated. For example, if...

Revalidate Static Next.js Pages On-Demand with Webhooks

You will show outdated data from your getStaticProps function for the whole hour. This is where On-demand Revalidation steps in.

How to Update Static Content in Next.js Automatically with ...

js to consider our content “stale”. In our code, it might look like: return { props: { data }, revalidate: 60 }. In...

On-Demand Incremental Static Regeneration (ISR) with Next.js

If data updates on the backend, the very first user and the any other user who falls in the revalidate time range would...

Next.js Incremental Static Regeneration not reflecting changes ...

After editing a post title, I go back to the page with the posts list, using next/link , but the list shows outdated...