feat: add request recording and replay

Author: pengzhanbo

README.md

@@ -48,6 +48,7 @@
 - 📤 Support `multipart` content-type, mock upload file.
 - 📥 Support mock download file.
 - ⚜️ Support `WebSocket Mock` and `Server-Sent Events Mock`
+- 📝 Support **recording** and **replay requests**
 - 🗂 Support building small independent deployable mock services.
 
 ## Documentation
@@ -326,6 +327,108 @@ export default defineMock({
   }
   ```
 
+### record
+
+- **Type:** `false | RecordOptions`
+- **Default:** `false`
+- **Details：**
+
+  Whether to enable the request recording feature. Once enabled, the plugin will record all request data for subsequent request playback.
+
+  Based on `vite.server.proxy`, the plugin records request data proxied by `http-proxy`.
+  After receiving a response, the plugin will record the request data and response data to the specified directory.
+
+  ```ts
+  interface RecordOptions {
+    /**
+     * Whether to enable the record feature
+     * - true: Enable, automatically record proxy responses
+     * - false: Disable (default)
+     * @default false
+     */
+    enabled?: boolean
+    /**
+     * Filter requests to record
+     * - Function: Custom filter function, return true to record
+     * - Object: Include/exclude patterns with glob or path-to-regexp mode
+     * @example
+     * ```ts
+     * // Record all requests
+     * filter: (req) => true
+     * // Record requests using glob pattern
+     * filter: { mode: 'glob', include: '/api/**' }
+     * // Record requests using path-to-regexp pattern
+     * filter: { mode: 'path-to-regexp', include: '/api/:id' }
+     * ```
+     */
+    filter?: ((req: RecordedReq) => boolean) | {
+      /**
+       * Include the request links that need to be recorded
+       *
+       * String: Glob pattern or path-to-regexp pattern
+       * (Use the mode option to set the mode, default is glob)
+       */
+      include?: string | string[]
+      /**
+       * Exclude request links that do not need to be recorded
+       *
+       * String: Glob pattern or path-to-regexp pattern
+       * (Use the mode option to set the mode, default is glob)
+       */
+      exclude?: string | string[]
+      /**
+       * Matching mode for include/exclude patterns
+       * - 'glob': Glob pattern matching (default)
+       * - 'path-to-regexp': Path-to-regexp pattern matching
+       */
+      mode: 'glob' | 'path-to-regexp'
+    }
+
+    /**
+     * Directory to store recorded data
+     * Relative to project root
+     * @default 'mock/.recordings'
+     */
+    dir?: string
+    /**
+     * Whether to overwrite existing recorded data
+     * - true: Overwrite old data for the same request (default)
+     * - false: Keep old data, do not record new data
+     * @default true
+     */
+    overwrite?: boolean
+    /**
+     * Expiration time for recorded data in seconds
+     * - 0: Never expire (default)
+     * - Positive number: Expire after specified seconds
+     * @default 0
+     */
+    expires?: number
+    /**
+     * Status codes to record
+     * - Empty array: Record all status codes (default)
+     * - Specify one or more status codes to filter
+     * @default []
+     */
+    status?: number | number[]
+    /**
+     * Should a .gitignore be added to the recording directory
+     * - true: Add (default)
+     * - false: Do not add
+     * @default true
+     */
+    gitignore?: boolean
+  }
+  ```
+
+### replay
+
+- **Type:** `boolean`
+- **Default:** `false`
+- **Details：**
+
+  Whether to enable the request playback feature. Once enabled, the plugin will simulate responses based on the recorded request data.
+
 ### priority
 
 - **Type:** `MockMatchPriority`

README.zh-CN.md

@@ -49,6 +49,7 @@
 - 📤 支持 multipart 类型，模拟文件上传
 - 📥 支持模拟文件下载
 - ⚜️ 支持模拟 `WebSocket` 和 `Server-Sent Events`
+- 📝 支持 **请求录制** 和 **请求回放**
 - 🗂 支持构建可独立部署的小型mock服务
 
 ## 文档
@@ -325,6 +326,110 @@ export default defineMock({
   }
   ```
 
+### record
+
+- **类型：** `false | RecordOptions`
+- **默认值：** `false`
+- **详情：**
+
+  是否开启请求录制功能。开启后，插件会记录所有请求数据，用于后续的请求回放。
+
+  插件在 `vite.server.proxy` 的基础上，记录被 `http-proxy` 代理的请求数据。
+  在获得响应后，插件会将请求数据和响应数据记录到指定的目录中。
+
+  ```ts
+  interface RecordOptions {
+    /**
+     * 是否启用录制功能
+     * - true: 启用，自动录制 proxy 响应
+     * - false: 禁用（默认）
+     * @default false
+     */
+    enabled?: boolean
+    /**
+     * 过滤要录制的请求
+     * - 函数：自定义过滤函数，返回 true 表示录制
+     * - 对象：包含/排除模式，支持 glob 或 path-to-regexp 模式
+     * @example
+     * ```ts
+     * // Record all requests
+     * filter: (req) => true
+     * // Record requests using glob pattern
+     * filter: { mode: 'glob', include: '/api/**' }
+     * // Record requests using path-to-regexp pattern
+     * filter: { mode: 'path-to-regexp', include: '/api/:id' }
+     * ```
+     */
+    filter?: ((req: RecordedReq) => boolean) | {
+      /**
+       * 包含需要录制的请求链接
+       *
+       * glob 模式或 path-to-regexp 模式
+       * (使用 mode 选项设置模式，默认为 glob)
+       */
+      include?: string | string[]
+      /**
+       * 排除不需要录制的请求链接
+       *
+       * glob 模式或 path-to-regexp 模式
+       * (使用 mode 选项设置模式，默认为 glob)
+       */
+      exclude?: string | string[]
+      /**
+       * 包含/排除模式的匹配模式
+       * - 'glob': glob 模式匹配（默认）
+       * - 'path-to-regexp': path-to-regexp 模式匹配
+       */
+      mode: 'glob' | 'path-to-regexp'
+    }
+    /**
+     * 录制数据存储目录
+     * 相对于项目根目录
+     * @default 'mock/.recordings'
+     */
+    dir?: string
+
+    /**
+     * 是否覆盖已有录制数据
+     * - true: 相同请求覆盖旧数据（默认）
+     * - false: 保留旧数据，不录制新数据
+     * @default true
+     */
+    overwrite?: boolean
+    /**
+     * 录制数据过期时间（秒）
+     * - 0: 永不过期（默认）
+     * - 正数：指定秒数后过期
+     * @default 0
+     */
+    expires?: number
+
+    /**
+     * 要录制的状态码
+     * - 为空数组时记录所有状态码（默认）
+     * - 指定一个或多个状态码进行过滤
+     * @default []
+     */
+    status?: number | number[]
+
+    /**
+     * 是否在录制目录中添加 .gitignore
+     * - true: 添加（默认）
+     * - false: 不添加
+     * @default true
+     */
+    gitignore?: boolean
+  }
+  ```
+
+### replay
+
+- **类型：** `boolean`
+- **默认值：** `false`
+- **详情：**
+
+  是否开启请求回放功能。开启后，插件会根据记录的请求数据，模拟响应。
+
 ### priority
 
 - **类型：** `MockMatchPriority`

docs/.vitepress/config.ts

@@ -48,6 +48,7 @@ const vitepressConfig: UserConfig<DefaultTheme.Config> = defineConfig({
       },
     ],
     search: { provider: 'local' },
+    outline: [2, 3],
   },
   vite: {
     plugins: [

docs/config.ts

@@ -58,6 +58,7 @@ export default defineAdditionalConfig({
 
     outline: {
       label: 'Page navigation',
+      level: [2, 3],
     },
 
     lastUpdated: {
@@ -142,6 +143,7 @@ function sidebarGuide(): DefaultTheme.SidebarItem[] {
         { text: 'Plugin Configuration', link: 'plugin-config' },
         { text: 'Mock Configuration', link: 'mock-config' },
         { text: 'WebSocket Configuration', link: 'websocket-config' },
+        { text: 'Record and Replay', link: 'record-and-replay' },
       ],
     },
     {