Capture HTTP Request from Server Side on NextJS

Cover Image for Capture HTTP Request from Server Side on NextJS

1. Problems

When calling an HTTP/HTTPS Request from the server-side NextJS by using fetch(), it's really difficult to debug the network. The workaround is using the console.log() to print out the Request/Response on the Terminal app.

Therefore, it's a nightmare when debugging a large codebase with hundreds of requests.

2. Solution

Proxyman introduces the Automatic Setup that opens the pre-configured Terminal app. By starting your NextJS Server on this Terminal, Proxyman automatically captures all HTTP/HTTPS from your NextJS Project.


  • No need to config the proxy
  • No need to trust the Proxyman Certificate
  • Work out of the box
  • Easier to set up than using the Reverse Proxy Tool

Here is the walkthrough:

  1. Tell fetch() APIs to not use the built-in caching by using the flag no-cache
export default async function MyPage() {
  const res = await fetch('', { cache: 'no-cache' }) // no cache, or no request is sent to Proxyman
  return <div>My Page{res.text()}</div>

=> fetch() from NextJS uses Cache by default, so sequential requests are never hit to the server. Therefore, no requests are captured by Proxyman. => { cache: 'no-cache' } will make sure the NextJS will always call the Endpoint.

  1. Open Proxyman -> Setup -> Automatic Setup -> Open new Terminal

Start the Terminal with Auto Setup from Proxyman

  1. From this Terminal -> Start your NextJS here with npm run dev

Start your NextJS with Proxyman

  1. Done, all HTTP/HTTPS from fetch() are captured and intercepted by Proxyman.

Capture HTTPS from fetch on NextJS

3. What's next

Noah Tran
Noah Tran