Rewrites not working with app router

[npa-axelor]

Link to the code that reproduces this issue

https://github.com/npa-axelor/app-router-rewrites

To Reproduce

1. Create two nextjs application. App1 and App2.
2. Configure basePath in App2 as /app2.
3. Configure redirect in App1 next.config.js
4. Create a link in App1 as <Link href='/app2'>App2</Link>
5. Start both the application
6. Click the link

rewrites in app1 next.config.js async rewrites() { return [ { source: "/app2", destination: `http://localhost:3001/app2`, }]; }

Current vs. Expected behavior

After clicking on the link, the url changes to /app2. However the page is not rendered with App2 content.

Only after refreshing the page it shows the content of App2.

Provide environment information

Operating System:
  Platform: linux
  Arch: x64
  Version: #1 SMP PREEMPT_DYNAMIC Wed Jan 18 17:11:49 UTC 2023
Binaries:
  Node: 20.9.0
  npm: 10.1.0
  Yarn: 1.22.19
  pnpm: 7.24.3
Relevant Packages:
  next: 14.1.4
  eslint-config-next: 14.1.4
  react: 18.2.0
  react-dom: 18.2.0
  typescript: 5.4.3
Next.js Config:
  output: N/A

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

App Router, Routing (next/router, next/navigation, next/link)

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

next dev (local)

Additional context

No response

[devjiwonchoi]

Hi, Next.js rewrites is not a proxy but handles request paths under the hood. Therefore I recommend you to use other proxy utils.

[Maeda-Naoki]

I have a question as I am dealing with a similar problem. App1 (Next.js) uses rewrite to connect to the backend API server. I thought this would help prevent CORS, but it does. How is the appropriate way to handle this?

[CrewS]

Hi, Next.js rewrites is not a proxy but handles request paths under the hood. Therefore I recommend you to use other proxy utils.

Is there any recommendation method, rewrites have been used to process the interface agent in NEXT13.but NEXT14 will not work