APP测试的极简Mock方法——Mock服务端接口

本文适用的场景：在对移动端APP的纯移动端功能或者前端H5页面的纯前端功能进行测试时，服务端接口返回的数据不满足要求，或者制造测试数据比较复杂，需要使用Mock方法来快速构造数据。

Mock这个单词有模拟、效仿的意思，在软件开发中，通常指一个模拟的对象。这个模拟对象是真实对象的替代品，有了Mock，团队成员之间可以并行工作，而不必等待需要依赖的其他接口完成后才能开始工作。

• 在开发阶段，尤其是联调之前，Mock经常被开发人员用来进行调试；
• 在测试阶段，测试人员也可以用Mock提高我们的测试效率，不止在单元测试的测试脚本中可以应用，也可以应用在系统级别的测试上；

那怎么进行服务端接口级别的Mock呢，非常简单，只需要两个工具：

• 抓包工具Charles
• Easy Mock

Charles是一款抓包工具，我们要用Charles做移动端APP的代理，目的是为了把Request路由到Easy Mock的接口上，得到我们的Mock数据。

Easy Mock是一个可视化、能快速生成模拟数据的持久化服务，正如其名，Easy Mock能使Mock变得非常简单，令使用者爱不释手。

下面开始进入正题，Mock服务端接口的步骤如下：

1、Easy Mock创建接口

Easy Mock有着非常友好的可视化界面，操作起来非常简单。进入Easy Mock官网后，首先创建一个项目，一个项目包含若干个接口，我们最终模拟的是接口。

（1）我们创建了一个命名为test的项目，如下图，这个项目的基础url是/api。

（2）接下来，创建接口，如下图，左边是我们想要构造的接口返回的JSON数据，右边是这个接口的配置。

（3）将这个接口补充完成，如下图，这个接口配置的URL是/index/v6，实际的URL就是/api/index/v6，也就是父路径是这个接口所属的项目的基础URL。

（4）创建完成后，点击预览，这个接口就可以被访问了，完整的URL是https://www.easy-mock.com/moc...，我们把最后的#!method=get去掉，依然可以正常访问，所以这个URL就是我们的移动端APP应该去请求的接口。

本次进行Mock的场景是服务端接口已经存在，但是数据不满足要求，所以Response是通过Charles里的Copy Response复制到输入框里，然后在这个基础上做修改，这样比完全创造Response要简单得多。

现在， 要解决的问题就是怎么让移动端APP的请求重定向到这个URL上，就可以得到我们想要的Mock数据了。

2、Charles修改路由（Map Remote）

（1）我们把Charles设置成移动端APP的代理服务器，这样可以拦截到请求，再借助Charles的Map Remote功能，就可以把请求重定向到我们的Easy Mock的URL上。

(2)我们用移动端APP来请求这个接口，通过Charles可以看到，移动端APP的请求URL从http://backend.test.env/api/i...://www.easy-mock.com/mock/5b6ce6ccbf1ebd4a1974c563/api/index/v6这个接口上，而我们的请求参数query都完整地带着。

这样，移动端APP就能收到我们的模拟数据了，通过修改Easy Mock的JSON，可以很轻松地Mock我们想要的数据。

Easy Mock的简单介绍

在上面的方法中，我们是通过手动的方式修改Easy Mock的Response，实际上，Easy Mock还支持一些比较好的特性，可以引入在单元测试的自动化测试脚本中，比如：

• Mock.js，支持生成随机的数据、支持扩展更多数据类型、支持自定义函数和正则；
• 支持基于Swagger创建项目，以节省手动创建接口的时间；
• 通过Easy Mock CLI可自动生成API；
• 支持通过请求对象编写逻辑，实现响应式数据，支持自定义响应；
• 支持RESTful；

具体可移步到Easy Mock的官方文档进行查阅。