Monday, 6 November 2023

App router. How to catch-all pages requests in Nextjs 13?

In Nextjs 12, with old Pages router I could write pages/[...urlParts]/index.js, and that would catch pages routes only (exactly what is needed). But now in Nextjs 13 I use their new App router, and my app/[...urlParts]/page.js route catches everything, including internal Nextjs requests like /_next/static/css/app/ReactToastify.css.map.

Any possibility to use my pages handler for everything BUT specific urls? Maybe here is some way to tell Nextjs to use the default handler for _next/... service links, but to keep my catch-all segment for pages?

Right now I use /app/pages/[...urlParts]/page.js structure, but that is a temporary solution, as I don't need the pages/ part in my page url.

Maybe I should clarify my goal more. I'm working on a project that generates pages based on the url and the database data. So I need to have the opportunity to:

  1. "catch-all" every possible route (except for api/..., _next/... and so on). I need to keep the default Nextjs handler for all the exceptions.
  2. parse the provided url
  3. search my database for the related data
  4. generate the page and return the generated page result

Also I need to use some App router possibilities (like partial pages with separate caching), so I cannot normally switch to the old Pages router.



from App router. How to catch-all pages requests in Nextjs 13?

No comments:

Post a Comment