共计 2199 个字符，预计需要花费 6 分钟才能阅读完成。
前端 mock 数据的难堪
作为前端开发，拿到产品的需要，和后端探讨接口和数据结构的定义后，就能够开始前端的开发工作了，但后端个别无奈在很短的工夫内把接口开发实现，提供给前端应用，前端为了在开发过程中模仿实在的接口申请，往往须要本人去实现接口 mock 数据。mock 数据是一件很麻烦的事，尽管有现成的 mock 库能够应用，生成 mock 数据，然而须要学习 mock 语法，学习老本高，破费工夫多，大大降低开发效率，只管之前在网络上尝试过很多接口 mock 平台，但大部分都是界面简陋，短少可视化的界面，同样须要学习 mock 语法，破费的工夫和精力仍然没有缩小，每次应用这些平台和工具都会有一种抗拒心理 …..
起初偶然间在网上发现了 Apifox 这个工具，一开始感觉和之前用过的接口 mock 平台差不多，抱着试试看的心态装置了这个软件，在应用过程中发现它的 mock 性能非常简单好用，缓缓喜爱上了这款软件。卧槽.png 原来 mock 数据能够如此简略，真的不得不拜服 Apifox 产品的思维，把日常开发遇到的痛点通过一个软件解决了，让程序员能够专一开发工作，大大地晋升了开发效率，接下来分享一下我是如何应用 Apifox 这个软件的 mock 性能。
首先要去 Apifox 官网 https://www.apifox.cn 下载软件，你会发现这是一个国产中文软件，而且是跨平台的，反对 widnow、macos 和 linux 三个平台。
找到本人电脑平台对应的软件，而后下载安装，第一次应用须要注册，注册实现登陆进去就能够欢快的应用了。
新建团队和我的项目
新建一个团队，例如新建一个【小猪快跑】的团队，团队能够邀请人员，但目前只是本人应用，不须要邀请其他人，而后点击新建我的项目按钮，新建一个【集体我的项目】，进入【集体我的项目】外面，能够看见软件的主界面
新建接口
如果前端开发须要开发一个界面展现用户信息，界面是酱紫的：
界面展现的信息包含：姓名、年龄、性别、电话、邮箱和头像，如果这里的数据是通过申请接口 /getUserInfo 失去的，那接口返回的数据结构应相似上面的代码：
{
code: 200,
success: true,
data: {
id: 5364
name:'张三',
age: 25,
gender: 'man',
phone: '19856281845',
avatar: 'http://example.com/xxx.png',}
}
接口的门路和参数：/getUserInfo?id=xxxx 有了下面这些信息，前端开发就能够在 Apifox 上新建一个接口来模仿申请获取 mock 数据。
1. 新建接口 鼠标移到➕按钮下面就会有一个下拉菜单，抉择新建接口 新建接口 空白接口2. 填写根本信息 在空白接口页填写接口的根本信息
门路：/getUserInfo
申请办法：GET（通过下拉抉择选中须要的申请办法）名称：获取用户信息
分组：根目录（不想放在根目录，能够本人新建分组）状态：开发中（有多种接口状态供选择，依据本人的需要抉择）标签：用于筛选器筛选接口，能够自在填写，这里就填用户
阐明：形容接口的性能
服务：申请的地址，能够应用默认设置
1. 填写申请参数信息 申请参数有四种不同的类型：Params、Body、Header 和 Cookie，开发者依据申请的类型来填写，目前 getUserInfo 接口只须要 Params 参数，参数名是 id、必填、示例值是 1234，如果接口有其余申请头信息，能够在 Header Tab 外面填写申请 header 的参数 参数信息
2. 填写返回 response 填写完申请的参数当前，如果想要返回 mock 数据，就要填写返回的 response，那如何去实现数据 mock 性能呢？在返回 response 这一模块，在 胜利 200 Tab 的面板上面填写 mock 配置，填写信息如下：
响应 mock.png 在 mock 输入框输出 @ 符号就会主动列出 mock 选项，在输出时会依据输出的内容筛选适合的 mock 语句，十分的人性化，几乎是 mock 小白的福音，如果想要查看更具体的 mock 操作，能够看官网文档 www.apifox.cn/help/app/mock/mock-rules/，外面列出很多 mock 例子，把须要的 mock 语句复制过去就能够应用了，实现后点击右上角的保留按钮。
3. 运行接口 接下来就是运行接口，看一看能不能失去咱们想要的 mock 数据，先抉择环境，选中 Mock 服务
抉择环境 点击运行按钮跳转到运行 tab
点击运行 而后点击发送就能够失去 mock 数据，察看返回的数据，和咱们的预期一样，当初前端就能够调用这个接口，拿到 mock 数据
在接口文档界面，点击 mock 表格里的 mock 链接就会主动复制链接
复制链接 把复制后的链接粘贴到在浏览器的地址栏，按下回车键，就能够看到网页显示的 json 数据了
网页后果 mock 服务器是在本地电脑上运行，其余连贯到同一局域网的设施能够通过拜访电脑的 ip 申请 /getUserInfo 接口获取 mock 数据
分享接口
当你胜利新建了一个接口，想分享给他人，就能够应用 Apifox 的接口分享性能，接口分享有两种类型：公开和公有，公开的不须要明码，公有的须要明码，他人就能够通过你分享的链接查看你的接口信息
写在最初
Apifox 除了 mock 数据这个性能外，还有很多能够晋升开发效率的性能，在这里就不一一列进去，Apifox 是收费的软件，感兴趣的同学能够去官网下载下来亲自去体验一下，感触它的弱小之处。
