无需登录 数据私有 本地保存

API响应模拟器 - JSON延迟/错误自定义

10
0
0
0

API 响应模拟器

模拟真实API响应,自定义JSON数据、HTTP状态码和网络延迟,助力前端开发与测试

GET /api/v1/users 模拟端点
正常
就绪
编辑JSON响应体。使用格式化按钮美化代码。
点击「发送请求」查看响应结果 响应将在此处展示
请求历史
暂无请求记录,发送请求后这里会显示历史
常见问题 & 知识百科

API响应模拟器是一种开发辅助工具,允许开发者在不依赖真实后端服务的情况下,自定义HTTP响应数据。

核心用途包括:
前后端并行开发:后端接口未就绪时,前端可根据API文档快速搭建Mock服务,不阻塞开发进度。
错误场景测试:模拟各种HTTP错误状态码(400、401、404、500等),验证前端的异常处理逻辑和用户提示。
性能测试:通过设置不同网络延迟,模拟弱网环境(3G/4G/WiFi),检验加载状态、超时处理和用户体验。
UI组件调试:为列表、表格、详情页等组件提供多样化数据(空数据、长文本、特殊字符),确保边界情况处理正确。
自动化测试:在E2E测试或单元测试中提供稳定可控的Mock数据源。

HTTP状态码由三位数字组成,第一位定义了响应类别:

2xx 成功:请求已成功被服务器接收、理解并处理。
200 OK - 标准成功响应
201 Created - 资源创建成功(常用于POST请求)
204 No Content - 成功但无响应体(常用于DELETE操作)

4xx 客户端错误:请求包含语法错误或无法完成,问题出在客户端。
400 Bad Request - 请求参数有误
401 Unauthorized - 需要身份验证(Token过期等)
403 Forbidden - 服务器拒绝访问(权限不足)
404 Not Found - 资源不存在
422 Unprocessable Entity - 参数格式正确但语义有误
429 Too Many Requests - 请求频率超限

5xx 服务器错误:服务器内部错误,问题出在服务端。
500 Internal Server Error - 服务器内部异常
502 Bad Gateway - 网关错误
503 Service Unavailable - 服务暂时不可用(维护中)

使用本工具的延迟设置功能可以轻松模拟各种网络环境:

📶 WiFi / 宽带:延迟 20-100ms — 模拟良好网络条件
📱 4G移动网络:延迟 100-500ms — 模拟常规移动网络
📱 3G移动网络:延迟 500-2000ms — 模拟较差网络环境
🐌 慢速/弱网:延迟 2000-5000ms — 模拟极端弱网或高延迟场景

测试建议:
• 检查Loading状态是否正常显示和隐藏
• 验证超时处理机制(建议设置8-10秒延迟测试)
• 确认用户在网络延迟期间的操作不会被意外阻塞
• 测试重试逻辑和错误提示的友好性
• 移动端应特别关注3G/弱网场景下的体验

常见的JSON格式错误及解决方法:

1. 尾部逗号(Trailing Comma):
{"name": "test",} ← 最后一个属性后多余的逗号,应删除。

2. 缺少引号:
JSON中所有键名必须用双引号包裹。单引号或无引号均不合法。
{name: "test"} → 应改为 {"name": "test"}

3. 注释问题:
JSON标准不支持注释(// 或 /* */),应移除所有注释。

4. 特殊字符转义:
字符串中的双引号需转义:{"msg": "他说\"你好\""}

快速修复:使用本工具的「格式化」按钮(),如果格式化失败会提示具体错误位置。也可使用在线JSON验证工具排查。

这是前端开发中非常重要的测试场景:

模拟401未授权(Token过期):
1. 在状态码下拉中选择 401 Unauthorized
2. 使用预设场景「未授权」自动填充标准错误响应体
3. 典型响应体:{"error": "Token已过期", "code": 401, "message": "请重新登录"}
4. 测试前端的自动刷新Token逻辑或跳转登录页行为

模拟403禁止访问(权限不足):
1. 选择 403 Forbidden 状态码
2. 响应体示例:{"error": "权限不足", "code": 403, "required_role": "admin"}
3. 验证前端是否正确显示权限提示页面

进阶测试:结合延迟设置,模拟Token刷新接口本身也很慢的情况,检验用户体验。

团队协作最佳实践:

1. 以API文档为基准:
前后端团队共同确认API接口规范(OpenAPI/Swagger),Mock数据应与文档严格一致。

2. 覆盖关键场景:
为每个接口准备多套Mock数据:正常响应、空数据、分页数据、各类错误响应。确保前端能处理所有情况。

3. 统一Mock服务:
使用本工具快速验证单个接口场景后,可将Mock配置同步到团队共享的Mock服务器(如JSON Server、Mockoon等)。

4. 版本管理:
将Mock数据文件纳入Git版本管理,方便追踪API变更历史。

5. 持续更新:
后端接口上线后,及时对比Mock数据与真实响应,修正差异。