Standalone HTTP and WebSocket servers for Next.js HTTP Inspector - Install globally to use from any project
npm install next-http-inspector-serverStandalone HTTP and WebSocket servers for Next.js HTTP Inspector that can run independently from the instrumentation.
- š UI Server: Web interface to monitor HTTP requests
- š§© WebSocket Server: Real-time communication with instrumentation
- š CLI: Command-line interface to run servers
- š¦ Independent: Can run without Next.js instrumentation
> š” For regular users: Use global installation. Local installation is only for developers who want to modify the source code.
``bash`Install globally to use from any project
npm install -g next-http-inspector-server
`bash`Only if you want to modify the server source code
git clone
cd next-http-inspector-server
npm install
npm run build
`bashRun both servers
next-inspector-server
$3
`bash
Run directly with npx
npx next-inspector-server --ui-port 3001 --ws-port 8080
`$3
`typescript
import {
createWebSocketServer,
createUIServer,
closeWebSocketServer
} from 'next-http-inspector-server';// Create WebSocket server
const wsServer = createWebSocketServer(8080);
// Create UI server
const uiServer = createUIServer(3001, '/ui', 8080);
// Close WebSocket server
closeWebSocketServer();
`CLI Options
| Option | Description | Default |
|--------|-------------|---------|
|
--ui-port | Port for UI server | 3001 |
| --ws-port | Port for WebSocket server | 8080 |
| --ui-path | Path for UI endpoint | /ui |
| --ui-only | Run UI server only | false |
| --ws-only | Run WebSocket server only | false |
| --help, -h | Show help | - |Environment Variables
-
UI_PORT: Port for UI server
- WS_PORT: Port for WebSocket server
- UI_PATH: Path for UI endpointDevelopment
`bash
Compile TypeScript
npm run buildDevelopment mode (watch)
npm run devRun server
npm start
`Complete Workflow
$3
`bash
npm install -g next-http-inspector-server
`$3
`bash
next-inspector-server --ui-port 3001 --ws-port 8080
`$3
`bash
npm install --save-dev next-http-inspector
`$3
Create instrumentation.ts in your project root:
`typescript
import { setupNextInstrument } from 'next-http-inspector';export function register() {
setupNextInstrument({
logFetch: true,
logConsole: true,
logErrors: true,
websocket: { enabled: true, port: 8080 }
});
}
`$3
`bash
npm run dev
`$3
Open http://localhost:3001/ui in your browser.Next.js Integration
This package is designed to work with
next-http-inspector. The Next.js instrumentation will automatically connect to these servers when they are running.Architecture
`
next-http-inspector-server/
āāā src/
ā āāā cli.ts # CLI interface
ā āāā index.ts # Main exports
ā āāā uiServer.ts # UI server
ā āāā wsServer.ts # WebSocket server
ā āāā ui/
ā āāā styles.ts # CSS styles
āāā dist/ # Compiled code
āāā package.json
āāā tsconfig.json
``MIT