Cache error on redirects from dynamic routes with SSG [Node.js 14+]

[anders-nom]

What version of Next.js are you using?

10.0.4

What version of Node.js are you using?

14.15.4

What browser are you using?

Chrome

What operating system are you using?

Windows 10/Alpine Linux

How are you deploying your application?

next start

Describe the Bug

When returning a redirect value from getStaticProps in a dynamic route, the IncrementalCache.set function attempts to write invalid html data to the static page cache.

Node.js version 14+ throws an exception here, which triggers this warning:
Failed to update prerender files for <pathname> TypeError [ERR_INVALID_ARG_TYPE]: The "data" argument must be of type string or an instance of Buffer, TypedArray, or DataView. Received an instance of Object

After downgrading to node version 12.18.4, no error occurs, instead an html file containing [object Object] is written.

In our use case, there are no apparent ill effects with either version, aside from a large amount of entries in our error logs for the node.js 14 variant. Redirects still work as expected.

Expected Behavior

Html-cache should probably not be (attempted) generated from redirected paths.

To Reproduce

• Clone this repo https://github.com/anders-nom/nextjs-ssg-redirect-cache-bug
• Install and use Node.js version 14.15.4
• Delete the .next directory if it exists
• npm run build
• npm run start
• Visit http://localhost:3000/redirect
• Observe the aforementioned warning in the server console, and note that no redirect.html or redirect.json was generated in /.next/server/pages

[balazsorban44]

Confirmed using next@10.0.6 on Ubuntu 20.04:

Failed to update prerender files for /some/url TypeError [ERR_INVALID_ARG_TYPE]: The "data" argument must be of type string or an instance of Buffer, TypedArray, or DataView. Received an instance of Object
    at Object.writeFile (internal/fs/promises.js:609:5)
    at IncrementalCache.set (/project/node_modules/next/dist/next-server/server/incremental-cache.js:16:206)
    at async Server.renderToHTMLWithComponents (/project/node_modules/next/dist/next-server/server/next-server.js:133:27)
    at async Server.renderToHTML (/project/node_modules/next/dist/next-server/server/next-server.js:133:923)
    at async Server.render (/project/node_modules/next/dist/next-server/server/next-server.js:72:236)
    at async Object.fn (/project/node_modules/next/dist/next-server/server/next-server.js:47:704)
    at async Router.execute (/project/node_modules/next/dist/next-server/server/router.js:23:67)
    at async Server.run (/project/node_modules/next/dist/next-server/server/next-server.js:66:1042)
    at async Server.handleRequest (/project/node_modules/next/dist/next-server/server/next-server.js:34:504) {
  code: 'ERR_INVALID_ARG_TYPE'
}

We have a pages/[...page].ts catch all route, where /some/url returns a redirect to another page that will be prerendered, using pages/[...page].ts

Some example code:

// inside getStaticProps
...
if (data.page.shortcut) {
  const destination = data.page.shortcut
  log.debug(
    { context: "getStaticProps", url, destination },
    "{context}: redirecting {url} to {destination}"
  )
  return {
    redirect: { destination },
    revalidate: Number(process.env.REVALIDATE_STATIC_PROPS),
  }
}
...

The getStaticProps method here is not invoked for the same page that is visited by the user, but prefetched, because /some/url is a link on the current page in the viewport.

The actually visited page will also fail returning correct data, here is the content of the #__NEXT_DATA__ script from the page the user is visiting:

{"props":{"pageProps":{},"__N_SSG":true},"page":"/[...page]","query":{},"buildId":"zYQnyy1Evg3mjw6Gr8Jf2","nextExport":false,"isFallback":true,"gsp":true}

The error does not happen consistently for me, it is appearing on random pages, and a rebuild will cause errors appearing on a different set of pages.
I suspect there is some kind of a race condition while writing to IncermentalCache, or that the error in setting /some/place will prevent the currently visited page to return correct data as well.

When the page enters this empty pageProps state, even a low revalidate value like 1 will never populate it correctly again, it has to be re-built/redeployed. (This won't actually solve the issue, as mentioned, it will usually come back on different pages)

It first started happening in a prod environment on a K8S service with an Azure CDN in front, so I suspected the problem was with Azure. Changed to Vercel, but the problem persisted! Until now I could not reproduce it - and I still can't consistently on my machine - but it actually started to happen locally (just updated to 10.0.6 from 10.0.6-canary.4), and could finally see what was logged to the terminal.

I can try providing more information if needed, and if the OP (@anders-nom) feels like I am describing a different problem (although I get the same error as the OP), I'm happy to move this into another issue.

[diegoaguilar]

@anders-nom or @balazsorban44 did you figure out a solution for this? Just tried on Next 10.1.3 and Node 14 and got the same effect. Redirect is working though

[balazsorban44]

No, it still happens to us, next 10.1.3 and Node 14.

[Dimich-x33]

I'm also currently struggling to find solution

[baba43]

Same issue here

[Aviortheking]

it still happens on Next 10.2.3 and Node 16.3.0
but don't happens while using Node 12.22.1

[garfiaslopez]

Same issue here, anyone found something? Or we need to downgrade node version?