什么是 Mock?
Mock(模拟)是一种在软件开发中用于替代真实依赖的技术。在前后端分离的开发模式中,前端常使用 Mock 来模拟后端 API 返回的数据,从而在不依赖后端接口的情况下进行开发和测试。
为什么需要 Mock?
- 加快前端开发进度,无需等待后端接口完成
- 便于单元测试和集成测试
- 避免因网络或服务不可用导致开发中断
- 统一接口格式,减少联调成本
常见 Mock 工具
- Mock.js:轻量级 JavaScript 库,可拦截 Ajax 请求并返回模拟数据
- JSON Server:基于 JSON 文件快速搭建 REST API
- YApi / Apifox / Easy Mock:在线 Mock 平台,支持团队协作
- Postman Mock Server:通过 Postman 创建模拟接口
快速上手:使用 Mock.js 示例
安装(通过 CDN):
<script src="https://cdn.jsdelivr.net/npm/mockjs/dist/mock.js"></script>
基本用法:
Mock.mock('/api/user', {
'id|1-100': 1,
'name': '@cname',
'email': '@email'
});
// 发起请求
fetch('/api/user')
.then(res => res.json())
.then(data => console.log(data));
运行后,每次请求 /api/user 都会返回模拟的用户数据。
最佳实践建议
- 将 Mock 数据与真实接口结构保持一致
- 在项目中建立统一的 Mock 配置目录
- 开发环境启用 Mock,生产环境关闭
- 配合 TypeScript 或接口文档提升协作效率