Apifox在研发过程中的实践

438 阅读8分钟

Apifox在研发过程中的实践

apifox可以帮助我们做什么事情

一般通过swagger生成api文档,通过swagger生成的api文件中,需要调试接口的时候,每次执行完成的结果如果想要保存给其他人使用,或者要定义一下公共参数我们需要在代码中些很多配置,如果有些参数调整我们可能还需要把代码中的相关参数调整从新发布一次swagger这样参数的变化才会生效;另外如果我们有多个环境,多个服务在使用swagger的过程中一个服务的多个环境我们就需要切换多个地址来访问,这些或多或少使用起来都有一些不方便。

我们可以将swagger生成的后端restful api接入到apifox中,使用apifox可以帮助我们解决这些问题,可以通过apifox更高效的提高团队协作,以及研发间接口的互相传递,apifox还提供了自动化测试的能力等,在这里更多描述小团队间的协作等功,自动化测试只是简单介绍后期在补充更多关于自动化测试的功能,关于更多apifox的介绍可以参考官网

使用流程 image.png

团队/项目

创建团队/项目

image.png 项目设置直达操作后,登录进来可以直接进入项目页面 image.png

邀请成员

可以通过链接,账号等方式邀请成员加入项目。 image.png image.png

环境/服务/分组

环境:对应实际开发过程中的各个环境,例如dev环境,test环境和本地环境等; 服务:在当前微服务模式中,我们在同一个环境中会部署多个服务,在实际调用接口的时候,不同的服务通过url中的各自服务名可以来区分,一般默认服务可以配置微服务网关的地址,其他服务的url可以在默认服务的路径后接上服务名; image.png image.png

例如:当前微服务中有一个cmp服务,网关服务gateway对应的,服务地址为:192.168.101.6:8011,域名为:dpi.smart.com。那么在apifox的环境信息中可以配置对应的cmp服务的访问地址为服务地址为:192.168.101.6:8012(直接通过ip端口访问不走浏览器验证,域名为:dpi.smart.com/cmp

创建环境/服务

根据团队使用情况来配置所需要的环境,大多数情况都会需要本地环境/开发环境/测试环境, image.png 本地环境下的网关服务(默认服务),cmp服务,cms服务 image.png 开发环境-通过ip:port方式访问,网关服务(默认服务),cmp服务,cms服务。 image.png 开发环境-通过域名来访问,网关服务(默认服务),cmp服务,cms服务。 image.png

在创建好环境后,在各个环境中配置不同微服务的对应的前置url配置,最终通过**前置url+接口url**的方式可以访问到具体服务中的接口,另外也可以设置环境的可见属性等,一般团队公用的设置共用即可。

**接口管理**中进行分组的创建和分组服务配置

创建分组/配置服务

可以通过分组来将api进行分类管理,可以结合实际情况将分组和微服务业务结合,来根据实际情况来看是否需要进行子分组的设置。 image.png image.png 这里以cmp微服务为例,cmp服务在swagger的配置中将接口分为两个组客户端,运维端接口。对应的在apifox的接口和数据模型中分别创建cmp分组对应cmp服务,在cmp服务下分别创建cmp客户端和cmp运维端两个子分组,对应swagger中的客户端和运维端接口。 image.png 创建cmp分组并且设置分组对应的服务为cmp服务,后面在调用接口的时候会就会选择cmp服务对应的前置url。 image.png 创建子分组cmp运维端设置服务继承父级,会选择和父组织对应的服务作为api调用的前置url。 image.png cmp运维端接口效果 image.png


Swagger接口导入

再结合项目情况配置好,环境/服务/分组信息后,接下来将swagger配置导入到我们已经创建好的分组,可以在项目设置中进行api导入的相关配置。 项目设置->数据管理->导入数据->新建数据源 以创建cmp客户端分组对应的swagger api数据源为例,设置对应的url以及apifox同步swagger的方式和间隔和分组信息。 接口分组设置 image.png 数据模型分组设置 image.png 这里选择配置的是同分组下同URL才会覆盖,这个参数可以结合实际使用情况来进行调整,设置完成后点击保存。可以设置定时同步或者手动同步。 image.png 同步接口 image.png


API调用和测试用例

接下来以cmp服务->cmp客户端->用户管理->当前用户登录信息接口为例来看下在apifox中接口的调用,以及接口用例的保存。

接口->文档

在接口的文档展示页面可以看到接口的path等基础信息,也可以看到接口的请求参数和响应参数,apifox提供了接口调用的代码生成,可以选择多种语言,以及Mock调用接口(Mock可以调用绝大多数的接口,有些过于复杂的接口可能会遇到不成功的情况,可以快速模拟接口调用,Mock可以作为快速调用的一个选择,实际开发场景中还是以实际构建参数调用为主)。 image.png image.png

接口->文档->代码生成 可以快速生成调用示例代码。

image.png image.png

接口->文档->Mock调用

apifox提供的Mock调用可以很方便的发起一个接口的Mock调用,这对于前端开放来说很方便,不需要自己手动生成一个很长的json文件,也不用一直等待后端接口的到来,可以直接调用Mock的接口地址,就可以获取到Mock出的参数进行开发,这个可以很大程度上减少前后端对接过程中的所需要的时间。 image.png image.png 在浏览器直接访问Mock接口地址 image.png **注意**:关于云端Mock放开后有可能会暴露接口数据的风险,需要结合实际情况来看(**当前禁止使用云端Mock功能**)。 image.png 整体来看合理的使用本地Mock接口,会极大的减少前后端连调的时间,甚至可以达到联调0耗时。

接口->运行->保存测试用例

将接口的调用结果保存为测试用例,保存在接口可以看到保存的测试用例信息,方便后面调用。 image.png

image.png

image.png 无论是使用保存好的测试用例,还是直接调用接口,都可以通过切换右上角的环境来调用不同环境的接口。

image.png

可以针对接口创建出多个测试用例,后面如果有需求改动接口,研发可以直接进行接口的用例回归测试,能够提高自测环节的质量。 image.png 接下来调用acp-cms服务的接口可以看到,由于配置了服务和分组的对应关系,接口的前置url会自动切换到acp-cms服务对应的url,其他服务只需要按照上面的步骤进行导入即可正常使用访问。 image.png


分享接口

image.png image.png

获取分享链接访问接口 image.png

image.png


自动化测试

执行自动化测试之前,需要先创建测试用例和测试套件,对于简单场景可以直接使用测试用例,对于复杂场景可以通过测试套件将多个用例结合执行,最终生成测试报告(单独执行测试用也可以生成测试报告)。在创建测试用例和套件的时候,也可以根据项目实际情况将用例和服务/业务关联。 image.png

测试用例

创建测试用例推荐使用接口已经存在的用例 image.png 可以根据情况选择是复制还是直接绑定 image.png 创建完成后运行测试用例,生成测试报告 image.png image.png 查看用例中单个接口的详情 image.png 报告查看 image.png

测试套件

创建套件选择测试用例 image.png image.png image.png 执行完成查看报告 image.png 关于测试用例和测试套件还有更多参数和选项可供使用,关于更多功能在后面使用中在继续挖掘。


总结

  1. 通过apifox可以实现团队间的接口信息协同等操作,提高前后端的接口传递效率,也可以提高研发团队和测试团队间的接口协同等操作;
  2. apifox中的多环境支撑更好的支撑研发在多环境中的接口调用和调试;
  3. 工具提供的自动化测试功能,可以解决掉接口自动化的问题;
  4. 这里只是针对apifox的部分使用的描述,更多其他功能在后面有机会用到再补充;