# NextJS (fetch)

> Automatic Setup의 Proxyman 사전 구성 Terminal을 사용해 Next.js 서버 측 fetch()와 Server Components의 HTTPS 요청을 캡처하세요.

## 1. 문제 {#1-problem}

* NextJS의 `use server` 코드에서는 Proxyman이 트래픽을 전혀 캡처할 수 없습니다.
* NextJS의 `fetch`는 시스템 HTTP 프록시를 따르지 않습니다. 따라서 어떤 트래픽도 Proxyman 앱을 거치지 않습니다.

## 2. 해결 방법 {#2-solution}

1. 사전 구성된 Terminal을 시작합니다: Setup 메뉴 -> Automatic Setup -> "Open New Terminal" 클릭
2. 새 Terminal이 열리면 이 Terminal에서 NextJS 서버를 시작하세요. 예: `npm run dev`
3. `fetch`에 `no-cache`를 사용하세요.

```js
export default async function MyPage() {
  const res = await fetch('https://httpbin.org/anything', { cache: 'no-cache' }) // no cache, or no request is sent to Proxyman
  return <div>My Page{res.text()}</div>
}
```

4. 웹사이트를 새로고침하세요.
5. 완료 ✅ Proxyman 앱이 HTTP 트래픽을 캡처합니다.

![Proxyman 사전 구성 Terminal에서 실행 중인 Next.js 개발 서버와 Proxyman에 캡처된 서버 측 fetch 요청](https://proxyman.com/docs/assets/335782543-6e0c4eeb-435d-4589-b2dd-4087f3827f3a.jpg)

_Proxyman에서 NextJS fetch 캡처하기_

## 3. 참고 자료: {#3-reference}

* [https://github.com/ProxymanApp/Proxyman/issues/2038](https://github.com/ProxymanApp/Proxyman/issues/2038)

## 더 알아보기 {#learn-more}

* [NextJS 서버 측에서 HTTP 요청 캡처하기](https://proxyman.com/posts/2024-06-10-Capture-HTTPS-From-NextJS-Server-Components)