개요
Inspect server (SSR/RSC) + client API calls of Next.js App Router apps in a DevTools panel.
In the Next.js App Router, most data is fetched on the server — during the RSC render, inside route handlers, and inside server actions. Those requests never show up in the browser's Network tab, which makes them hard to see while you build and debug. Next API Capture instruments fetch (and Node http/https — so axios, got and node-fetch are covered too) on the server, correlates every call to the page navigation that triggered it, and streams them to a dedicated DevTools panel — right next to your client-side fetch and XHR calls. What you get: • Server + client capture — server:rsc, server:route-handler, server:action, plus client fetch and XHR. • A real DevTools panel — filter by source, search by URL, group by navigation, clear-on-nav, live counts. • Full request / response detail — headers and bodies (gzip/deflate/br decoded), with a resizable detail pane. • Safe by default — never auto-on in production; sensitive headers masked; bodies size-capped and pattern-redacted. • Drop-in and fail-safe — three small touch-points; feature-detects at runtime and degrades gracefully (warns, never throws). How it works (in your app): instrumentation.ts → registerCapture() middleware.ts → createCaptureMiddleware() Load this extension and open the “API Capture” panel in DevTools. The library streams captures to the extension over a loopback dev WebSocket (127.0.0.1). The extension only runs on http://localhost and http://127.0.0.1, and nothing is sent to any remote server. Open source: https://github.com/yeo11200/next-api-capture
세부정보
- 버전0.1.0
- 업데이트됨2026년 6월 23일
- 크기20.82KiB
- 언어한국어
- 개발자
이메일
sksksms2@gmail.com - 비판매자판매자로 식별되지 않은 개발자입니다. 유럽 연합에 거주하는 소비자의 경우, 이 개발자와 체결한 계약에 대해서는 소비자 권리가 적용되지 않을 수 있음을 유의해야 합니다.
개인정보 보호
개발자가 사용자 데이터에 관해 다음과 같이 선언했습니다
- 승인된 사용 사례를 제외하고 서드 파티에 판매하지 않음
- 항목의 핵심 기능과 관련 없는 목적으로 사용하거나 전송하지 않음
- 신용도 판단 또는 대출 목적으로 사용하거나 전송하지 않음