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对比(区别)
|
11月前
|
Dubbo 应用服务中间件 API
使用 Apifox、Postman 测试 Dubbo 服务,Apache Dubbo OpenAPI 即将发布
Apache Dubbo 3.3.3(即将发布)实现了与 OpenAPI 的深度集成,通过与 OpenAPI 的深度集成,用户能够体验到从文档生成到接口调试、测试和优化的全流程自动化支持。不论是减少手动工作量、提升开发效率,还是支持多语言和多环境,Dubbo 3.3.3 都展现了其对开发者体验的极大关注。结合强大的 Mock 数据生成和自动化测试能力,这一版本为开发者提供了极具竞争力的服务治理解决方案。如果你正在寻找高效、易用的微服务框架,Dubbo 3.3.3 将是你不容错过的选择。
943 245
|
8月前
|
存储 前端开发 数据可视化
Postman vs. Apifox 用于 API 测试全面对比
寻找一款可靠的 API 测试工具?这份对比分析将深入探讨 Postman 和 Apifox 的功能和特性。了解哪款工具最适合您的 API 测试需求。
|
9月前
|
网络协议 API 开发者
深入解密 :Postman、Apipost和Apifox API 协议与工具选择
作为全栈开发者,每天与API打交道是常态。本文总结了多年经验,深入解析常见API协议(HTTP(s)、SSE、gRPC、WebSocket、Socket.IO)及其适用场景,并对比三款主流调试工具(Postman、Apipost、ApiFox)。从基础特性到高级应用,帮助开发者根据需求选择最优方案,提升效率,让开发更顺畅!
|
10月前
|
JSON 前端开发 测试技术
大前端之前端开发接口测试工具postman的使用方法-简单get接口请求测试的使用方法-简单教学一看就会-以实际例子来说明-优雅草卓伊凡
大前端之前端开发接口测试工具postman的使用方法-简单get接口请求测试的使用方法-简单教学一看就会-以实际例子来说明-优雅草卓伊凡
695 10
大前端之前端开发接口测试工具postman的使用方法-简单get接口请求测试的使用方法-简单教学一看就会-以实际例子来说明-优雅草卓伊凡
|
9月前
|
JSON 监控 数据可视化
Apipost SocketIO调试指南:对比Postman/Apifox的实操优势
实时通信调试工具可能已「过时」!许多主流工具如Apifox不支持SocketIO协议,导致调试效率低下。而Apipost作为国产工具,原生支持SocketIO,提供自定义事件管理、连接状态可视化等功能,极大提升了实时通信开发的效率和准确性。选择正确的工具,告别「伪实时」调试,提升团队协作与维护效率。
293 15
|
10月前
|
JSON 前端开发 API
以项目登录接口为例-大前端之开发postman请求接口带token的请求测试-前端开发必学之一-如果要学会联调接口而不是纯写静态前端页面-这个是必学-本文以优雅草蜻蜓Q系统API为实践来演示我们如何带token请求接口-优雅草卓伊凡
以项目登录接口为例-大前端之开发postman请求接口带token的请求测试-前端开发必学之一-如果要学会联调接口而不是纯写静态前端页面-这个是必学-本文以优雅草蜻蜓Q系统API为实践来演示我们如何带token请求接口-优雅草卓伊凡
503 5
以项目登录接口为例-大前端之开发postman请求接口带token的请求测试-前端开发必学之一-如果要学会联调接口而不是纯写静态前端页面-这个是必学-本文以优雅草蜻蜓Q系统API为实践来演示我们如何带token请求接口-优雅草卓伊凡
|
9月前
|
JSON 监控 物联网
#WebSocket 调试全攻略:Postman、Apipost和Apifox核心解析、工具选择与对比!
WebSocket 是一种现代化的全双工通信协议,允许客户端和服务端通过持久连接实时双向传输数据。它适用于即时通讯、实时通知、金融行情、在线协作、物联网等场景。调试 WebSocket 时,工具应具备握手管理、实时消息收发、自定义 Header、消息大小监控、分组管理、多连接支持等功能。
738 1
|
前端开发
前端学习笔记202305学习笔记第二十二天-接口说明和postman验证
前端学习笔记202305学习笔记第二十二天-接口说明和postman验证
340 0
|
JSON 前端开发 数据可视化
取代Swagger + Postman ,Apifox 功能更强大
取代Swagger + Postman ,Apifox 功能更强大
367 0
取代Swagger + Postman ,Apifox 功能更强大