How to fix page not found on Next.js (Headless)
Fix broken internal links pointing to pages that return a 404 error by either removing those links or setting up a 301 redirect from the missing URL to the correct replacement page.
Steps for Next.js (Headless)
- Audit all internal `<Link href='...'>` and `<a href='...'>` usages across your components (e.g. `components/`, `app/`, `pages/`) — replace any broken destination with the correct live URL, or remove the link entirely if no replacement exists.
- For every broken URL that must keep working (e.g. old slugs, renamed routes), declare a permanent 301 redirect in `next.config.js` (or `next.config.ts`) using the `redirects()` async function — this is evaluated at the Edge/server before any page render.
- If broken URLs are data-driven (e.g. old product/category slugs stored in a CMS), fetch the redirect map at build time inside `redirects()` or generate them via `getStaticProps`/`generateStaticParams` and issue a `{ redirect: { destination, permanent: true } }` return value from the page itself.
- For catch-all runtime redirects (unknown slugs), add a custom `app/not-found.tsx` (App Router) or `pages/404.tsx` (Pages Router) that uses `useEffect` + `router.replace()` or a server-side lookup to forward the user to the nearest correct page.
- After deploying, re-crawl with a tool (e.g. Screaming Frog, `next build` output warnings) to confirm no internal link still resolves to a 404; also verify the `Location` header returns 301 (not 302) for all redirected paths.
What is page not found?
A 404 ("Page Not Found") error means a URL on your store no longer exists — but other pages on your site still link to it. Every time a shopper or search engine follows one of those links, they hit a dead end instead of useful content. This can happen when you delete a product, rename a collection, restructure your URLs, or migrate to a new platform without properly redirecting old addresses.
Search engines like Google treat 404 pages as dead ends: any ranking authority ("link equity") that flowed through those internal links is wasted instead of boosting the destination page. Googlebot also has a limited crawl budget — time spent re-crawling broken URLs is time not spent discovering your new or best-selling pages, which can slow indexing and hurt rankings. For shoppers, clicking a link and landing on a 404 page destroys trust, interrupts the purchase journey, and directly costs you sales. If enough 404s accumulate, Google can downgrade its overall assessment of your site's quality.
See the complete Page not found guide for every platform and the full background.
Not sure if your Next.js (Headless) store has this?
Run a free SEOLZ scan — we’ll find page not found and every other issue across your whole site.
Scan my site free