Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Client-side navigation error with rewrites and catch-all routes #74922

Open
klaasman opened this issue Jan 15, 2025 · 0 comments
Open

Client-side navigation error with rewrites and catch-all routes #74922

klaasman opened this issue Jan 15, 2025 · 0 comments
Labels
Middleware Related to Next.js Middleware. Navigation Related to Next.js linking (e.g., <Link>) and navigation. Pages Router Related to Pages Router.

Comments

@klaasman
Copy link
Contributor

klaasman commented Jan 15, 2025

Link to the code that reproduces this issue

repository: https://github.com/klaasman/nextjs-rewrite-catchall-conflict

preview deployment: https://nextjs-rewrite-catchall-conflict.vercel.app/

To Reproduce

A routing precedence issue arises when URL rewrites conflict with catch-all routes during client-side navigation, but only when middleware exists AND the catch-all route has fallback: false AND the resource served by the proxied host returns a 2xx response.

To reproduce, either clone the repository and run it, or open the preview deployment at https://nextjs-rewrite-catchall-conflict.vercel.app, or follow the steps below:

  1. Create a Next.js project (using pages-router, didn't test with app router)
  2. Add a middleware.ts file (can be an empty function).
  3. Add a catch-all route file pages/[...segments].tsx where getStaticPaths is configured with fallback: false.
  4. Set up next.config.js rewrite rule to proxy incoming requests (using fallback rewrites)
  5. Ensure the proxied endpoint (e.g., httpstat.us/200) returns a 2xx status code.
  6. Navigate to /200 using client-side navigation (via Link component).

Current vs. Expected behavior

Current behavior:

During client-side navigation, the catch-all route takes precedence over the configured rewrite when the proxied endpoint returns a 2xx response. This results in incorrect routing behavior. (see preview-deployment)

Expected behavior:

The client-side navigation should follow the rewrite rule, correctly routing to the proxied endpoint regardless of the 2xx response. The catch-all route should not interfere with the rewrite when the endpoint returns a successful response.

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 23.6.0: Mon Jul 29 21:14:30 PDT 2024; root:xnu-10063.141.2~1/RELEASE_ARM64_T6000
  Available memory (MB): 32768
  Available CPU cores: 10
Binaries:
  Node: 22.12.0
  npm: 10.9.0
  Yarn: 1.22.19
  pnpm: 9.14.2
Relevant Packages:
  next: 15.2.0-canary.11 // Latest available version is detected (15.2.0-canary.11).
  eslint-config-next: N/A
  react: 19.0.0
  react-dom: 19.0.0
  typescript: 5.7.3
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

Middleware, Pages Router, Navigation

Which stage(s) are affected? (Select all that apply)

next dev (local), next start (local), Vercel (Deployed)

Additional context

No response

@klaasman klaasman added the bug Issue was opened via the bug report template. label Jan 15, 2025
@github-actions github-actions bot added Middleware Related to Next.js Middleware. Navigation Related to Next.js linking (e.g., <Link>) and navigation. Pages Router Related to Pages Router. labels Jan 15, 2025
@samcx samcx removed the bug Issue was opened via the bug report template. label Jan 16, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Middleware Related to Next.js Middleware. Navigation Related to Next.js linking (e.g., <Link>) and navigation. Pages Router Related to Pages Router.
Projects
None yet
Development

No branches or pull requests

2 participants