**Next.js error page (404, 400, 500) reload infinitely in development** #40000
-
Provide environment information
Describe the IssueI'm not sure if this is a Next.js bug or a function, but the app keep reloading when I'm on 404 or any other error page and it's really annoying and it start laggy when the log was long enough, I want to investigate a way to stop this. To reproduce
Screen RecordCreate.Next.App.-.Google.Chrome.2022-08-27.13-51-24.mp4 |
Beta Was this translation helpful? Give feedback.
Replies: 17 comments 28 replies
-
I tried to control this with // don't attempt fetching the page if we're already showing
// the dev overlay as this can cause the error to be triggered
// repeatedly
if (payload.event === 'pong' && payload.invalid && !self.__NEXT_DATA__.err) {
// Payload can be invalid even if the page does exist.
// So, we check if it can be created.
fetch(location.href, {
credentials: 'same-origin'
}).then((pageRes)=>{
if (pageRes.status === 200) {
// Page exists now, reload
location.reload();
} else {
// Page doesn't exist
if (self.__NEXT_DATA__.page === _router.default.pathname && _router.default.pathname !== '/_error') {
// We are still on the page,
// reload to show 404 error page
location.reload();
}
}
});
}
This is the nature of However, if we for example return Still, would be nice to be able to at least throttle this behavior. |
Beta Was this translation helpful? Give feedback.
-
I am also facing same error. I have created a custom page for not-found but due to this is reloading again and again . Any solution ? |
Beta Was this translation helpful? Give feedback.
-
Same error with "next": "13.4.4". |
Beta Was this translation helpful? Give feedback.
-
Same error with "next": "13.4.5" |
Beta Was this translation helpful? Give feedback.
-
Same bug in not-found with "next": "13.4.6" |
Beta Was this translation helpful? Give feedback.
-
Same bug in not-found with "next": "13.4.6" |
Beta Was this translation helpful? Give feedback.
-
I ended up adding a catch-all route where the 404 was being generated from to return
import { notFound } from "next/navigation"
export default function NotFound() {
return notFound()
} |
Beta Was this translation helpful? Give feedback.
-
I found a way which worked for me on "next": 13.4.6
import { notFound } from "next/navigation";
const NotFoundCatchAll = () => notFound();
export default NotFoundCatchAll;
export default function NotFound({}: Props) {
return (
<div>NotFound</div>
);
} Your custom 404 error page will work fine without the infinity reload issue. |
Beta Was this translation helpful? Give feedback.
-
I tried to "debug" this "error" for an hour, how is this not commented here in the docs ? |
Beta Was this translation helpful? Give feedback.
-
Fixed here: #51637 Working fine for me in V 13.4.12 |
Beta Was this translation helpful? Give feedback.
-
The @Ian-Munashe fix works for me.
|
Beta Was this translation helpful? Give feedback.
-
I think its a dev bug only, I was having the same trouble, but when I pushed it (dont know how I thought about it) It worked perfectly on production |
Beta Was this translation helpful? Give feedback.
-
Hey folks -- we've removed the dev server polling behavior on the v13.4.20 canary (specifically as of v13.4.20-canary.4). You should no longer be seeing infinite reloads, but if you do, please consider filing an issue for it with a reproduction so we can investigate. |
Beta Was this translation helpful? Give feedback.
-
This still happens on 13.5.6 even without a custom |
Beta Was this translation helpful? Give feedback.
-
Update the next.js version in your project , it will fix the issue insted using next.js 13 use next.js 14 |
Beta Was this translation helpful? Give feedback.
-
Same error here with nextjs version 14.1 |
Beta Was this translation helpful? Give feedback.
-
can confirm this issue was fixed in 14.1.4 and broken again in 14.2.3. Still haven't found a combo of fixes to get this madness to stop. Seeing something similar to this #62228. though not sure if related? |
Beta Was this translation helpful? Give feedback.
I tried to control this with
onDemandEntries
on the next configuration file, but it didn't work, so I went to the source code, and this bit: