open-next icon indicating copy to clipboard operation
open-next copied to clipboard

Pages Router catchAll route with `fallback:false` cause 404 on api route

Open gabriel-wow opened this issue 1 year ago • 12 comments

My company has a large project built with Next.js 12. As Next.js 12 is now outdated, we updated our project to Next.js 14 while keeping the Pages Router structure. Previously, we were using cdk-nextjs-standalone to deploy the application to AWS, and everything was working fine. However, after upgrading to Next.js 14 and deploying, our API routes topped functioning. To resolve this, we decided to migrate to the SST framework (v3). Despite completing the migration and configuration, our API routes are still not working and continue sending us to 404 page.

Versions:
Next.js: v14.2.20
SST: v3.3.65
OpenNext.js: 3.2.2

Steps Taken:

Updated Next.js from v12 to v14 (keeping the Pages Router structure). Migrated deployment from cdk-nextjs-standalone to SST (v3). Configured the SST project following the documentation. Even after successfully deploying the project with SST v3, our API routes are unresponsive.

Another point to add is that we performed a fresh install deployment of Next.js v15 using the Pages Router, and the APIs are not working either.

gabriel-wow avatar Dec 16 '24 11:12 gabriel-wow

You need to provide more info here or even better a reproduction. What's in your next-config ?

conico974 avatar Dec 16 '24 11:12 conico974

My project is a monorepo with Lerna

image

gabriel-wow avatar Dec 16 '24 11:12 gabriel-wow

Are you using tRPC or anything special with those API routes? You should probably look in CloudWatch logs aswell and see if you can see anything on the default server function.

Whats in your package.json?

sommeeeer avatar Dec 16 '24 12:12 sommeeeer

Hi,

The issue also happens on Next 15 (Pages Router).

Steps to Reproduce

  1. Create a project using the create-next-app
  2. Add a catch-all dynamic route at the top level of the pages directory
  3. Make sure there is at least one API route in the pages/api directory

image

Environment

Node.js 20.14.0
Next.js 15.1.0
SST 3.4.2
OpenNext 3.2.2

Notes

  • The .next/standalone/server.js generated by running the open-next build command works as expected.
  • Here's the .open-next/server-functions/default/.next/routes-manifest.json generated by running the open-next build command: image With catch-all dynamic route

image Without catch-all dynamic route

fthomasvp-wow avatar Dec 16 '24 12:12 fthomasvp-wow

Are you using fallback:false ?

conico974 avatar Dec 16 '24 13:12 conico974

Are you using fallback:false ?

Yes!

There is also a dynamic route using fallback: blocking (in the monorepo project mentioned by @gabriel-wow ) that works fine (when no catch-all dynamic route is present in the pages directory).

fthomasvp-wow avatar Dec 16 '24 13:12 fthomasvp-wow

We need to change that, right now catchAll fallback:false route takes precedence over everything else.

As a workaround set it to fallback:true and return notFound for paths you don't want https://nextjs.org/docs/pages/api-reference/functions/get-static-props#notfound

conico974 avatar Dec 16 '24 13:12 conico974

Got it! We'll make the changes, and update this thread with the results.

Thanks for your quick reply @sommeeeer @conico974

fthomasvp-wow avatar Dec 16 '24 13:12 fthomasvp-wow

Hi,

Your tip did the trick... Both Pages and APIs are working as expected.

Out of curiosity... Are you guys planning to release a fix soon?

Big thanks for your help!!! You guys rock 😄

fthomasvp-wow avatar Dec 16 '24 21:12 fthomasvp-wow

This will require a bunch of change to work properly. And since there is a very simple workaround it's not high priority. I'll keep this open until we fix it, but i'll rename the issue

conico974 avatar Dec 16 '24 22:12 conico974

Hi @sommeeeer @conico974, Thank you so much for help and the quick response, it seems to have worked!!

gabriel-wow avatar Dec 17 '24 11:12 gabriel-wow

awesome !

BBeast131 avatar Feb 17 '25 14:02 BBeast131