Application error: a client-side exception has occurred (see the browser console for more information).

[slackerzz]

Verify canary release

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

Provide environment information

Operating System:
  Platform: darwin
  Arch: x64
  Version: Darwin Kernel Version 22.1.0: Sun Oct  9 20:14:54 PDT 2022; root:xnu-8792.41.9~2/RELEASE_X86_64
Binaries:
  Node: 16.18.1
  npm: 8.19.2
  Yarn: N/A
  pnpm: 7.18.0
Relevant packages:
  next: 13.0.7-canary.1
  eslint-config-next: 13.0.6
  react: 18.2.0
  react-dom: 18.2.0

Which area(s) of Next.js are affected? (leave empty if unsure)

Data fetching (gS(S)P, getInitialProps), Middleware / Edge (API routes, runtime)

Link to the code that reproduces this issue

https://github.com/slackerzz/next-middleware-error

To Reproduce

1. Visit https://next-middleware-error-git-main-lorenzo2.vercel.app
2. the first two links (foo, bar) are ok
3. clicking the third link (baz) point to a page that should returo 404 but you will get:

Application error: a client-side exception has occurred (see the browser console for more information).

Describe the Bug

The error is triggerd only if you run pnpm build && pnpm start, it is not present if you run pnpm dev.

If you remove the middleware.ts file from the project the error is gone and you will get a 404 page as expected.

When a middleware is present the /test/baz gets undefined as props. It seems related to getStaticProps returning { notFound: true }

Expected Behavior

The presence of a middleware should not interfere with page props

Which browser are you using? (if relevant)

No response

How are you deploying your application? (if relevant)

Vercel

[slackerzz]

This bug is reproducible also with the lastest next 13.1

[singhofmarco]

I have the exact same issue...

[wadehammes]

Can confirm this is happening as well. Had to downgrade back to 13.0.6 for time being.

[Confuze]

Dealing with the same issue right now. I really hope there's a fix for this.

[slackerzz]

@wadehammes in 13.0.6 it works as expected? I discovered it in 12.3.3 and then in 13.1.
I think it is related to the Link component prefetching but i couldn't dig deeper

[pimmee]

This happened to us when we deployed a new version.

1. User on page X
2. We deploy a new version (with Vercel)
3. User clicks link to open a new page
4. Error occurred: Application error: a client-side exception has occurred (see the browser console for more information).

Also I've received it during development.

[sindremb]

We also had this issue on our end (v13.1.6)

Every first navigation to certain app folder routes with dynamic route segments would fail, but as long as at least one user had navigated to the page once after deploy, the page would work for everyone.

The navigation failed because the browser was served an application/octet-stream (.rsc in the .next/app folder) version of the page which referenced chunks that no longer existed in the current deployment.

The reason for getting the old content on first navigation in our case was due having some dynamic route param that was not known at build time, possibly combined with our self hosting of the next application.

For these pages with incompletely generated static params at build time, .next would generate .html and .rsc files on demand as it was running in our self hosted environment, which was persisted in the .next/app folder alongside files generated at build time. Since these files were not part of our deployment package, they would not be affected by the following deploy, and therefore stick around through multiple deployments. These files were detected as stale by next, but would still be served to the first visitor before new content was generated in the background. These visitors would then experience the exact issue described here.

The fix we have added to solve our specific case is to just ensure that all such "on demand generated" content is cleared during each deployment.

I am not sure how well our case translates to people hosting next applications in other ways, but thought it could be helpful information for people regardless.

[junedkhatri31]

Facing same issue. This is logs from console. It is not happeing in development server for me. Only heppenning on deployed version on Vercel.

[junedkhatri31]

Facing same issue. This is logs from console. It is not happeing in development server for me. Only heppenning on deployed version on Vercel.

In my case I was using process.env.APP_ROOT_URL in heading tag in root page. But did not activate APP_ROOT_URL environment variable for Preview apps.

I have uploaded buggy code here - https://github.com/junedkhatri31/vercel-reproduce/blob/main/app/head.tsx

[samcx]

Closing as a duplicate of → #38239.

[github-actions]

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.