apifox超越了postman,给前端带来了哪些便利呢?

简介: 之前一直使用的时postman,或者直接使用后端提供的swagger来测试接口,一般情况下问题不大。 但又有很多事情没那么的便利,那接下来我就简单说说我这一段时间的使用感受吧。

image.png


大家好,我是 那个曾经的少年回来了。10年前我也曾经年轻过,如今已步入被淘汰的年龄,但如下幡然醒悟,所以活在当下,每天努力一点点,来看看2024年的时候自己会是什么样子吧,2024年的前端又会是什么样子,而2024年的中国乃至全球又会变成什么样子,如果你也有想法,那还不赶紧行动起来。期待是美好的,但是更重要的是要为美好而为之奋斗付诸于行动。


1、前言


之前一直使用的时postman,或者直接使用后端提供的swagger来测试接口,一般情况下问题不大。 但又有很多事情没那么的便利,那接下来我就简单说说我这一段时间的使用感受吧。


2、下载安装


官网地址:www.apifox.cn


包含window版本、Mac版本、以及Linux版本


安装完成后,直接微信扫码登录


image.png


这里以下都是自己使用的,有什么不妥之处我们可以一起进行探讨。


3、功能分享


3.1. 接口同步


公司后端接口使用的swagger,所以这里刚好能够进行设置自动同步


image.png


有时候后端更新了接口告诉你了,你也可以进行手动临时同步过来,还是非常方便的


当然如果跟前端小伙伴一起使用,有些时候可以点击右上角的刷新,便会将团队其他人的修改同步过来。


3.2、Mock模拟


image.png

image.png


有时候,甚至很多的时候,尤其是需求刚来的时候,接口一般都不会提供的,那么这个功能就派上用场了。


开启云端Mock设置,新增加接口后,便可以直接在项目中通过axios进行访问,当然你还可以通过token进行鉴权。


image.png


封装好之后便可以在项目中进行使用。等后端接口文档或者真正的接口来了,便直接进行更换接口路径以及接口字段就可以了。


3.3、生成typeScript


找到一个具体的接口


image.png


请求头和响应体都可以生成typescript,这里生成的字段,还有注释,直接读取swagger中的备注信息,保持了跟后端接口的一致性,真的非常不错


image.png


3.4、全局header等设置


image.png


3.5、前置操作和后置操作


image.png


这里简单的举个例子,比如登录接口,返回token,存到了全局变量当中


image.png


然后全局header中可以直接使用这个全局便令token,这样就不用每个接口都去设置token,一次设置全局受用。


3.6、测试管理


测试用例时完全可以实现,多个接口根据业务需求任意组合进行串行执行,得到最终想要的结果。里面其实还有针对性能测试的尝试,感觉对于测试人员来说也是可以进行尝试的功能。


3.7、持续集成


看官网是说可以对接Jenkins,将测试用例或者测试套件导出,然后集成到Jenkeins,这样代码提交或者指定某些分支push时便可以进行自动化的测试预输出,能很好的提升开发的质量。


虽然我没使用,但是我后面肯定会进行尝试,刚好前段时间在自己的电脑上安装了jenkins。


4、总结


其实我觉得这个对于前后端做约定也是非常好的,一般都是后端先写好文档,其实可以直接在apifox中,约定好接口名称以及参数,返回数据,这样前端其实就可以通过mock调用了,后端只需要去实现接口返回真实的数据,前后端可以通过接口的状态去判断接口是否可以调用真实的接口。


更多优秀功能有待继续开发,现在已经和公司前端小伙伴一起建团队项目了,用起来真的灰常不错。针对测试管理和持续集成方面自己实践还比较少,后续会继续慢慢的来探索apifox的优秀功能。


以上便是我使用过程中比较看中的几个功能,好了让我们来一起给apifox点个赞吧。


我的个人博客:vue.tuokecat.com/blog

我的个人github:github.com/aehyok

我的前端项目:pnpm + monorepo + qiankun + vue3 + vite3 + 工具库、组件库 + 工程化 + 自动化

不断完善中,整体框架都有了

在线预览:vue.tuokecat.com

github源码:github.com/aehyok/vue-…

目录
相关文章
|
数据可视化 JavaScript 前端开发
API工具--Apifox和Postman对比(区别)
Postman和Apifox有什么区别?他们之间分别有什么优势,感兴趣的同学可以继续往下看。 不吹不黑,只列功能,纯客观比对。
API工具--Apifox和Postman对比(区别)
|
前端开发
前端学习笔记202305学习笔记第二十二天-接口说明和postman验证
前端学习笔记202305学习笔记第二十二天-接口说明和postman验证
65 0
|
前端开发 API 开发工具
Postman 是前端用的还是后端用的
Postman 是一个流行的 API 测试与开发工具。它被广泛地应用在前后端开发的过程中,但是很多人对于它的使用场景存在疑惑。那么,到底是前端用还是后端用呢?
|
JSON 前端开发 数据可视化
取代Swagger + Postman ,Apifox 功能更强大
取代Swagger + Postman ,Apifox 功能更强大
187 0
取代Swagger + Postman ,Apifox 功能更强大
|
移动开发 前端开发 关系型数据库
postman如何跳过登录及权限,部分适用;数据库查询id,postman查询id都不一样,前端显示出id一样
postman如何跳过登录及权限,部分适用;数据库查询id,postman查询id都不一样,前端显示出id一样
456 0
postman如何跳过登录及权限,部分适用;数据库查询id,postman查询id都不一样,前端显示出id一样
|
JSON 前端开发 数据可视化
最强Postman替代品,国产软件Apifox到底有对牛?
作为软件开发从业者,API 调试是必不可少的一项技能,在这方面 Postman 做的非常出色。但是在整个软件开发过程中,API 调试只是其中的一部分,还有很多事情 Postman 无法完成,或者无法高效完成,比如:API 文档定义、API Mock、API 自动化测试等等。Apifox 就是为了解决这个问题而生的。
|
SQL JSON 数据可视化
为什么越来越多的开发者放弃使用Postman,而选择Apifox
作为一个后端开发,我做的大部分项目一般都是基于 Swagger 来管理 API 文档,基于 Postman 来做接口调试,基于 JMeter 来做接口性能测试,基于 RAP 等工具 Mock API 数据。
为什么越来越多的开发者放弃使用Postman,而选择Apifox
|
JSON 前端开发 数据可视化
Apifox才是最强Postman替代品,看看国产软件到底有对牛!
著名 UI 设计软件 Figma 宣布制裁大疆! 近日,网上流传一份 Figma 发送给大疆的内部邮件。 启用国产软件势在必行!
Apifox才是最强Postman替代品,看看国产软件到底有对牛!
|
前端开发 JavaScript 测试技术
取代 Postman + Swagger!这款神器Apifox功能更强,界面更炫酷!
取代 Postman + Swagger!这款神器Apifox功能更强,界面更炫酷!
343 0
取代 Postman + Swagger!这款神器Apifox功能更强,界面更炫酷!