停止等待后端 — 30秒模拟你的 API

Source: Dev.to

每个前端开发者都懂这种感觉：后端还没准备好，你手里有 Figma 设计稿、截止日期，却没有可调用的接口。常见的变通办法有：

• 将 JSON 硬编码到组件里。
• 在本地启动 json-server。
• 只能等。

这三种方式各有痛点。

现有 mock 工具的真正问题

现有工具大致分为两类。

太重。
MSW 功能强大，但需要安装、配置以及 Service Worker 的设置。Mockoon 很棒，却是桌面应用——你的 mock 只存在于你的机器上，其他人无法使用。MirageJS 强迫你在前端内部重建 API 层。

太简。
大多数在线 mock 服务只能提供一个静态 JSON 端点，无法模拟错误、延迟或测试慢速/损坏的 API。

这两类都没有解决实际需求：在不到一分钟的时间内得到一个可供全团队调用的工作 API URL，且无需任何配置。

前端开发者真正需要的东西

1. 设计师交付一个页面。
2. 前端开发者需要实现它。
3. 后端接口尚未存在。
4. 前端开发者被卡住。

解除卡住的关键不是一个完美架构的 mock 系统，而是一个 立即返回正确数据结构 的 URL，能够在不做任何配置的情况下与团队成员共享。

没有人填补的空白

在自己做项目时，我不断碰到同样的壁垒：

• 无需安装。
• 无需配置文件。
• 不要只在我的笔记本上存在的 mock。

我还需要测试真实场景：

• 模拟 3 秒的响应时间。
• 模拟间歇性失败（例如，每 3 次请求中有 1 次失败）。

大多数 mock 工具只能返回固定的 500 错误，无法支持概率性的失败。我找不到简单实现这些功能的工具，于是自己做了 mockserver.in。

工作原理

创建 mock 的三种方式

1. 自然语言 – 输入类似 “返回 5 条包含名称、价格和图片 URL 的商品列表”。服务会生成 JSON 并立即给出一个可用的实时 URL。
2. JSON 编辑器 – 粘贴自己的响应体，设置状态码，即可完成。
3. 表单 – 如果喜欢结构化输入，可以填写表单字段。

每个 mock 会立刻生成一个可分享的 URL——无需注册账号。

还能叠加的额外特性

• 固定或随机延迟
• 指定 HTTP 状态码
• 间歇性失败率（例如 “失败 20% 的请求”）
• 超时模拟

你的前端请求真实的 URL，移动端团队也请求同一个 URL。无需任何人本地运行东西。

适用人群

• 被缺失后端接口卡住的前端开发者
• 开发期间需要稳定 URL 的移动端开发者
• 后端与前端并行工作的团队
• 想在不触碰后端的情况下测试加载状态、错误处理和重试逻辑的任何人

试一试

mockserver.in – 免费提供 20 个 mock，无需信用卡，无需任何设置。描述你的接口，30 秒内即可得到 URL。