@mt0926/node-network-devtools 0.1.0

package/dist/types/register.d.ts

@@ -0,0 +1,18 @@
+/**
+ * 自动注册入口
+ *
+ * 使用方式：node -r node-network-devtools/register your-script.js
+ * 或：node --import node-network-devtools/register your-script.js
+ *
+ * 注意：Network 面板功能需要：
+ * - Node.js 20.18.0+ 版本
+ * - --experimental-network-inspection 标志
+ * - Chrome DevTools 目前还不支持显示 Network 事件（功能待实现）
+ */
+import { getConfig } from './config.js';
+import { getCDPBridge } from './cdp/cdp-bridge.js';
+import { getRequestStore } from './store/ring-buffer.js';
+import { getGUIServer } from './gui/server.js';
+import { getEventBridge } from './gui/event-bridge.js';
+export { getConfig, getRequestStore, getCDPBridge, getGUIServer, getEventBridge };
+//# sourceMappingURL=register.d.ts.map

package/dist/types/register.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"register.d.ts","sourceRoot":"","sources":["../../src/register.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAGxC,OAAO,EAAE,YAAY,EAAuC,MAAM,qBAAqB,CAAC;AACxF,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AA4HvD,OAAO,EAAE,SAAS,EAAE,eAAe,EAAE,YAAY,EAAE,YAAY,EAAE,cAAc,EAAE,CAAC"}

package/dist/types/store/ring-buffer.d.ts

@@ -0,0 +1,148 @@
+/**
+ * 环形缓冲区请求存储
+ *
+ * 高效存储和查询请求数据，自动覆盖旧条目
+ */
+/**
+ * 响应数据
+ */
+export interface ResponseData {
+    statusCode: number;
+    statusMessage: string;
+    headers: Record<string, string | string[]>;
+    body?: Buffer | string;
+    bodyTruncated?: boolean;
+}
+/**
+ * 错误数据
+ */
+export interface ErrorData {
+    code: string;
+    message: string;
+    stack?: string;
+}
+/**
+ * 时序数据
+ */
+export interface TimingData {
+    start: number;
+    dnsLookup?: number;
+    tcpConnection?: number;
+    tlsHandshake?: number;
+    firstByte?: number;
+    download?: number;
+    total: number;
+}
+/**
+ * 请求数据
+ */
+export interface RequestData {
+    id: string;
+    traceId?: string;
+    url: string;
+    method: string;
+    headers: Record<string, string | string[]>;
+    body?: Buffer | string;
+    bodyTruncated?: boolean;
+    stackTrace: string;
+    timestamp: number;
+    response?: ResponseData;
+    error?: ErrorData;
+    timing?: TimingData;
+}
+/**
+ * 查询过滤器
+ */
+export interface QueryFilter {
+    urlPattern?: RegExp | string;
+    statusCode?: number;
+    statusCodeMin?: number;
+    statusCodeMax?: number;
+    method?: string;
+    traceId?: string;
+}
+/**
+ * 请求存储接口
+ */
+export interface IRequestStore {
+    add(request: RequestData): void;
+    updateResponse(id: string, response: ResponseData): void;
+    updateTiming(id: string, timing: TimingData): void;
+    updateError(id: string, error: ErrorData): void;
+    get(id: string): RequestData | undefined;
+    getByTraceId(traceId: string): RequestData[];
+    query(filter: QueryFilter): RequestData[];
+    clear(): void;
+    getAll(): RequestData[];
+    size(): number;
+}
+/**
+ * 环形缓冲区实现
+ */
+declare class RingBufferStore implements IRequestStore {
+    private buffer;
+    private maxSize;
+    private maxBodySize;
+    private writeIndex;
+    private count;
+    private idMap;
+    constructor(maxSize?: number, maxBodySize?: number);
+    /**
+     * 截断过大的 body
+     */
+    private truncateBody;
+    /**
+     * 添加请求
+     */
+    add(request: RequestData): void;
+    /**
+     * 更新响应数据
+     */
+    updateResponse(id: string, response: ResponseData): void;
+    /**
+     * 更新时序数据
+     */
+    updateTiming(id: string, timing: TimingData): void;
+    /**
+     * 更新错误数据
+     */
+    updateError(id: string, error: ErrorData): void;
+    /**
+     * 根据 ID 获取请求
+     */
+    get(id: string): RequestData | undefined;
+    /**
+     * 根据 TraceID 获取所有相关请求
+     */
+    getByTraceId(traceId: string): RequestData[];
+    /**
+     * 查询请求
+     */
+    query(filter: QueryFilter): RequestData[];
+    /**
+     * 清空所有请求
+     */
+    clear(): void;
+    /**
+     * 获取所有请求（按时间倒序）
+     */
+    getAll(): RequestData[];
+    /**
+     * 获取当前存储的请求数量
+     */
+    size(): number;
+}
+/**
+ * 获取全局请求存储实例
+ */
+export declare function getRequestStore(): IRequestStore;
+/**
+ * 重置全局请求存储（用于测试）
+ */
+export declare function resetRequestStore(): void;
+/**
+ * 创建新的请求存储实例（用于测试）
+ */
+export declare function createRequestStore(maxSize?: number, maxBodySize?: number): IRequestStore;
+export { RingBufferStore as RequestStore };
+//# sourceMappingURL=ring-buffer.d.ts.map

package/dist/types/store/ring-buffer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ring-buffer.d.ts","sourceRoot":"","sources":["../../../src/store/ring-buffer.ts"],"names":[],"mappings":"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"}

