next.js icon indicating copy to clipboard operation
next.js copied to clipboard

Wasteful .json file requested while middleware is enabled causes WSOD

Open mlstubblefield opened this issue 2 years ago • 1 comments

Verify canary release

  • [X] I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System: Platform: win32 Arch: x64 Version: Windows 10 Pro Binaries: Node: 16.15.1 npm: N/A Yarn: N/A pnpm: N/A Relevant packages: next: 12.3.1-canary.2 eslint-config-next: N/A react: 18.2.0 react-dom: 18.2.0

What browser are you using? (if relevant)

not relevant

How are you deploying your application? (if relevant)

vercel

Describe the Bug

This is somewhat related to this issue https://github.com/vercel/next.js/issues/40583

But if the application is deployed, the .json files will 404 in the event of navigation or use of the back button. If enough of them 404, you'll get a white screen of death.

When we see this happen to our customers (via log rocket), we see this error message https://github.com/vercel/next.js/blob/545ea5ec252779b836042e82ccd956a166efbc04/packages/next/shared/lib/router/router.ts#L715

Expected Behavior

No white screen of death, but preferably if the wasteful .json files can go away that'd be nice too (which relates back to my first report).

Link to reproduction

https://next-json-repro.vercel.app/ and https://github.com/mlstubblefield/next-json-repro

To Reproduce

To simulate a deployment you have to be a little clever, but using Chrome developer tools you can block the two files that would normally be requested.

  1. Browse to https://next-json-repro.vercel.app/
  2. Open chrome dev tools
  3. Block the "second" .json file https://next-json-repro.vercel.app/_next/data/{buildId}/index.json?something=1
  4. Refresh the page
  5. Block the "second" .json file https://next-json-repro.vercel.app/_next/data/{buildId}/1.json?something=1
  6. Refresh
  7. Get WSOD

image

This is happening us when we deploy our app to real customers. They're getting WSODs when the utilize the back button or return on a somewhat stale session.

This is happening us when we deploy our app to real customers. They're getting WSODs when the utilize the back button or return on a somewhat stale session.This is happening us when we deploy our app to real customers. They're getting WSODs when the utilize the back button or return on a somewhat stale session.

mlstubblefield avatar Sep 16 '22 13:09 mlstubblefield

we're observing the same issue after upgrading to v12.3 on our app

voronianski avatar Sep 16 '22 19:09 voronianski

Hi, this should be resolved by https://github.com/vercel/next.js/pull/41243 which eliminated the additional _next/data request during query hydration which is available in v12.3.2-canary.24 of Next.js. Please update and give it a try!

ijjk avatar Oct 11 '22 21:10 ijjk

I'm evaluating this right now.

mlstubblefield avatar Oct 13 '22 19:10 mlstubblefield

I've verified that I do not see any wasteful .json requests anymore! Thanks!

mlstubblefield avatar Oct 13 '22 19:10 mlstubblefield

Awesome, glad to here that resolved this, will close this out then!

ijjk avatar Oct 13 '22 20:10 ijjk

This closed issue has been automatically locked because it had no new activity for a month. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.

github-actions[bot] avatar Nov 13 '22 00:11 github-actions[bot]