json-api-mocker 2.2.2 → 2.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.ch.md +224 -95
- package/README.md +227 -98
- package/dist/cli.js +2 -37
- package/dist/index.d.ts +1 -5
- package/dist/index.js +2 -7
- package/dist/server.d.ts +14 -17
- package/dist/server.js +103 -290
- package/dist/types.d.ts +21 -26
- package/package.json +11 -20
- package/DESIGN.md +0 -227
- package/web/assets/index-Bkg4WfPW.js +0 -31
- package/web/assets/index-DiYdJ4Yt.css +0 -1
- package/web/index.html +0 -15
- package/web/monaco-editor-worker-loader.js +0 -8
- package/web/vite.svg +0 -1
package/README.ch.md
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
# JSON API Mocker
|
2
2
|
|
3
|
-
一个轻量级且灵活的 Mock
|
3
|
+
一个轻量级且灵活的 Mock 服务器,通过 JSON 配置快速创建 RESTful API。
|
4
4
|
|
5
5
|
<p align="center">
|
6
6
|
<img src="https://img.shields.io/npm/v/json-api-mocker" alt="npm 版本" />
|
@@ -10,57 +10,33 @@
|
|
10
10
|
|
11
11
|
## ✨ 特性
|
12
12
|
|
13
|
-
- 🚀
|
14
|
-
-
|
15
|
-
- 🔄 支持所有常用 HTTP 方法
|
13
|
+
- 🚀 通过 JSON 配置快速搭建
|
14
|
+
- 🔄 支持 GET、POST、PUT、DELETE 方法
|
16
15
|
- 📝 自动数据持久化
|
17
16
|
- 🔍 内置分页支持
|
18
17
|
- 🛠 可自定义响应结构
|
19
18
|
- 🎭 集成 Mock.js 实现强大的数据模拟
|
20
|
-
-
|
19
|
+
- 📤 支持文件上传
|
21
20
|
- 💡 TypeScript 支持
|
22
21
|
|
23
22
|
## 📦 安装
|
24
23
|
|
25
24
|
```bash
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
## 🚀 快速开始
|
30
|
-
|
31
|
-
服务器使用固定端口:
|
32
|
-
- API 服务器:35728
|
33
|
-
- Web 界面:35729
|
34
|
-
- WebSocket:35730
|
35
|
-
|
36
|
-
### 方式一:使用可视化界面(推荐)
|
25
|
+
# 使用 npm
|
26
|
+
npm install json-api-mocker
|
37
27
|
|
38
|
-
|
39
|
-
|
40
|
-
{
|
41
|
-
"server": {
|
42
|
-
"port": 35728,
|
43
|
-
"baseProxy": "/api"
|
44
|
-
},
|
45
|
-
"routes": []
|
46
|
-
}
|
47
|
-
```
|
28
|
+
# 使用 yarn
|
29
|
+
yarn add json-api-mocker
|
48
30
|
|
49
|
-
|
50
|
-
|
51
|
-
# 启动服务器并打开浏览器
|
52
|
-
json-api-mocker -o
|
31
|
+
# 使用 pnpm
|
32
|
+
pnpm add json-api-mocker
|
53
33
|
```
|
54
34
|
|
55
|
-
|
56
|
-
1. 可视化创建和管理 API
|
57
|
-
2. 实时查看请求日志
|
58
|
-
3. 监控 API 调用统计
|
59
|
-
4. 在线调试 Mock 数据
|
35
|
+
## 🚀 快速开始
|
60
36
|
|
61
|
-
###
|
37
|
+
### 1. 创建配置文件
|
62
38
|
|
63
|
-
|
39
|
+
在项目根目录创建 `data.json` 文件:
|
64
40
|
|
65
41
|
```json
|
66
42
|
{
|
@@ -70,21 +46,40 @@ json-api-mocker -o
|
|
70
46
|
},
|
71
47
|
"routes": [
|
72
48
|
{
|
73
|
-
"
|
74
|
-
"
|
75
|
-
"
|
76
|
-
|
77
|
-
"
|
78
|
-
"
|
79
|
-
"
|
80
|
-
|
81
|
-
|
49
|
+
"path": "/users",
|
50
|
+
"methods": {
|
51
|
+
"get": {
|
52
|
+
"type": "array",
|
53
|
+
"pagination": {
|
54
|
+
"enabled": true,
|
55
|
+
"pageSize": 10,
|
56
|
+
"totalCount": 100
|
57
|
+
},
|
58
|
+
"response": [
|
59
|
+
{
|
60
|
+
"id": 1,
|
61
|
+
"name": "张三",
|
62
|
+
"age": 30,
|
63
|
+
"city": "北京"
|
64
|
+
}
|
65
|
+
]
|
66
|
+
}
|
67
|
+
}
|
68
|
+
},
|
69
|
+
{
|
70
|
+
"path": "/upload/avatar",
|
71
|
+
"methods": {
|
72
|
+
"post": {
|
73
|
+
"type": "object",
|
74
|
+
"mock": {
|
75
|
+
"enabled": true,
|
76
|
+
"template": {
|
77
|
+
"success": true,
|
78
|
+
"message": "上传成功",
|
82
79
|
"data": {
|
83
|
-
"
|
84
|
-
|
85
|
-
|
86
|
-
"email": "@email"
|
87
|
-
}]
|
80
|
+
"url": "@image('200x200')",
|
81
|
+
"filename": "@string(10).jpg",
|
82
|
+
"size": "@integer(1000, 1000000)"
|
88
83
|
}
|
89
84
|
}
|
90
85
|
}
|
@@ -95,45 +90,110 @@ json-api-mocker -o
|
|
95
90
|
}
|
96
91
|
```
|
97
92
|
|
98
|
-
|
93
|
+
### 2. 启动服务器
|
94
|
+
|
95
|
+
有多种方式可以启动 Mock 服务器:
|
99
96
|
|
100
97
|
```bash
|
98
|
+
# 方式一:使用 npx(推荐)
|
99
|
+
npx json-api-mocker
|
100
|
+
|
101
|
+
# 方式二:使用 npx 并指定配置文件
|
102
|
+
npx json-api-mocker ./custom-config.json
|
103
|
+
|
104
|
+
# 方式三:如果全局安装了包
|
101
105
|
json-api-mocker
|
106
|
+
|
107
|
+
# 方式四:如果作为项目依赖安装
|
108
|
+
# 在 package.json 的 scripts 中添加:
|
109
|
+
{
|
110
|
+
"scripts": {
|
111
|
+
"mock": "json-api-mocker"
|
112
|
+
}
|
113
|
+
}
|
114
|
+
# 然后运行:
|
115
|
+
npm run mock
|
102
116
|
```
|
103
117
|
|
104
|
-
|
118
|
+
现在你的 Mock 服务器已经在 `http://localhost:8080` 运行了!
|
119
|
+
|
120
|
+
你会看到类似这样的输出:
|
121
|
+
```bash
|
122
|
+
Mock 服务器已启动:
|
123
|
+
- 地址:http://localhost:8080
|
124
|
+
- 基础路径:/api
|
125
|
+
可用的接口:
|
126
|
+
GET http://localhost:8080/api/users
|
127
|
+
POST http://localhost:8080/api/users
|
128
|
+
POST http://localhost:8080/api/upload/avatar
|
129
|
+
```
|
130
|
+
|
131
|
+
## 📖 配置指南
|
132
|
+
|
133
|
+
详细配置请参考 [CONFIG.ch.md](./CONFIG.ch.md)。
|
105
134
|
|
106
135
|
### 服务器配置
|
107
136
|
|
137
|
+
`server` 部分配置基本的服务器设置:
|
138
|
+
|
108
139
|
```json
|
109
140
|
{
|
110
141
|
"server": {
|
111
142
|
"port": 8080, // 服务器端口号
|
112
|
-
"baseProxy": "/api" //
|
143
|
+
"baseProxy": "/api" // 所有路由的基础路径
|
113
144
|
}
|
114
145
|
}
|
115
146
|
```
|
116
147
|
|
117
|
-
###
|
148
|
+
### 路由配置
|
118
149
|
|
119
|
-
|
150
|
+
每个路由可以支持多个 HTTP 方法:
|
120
151
|
|
121
152
|
```json
|
122
153
|
{
|
123
|
-
"
|
124
|
-
"
|
125
|
-
"
|
126
|
-
|
127
|
-
"
|
128
|
-
"
|
129
|
-
"
|
130
|
-
|
131
|
-
|
132
|
-
|
133
|
-
|
154
|
+
"path": "/users", // 路由路径
|
155
|
+
"methods": {
|
156
|
+
"get": {
|
157
|
+
"type": "array", // 响应类型:array 或 object
|
158
|
+
"pagination": { // 可选的分页设置
|
159
|
+
"enabled": true,
|
160
|
+
"pageSize": 10,
|
161
|
+
"totalCount": 100
|
162
|
+
},
|
163
|
+
"response": [] // 响应数据
|
164
|
+
},
|
165
|
+
"post": {
|
166
|
+
"requestSchema": { // 请求体验证模式
|
167
|
+
"name": "string",
|
168
|
+
"age": "number"
|
169
|
+
},
|
170
|
+
"response": {
|
171
|
+
"success": true
|
172
|
+
}
|
173
|
+
}
|
174
|
+
}
|
175
|
+
}
|
176
|
+
```
|
177
|
+
|
178
|
+
### 文件上传支持
|
179
|
+
|
180
|
+
你可以在 `data.json` 中配置文件上传接口:
|
181
|
+
|
182
|
+
```json
|
183
|
+
{
|
184
|
+
"path": "/upload/avatar",
|
185
|
+
"methods": {
|
186
|
+
"post": {
|
187
|
+
"type": "object",
|
188
|
+
"mock": {
|
189
|
+
"enabled": true,
|
190
|
+
"template": {
|
191
|
+
"success": true,
|
192
|
+
"message": "上传成功",
|
134
193
|
"data": {
|
135
|
-
"
|
136
|
-
"
|
194
|
+
"url": "@image('200x200')",
|
195
|
+
"filename": "@string(10).jpg",
|
196
|
+
"size": "@integer(1000, 1000000)"
|
137
197
|
}
|
138
198
|
}
|
139
199
|
}
|
@@ -142,44 +202,113 @@ json-api-mocker
|
|
142
202
|
}
|
143
203
|
```
|
144
204
|
|
145
|
-
|
205
|
+
#### 使用示例:
|
206
|
+
|
207
|
+
```bash
|
208
|
+
# 上传单个文件
|
209
|
+
curl -X POST http://localhost:8080/api/upload/avatar \
|
210
|
+
-H "Content-Type: multipart/form-data" \
|
211
|
+
-F "avatar=@/path/to/your/image.jpg"
|
212
|
+
|
213
|
+
# 上传多个文件
|
214
|
+
curl -X POST http://localhost:8080/api/upload/images \
|
215
|
+
-H "Content-Type: multipart/form-data" \
|
216
|
+
-F "images=@/path/to/image1.jpg" \
|
217
|
+
-F "images=@/path/to/image2.jpg"
|
218
|
+
```
|
219
|
+
|
220
|
+
详细配置选项请参考 [CONFIG.ch.md](./CONFIG.ch.md#文件上传配置)。
|
146
221
|
|
147
|
-
|
148
|
-
- 创建、编辑、删除 API
|
149
|
-
- 支持多种 HTTP 方法
|
150
|
-
- 可视化编辑响应数据
|
151
|
-
- Mock.js 语法提示
|
222
|
+
## 🎯 API 示例
|
152
223
|
|
153
|
-
###
|
154
|
-
|
155
|
-
|
156
|
-
|
157
|
-
|
224
|
+
### 基本的 CRUD 操作
|
225
|
+
|
226
|
+
#### 获取用户列表
|
227
|
+
```bash
|
228
|
+
curl http://localhost:8080/api/users
|
229
|
+
```
|
230
|
+
|
231
|
+
#### 获取单个用户
|
232
|
+
```bash
|
233
|
+
curl http://localhost:8080/api/users/1
|
234
|
+
```
|
158
235
|
|
159
|
-
|
160
|
-
|
161
|
-
-
|
162
|
-
-
|
163
|
-
-
|
236
|
+
#### 创建用户
|
237
|
+
```bash
|
238
|
+
curl -X POST http://localhost:8080/api/users \
|
239
|
+
-H "Content-Type: application/json" \
|
240
|
+
-d '{"name":"李四","age":25,"city":"上海"}'
|
241
|
+
```
|
164
242
|
|
165
|
-
|
243
|
+
#### 更新用户
|
244
|
+
```bash
|
245
|
+
curl -X PUT http://localhost:8080/api/users/1 \
|
246
|
+
-H "Content-Type: application/json" \
|
247
|
+
-d '{"name":"李四","age":26,"city":"上海"}'
|
248
|
+
```
|
166
249
|
|
250
|
+
#### 删除用户
|
167
251
|
```bash
|
168
|
-
|
252
|
+
curl -X DELETE http://localhost:8080/api/users/1
|
253
|
+
```
|
254
|
+
|
255
|
+
### 高级用法
|
169
256
|
|
170
|
-
|
171
|
-
|
172
|
-
|
173
|
-
|
174
|
-
-h, --help 显示帮助信息
|
175
|
-
-v, --version 显示版本号
|
257
|
+
#### 分页
|
258
|
+
```bash
|
259
|
+
# 获取第2页,每页10条数据
|
260
|
+
curl http://localhost:8080/api/users?page=2&pageSize=10
|
176
261
|
```
|
177
262
|
|
263
|
+
#### 自定义响应头
|
264
|
+
服务器自动添加以下响应头:
|
265
|
+
- `X-Total-Count`:数据总条数(用于分页响应)
|
266
|
+
|
267
|
+
## 🔧 高级配置
|
268
|
+
|
269
|
+
### 动态路由
|
270
|
+
|
271
|
+
你可以在路由中使用 URL 参数:
|
272
|
+
|
273
|
+
```json
|
274
|
+
{
|
275
|
+
"path": "/users/:id/posts",
|
276
|
+
"methods": {
|
277
|
+
"get": {
|
278
|
+
"type": "array",
|
279
|
+
"response": []
|
280
|
+
}
|
281
|
+
}
|
282
|
+
}
|
283
|
+
```
|
284
|
+
|
285
|
+
### 请求验证
|
286
|
+
|
287
|
+
为 POST/PUT 请求添加模式验证:
|
288
|
+
|
289
|
+
```json
|
290
|
+
{
|
291
|
+
"requestSchema": {
|
292
|
+
"name": "string",
|
293
|
+
"age": "number",
|
294
|
+
"email": "string"
|
295
|
+
}
|
296
|
+
}
|
297
|
+
```
|
298
|
+
|
299
|
+
## 🤝 贡献指南
|
300
|
+
|
301
|
+
1. Fork 本仓库
|
302
|
+
2. 创建你的特性分支 (`git checkout -b feature/amazing-feature`)
|
303
|
+
3. 提交你的改动 (`git commit -m '添加一些很棒的特性'`)
|
304
|
+
4. 推送到分支 (`git push origin feature/amazing-feature`)
|
305
|
+
5. 开启一个 Pull Request
|
306
|
+
|
178
307
|
## 📄 许可证
|
179
308
|
|
180
309
|
MIT © [熊海银]
|
181
310
|
|
182
311
|
## 🙏 致谢
|
183
312
|
|
184
|
-
-
|
185
|
-
-
|
313
|
+
- 感谢 Express.js 提供出色的 Web 框架
|
314
|
+
- 感谢所有贡献者和用户
|