package/dist/types/test-setup.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Vitest 测试设置文件
+ *
+ * 这个文件在每个测试文件运行前执行
+ */
+export {};
+//# sourceMappingURL=test-setup.d.ts.map

package/dist/types/test-setup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"test-setup.d.ts","sourceRoot":"","sources":["../../src/test-setup.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAGH,OAAO,EAAE,CAAC"}

package/package.json

@@ -0,0 +1,103 @@
+{
+  "name": "@mt0926/node-network-devtools",
+  "version": "0.1.0",
+  "description": "🔍 Node.js network request monitoring tool with Chrome DevTools integration and built-in Web GUI",
+  "type": "module",
+  "main": "./dist/esm/index.js",
+  "module": "./dist/esm/index.js",
+  "types": "./dist/types/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/esm/index.js",
+      "types": "./dist/types/index.d.ts"
+    },
+    "./register": {
+      "import": "./dist/esm/register.js"
+    }
+  },
+  "bin": {
+    "node-network-devtools": "./dist/esm/cli.js",
+    "nnd": "./dist/esm/cli.js"
+  },
+  "files": [
+    "dist",
+    "templates",
+    "README.md",
+    "LICENSE",
+    "BUILD.md"
+  ],
+  "scripts": {
+    "build": "pnpm build:esm && pnpm build:types && pnpm build:gui",
+    "build:esm": "tsc -p tsconfig.esm.json",
+    "build:types": "tsc -p tsconfig.types.json",
+    "build:gui": "cd packages/gui && pnpm build",
+    "test": "vitest run",
+    "test:http": "npx tsx --test src/interceptors/http-patcher.node-test.mjs",
+    "test:undici": "npx tsx --test src/interceptors/undici-patcher.node-test.mjs",
+    "test:all": "pnpm test && pnpm test:http && pnpm test:undici",
+    "test:watch": "vitest",
+    "test:coverage": "vitest run --coverage",
+    "clean": "rimraf dist",
+    "format": "prettier --write \"src/**/*.{ts,js,json}\" \"packages/**/*.{ts,tsx,js,json}\"",
+    "format:check": "prettier --check \"src/**/*.{ts,js,json}\" \"packages/**/*.{ts,tsx,js,json}\"",
+    "prepublishOnly": "pnpm clean && pnpm build && pnpm test:all",
+    "prepack": "pnpm build",
+    "release:patch": "npm version patch && git push --follow-tags",
+    "release:minor": "npm version minor && git push --follow-tags",
+    "release:major": "npm version major && git push --follow-tags",
+    "setup": "node scripts/update-placeholders.js"
+  },
+  "keywords": [
+    "nodejs",
+    "network",
+    "devtools",
+    "debugging",
+    "chrome",
+    "cdp",
+    "fetch",
+    "http",
+    "inspector",
+    "monitoring",
+    "interceptor",
+    "websocket",
+    "gui",
+    "nextjs",
+    "express",
+    "request",
+    "response",
+    "trace"
+  ],
+  "author": "ddddd xx630133368@gmail.com",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/dong0926/node-network-devtools.git"
+  },
+  "bugs": {
+    "url": "https://github.com/dong0926/node-network-devtools/issues"
+  },
+  "homepage": "https://github.com/dong0926/node-network-devtools#readme",
+  "engines": {
+    "node": ">=18.0.0"
+  },
+  "devDependencies": {
+    "@types/node": "^20.10.0",
+    "@types/ws": "^8.5.13",
+    "fast-check": "^3.15.0",
+    "prettier": "^3.1.0",
+    "rimraf": "^5.0.5",
+    "tsx": "^4.21.0",
+    "typescript": "^5.3.0",
+    "vitest": "^1.1.0"
+  },
+  "dependencies": {
+    "@mswjs/interceptors": "^0.40.0",
+    "nanoid": "^5.0.4",
+    "open": "^10.1.0",
+    "undici": "^7.18.2",
+    "ws": "^8.18.0"
+  },
+  "optionalDependencies": {
+    "puppeteer": "^23.0.0"
+  }
+}

package/templates/instrumentation.ts

@@ -0,0 +1,32 @@
+// instrumentation.ts
+// 将此文件放在 Next.js 项目根目录（与 app 或 pages 目录同级）
+// 
+// 使用说明：
+// 1. 复制此文件到你的 Next.js 项目根目录
+// 2. 确保已安装 node-network-devtools: pnpm add node-network-devtools
+// 3. 使用 --inspect 标志启动 Next.js: NODE_OPTIONS='--inspect' pnpm dev
+// 4. 打开 Chrome DevTools (chrome://inspect) 查看网络请求
+
+export async function register() {
+  // 仅在 Node.js 服务端运行时初始化
+  if (process.env.NEXT_RUNTIME === 'nodejs') {
+    try {
+      // 动态导入以避免客户端打包问题
+      const { install, setConfig } = await import('node-network-devtools');
+      
+      // 可选：自定义配置
+      // setConfig({
+      //   maxRequests: 500,           // 最大存储请求数
+      //   maxBodySize: 512 * 1024,    // 最大 body 大小（512KB）
+      //   redactHeaders: ['authorization', 'cookie', 'x-api-key'], // 脱敏的头
+      // });
+      
+      await install();
+      
+      console.log('[node-network-devtools] 已在 Next.js 服务端初始化');
+      console.log('[node-network-devtools] 打开 chrome://inspect 查看网络请求');
+    } catch (error) {
+      console.warn('[node-network-devtools] 初始化失败:', error);
+    }
+  }
+}