ApiPost与PostMan,你可以任选一款不错的接口管理工具

简介: ApiPost与PostMan,你可以任选一款不错的接口管理工具

我们都知道在一个团队中是由很多角色组成的,例如:业务、产品、设计、前端、后端、测试。每个角色各司其职,一起合作完成项目的交付。

而前端与后端的沟通则是需要通过一个统一的文件进行沟通交流,即通过接口文档事先约定好后端的接口返回内容,然后大家就按照这个文档约定完成前后端的开发。并且一般接口文档都是通过后端人员编写的,维护流程也比较繁琐。

最近被群里小伙伴安利了一款接口管理工具 ApiPost,陌溪在使用后觉的非常不错,在这里我也分享给大家。

ApiPost 包含了以下四种功能,同时具备接口调试,接口文档,以及 Mock 工具,以及接口流程测试。

ApiPost = API 接口调试工具 + 接口文档快速生成 + Mock 工具 + 接口流程测试

API 接口调试工具:常见的有 Postman、Postwoman 等等

接口文档快速生成:常见的接口文档工具有 Swagger 和 smart-doc,但是对代码侵入性比较强。

Mock 工具:主要用于前端根据接口生成对应的数据,如 RAP 等工具。

接口测试:常见的接口测试工具有 JMeter

同时 ApiPost 也是国人开发的一款接口管理工具,致力于打造更好用的、中文的、接口调试与文档管理工具(简直是英语渣渣的福音~)


e7079d63d1307241549a8a4eb70f050.png

049089913813e109bc332d182c91f27.png

Api 接口调试

代码格式化

接口调试是在开发阶段中使用最多的一个功能,利用 ApiPost 进行常规的接口调试功能

27290f8b9c8496c5c1c5ec879054190.png

ApiPost 进行常规的接口调试功能

让我感觉最舒服的是,对于返回的参数是可以进行 Json 格式化的,下面是 Postman 自带的 Pretty 功能 。

458b7b469d0ba4d022a8b5d40d06109.png

Postman自带的Pretty功能

下面是 ApiPostJson 格式化功能,并且通过右侧的三角形,可以对数组元素进行展开或者合拢。在面对返回结果是一个数组,并且每个对象中字段很多的时候,这个功能就非常棒了。

a16c16bf00f2591bf33d0f5c4afb608.png

ApiPost的Json格式化功能

没有对比就没有伤害,在看看 Postman 的输出,每次只能把结果复制出来,然后打开 Json 在线格式化,才能够看到返回的结果,简直增加了额外的负担。

Json 格式化:https://www.sojson.com/

d1a13dd45c9325a510b7ee934c737b1.png

在线Json格式化

全局参数

同时,还有一个让我非常喜欢的点,就是 全局参数

在上面的示例中,我们需要给接口填写对应的鉴权请求头,才能够请求后台获得数据。

af0f2b43a2c6bb89c08f79e411cdb38.png

全局参数

但在实际项目中,对于一批接口需要测试的时候,往往每个接口都需要填写相同的鉴权请求头,这样过程会非常繁琐。如果使用 ApiPost 的话,我们可以利用全局参数或者目录参数实现。

68eb4fb08b1749867d5d7b9ba670e89.png

全局参数

配置完成后,以后添加的接口,再次请求后台时,就会携带全局定义的请求头过去。同理,还支持全局的 Query 以及 Body,可以把一些不变的请求参数都配置好全局参数,这样会让我们编写接口请求时,省下很多时间~

目录参数

同时,我们还可以创建不同的目录,用来区分项目接口所处的不同模块。例如:以蘑菇博客为例,可以创建两个目录 mogu-admin 和 mogu-web,分别代表蘑菇博客的后端管理与门户项目。

蘑菇博客地址:https://gitee.com/moxi159753/mogu_blog_v2

因为,后台管理和门户是有两套鉴权逻辑的,即上面提到的全局配置 token 就不能针对两个场景生效了!

那如果我还想同时测试 门户类相关接口,或者是后台管理相关接口,那怎么办呢?

这个时候就需要用到目录参数了,它的作用和全局参数雷同,只是作用域不一样,mogu-admin 目录下的接口不会使用同级的 mogu-web 目录的目录参数作为发送参数。

a9dbe1c9905bd50fb9e1f77e0ce39fc.png

目录参数

通过对不同的目录,配置不同的全局参数,即可完美的解决刚刚的场景。

同时,当全局参数、目录参数、接口中都使用了同一个参数时,最终会按照以下优先级读取参数值:

单个接口 > 目录参数 > 全局参数

如上面的示例,如果全局参数、目录参数、接口中都定义了 header 参数 token:

全局参数:token 值为:698d51a19d8a121ce581499d7b701668 // 最低优先级 目录参数:token 值为:b50e345cc9febd86dedecc551ebcc505 // 其次优先级 单接口参数:token 值为:a1a9db893bb8a28ccb665d2af54d9417 // 最高优先级

那么最终发送的 token 值为:a1a9db893bb8a28ccb665d2af54d9417

接口文档快速生成

点击分享文档,即可获取对应的文档链接

68b4fdea1dcf8a2810a75c2c5bcc957.png

复制并打开文档地址就可以看到了完整的接口文档。

9aebce7104415e41f2472784a5ae6d7.png

细心的小伙伴可能会发现,这个请求参数上没有相关字段的介绍,我们回到刚刚的 ApiPost 页面,点击 提取字段和描述,然后填入对应的字段名称。

85b2c464010bfaa76ab1545922a7eb1.png

然后重新发布,即可看到每个字段的含义了

65f7d11ec93306956067c6eb70ec5e5.png

有更细心的小伙伴,可能又会发现,这里为啥缺了点返回值呢?那是因为 APIPOST 不会把发送后的实时响应的数据作为响应示例。这个时候,需要手动的将实时响应结果导入或者复制到对应的成功响应示例和错误响应示例。

b7262c3dffa3866330e6b01e44ab1ef.png

然后重新生成文档,这个时候,就会包含我们的成功示例啦。

431341ed05837159c3e081d6df8b7a8.png

同时还有对应的返回值字段描述

d8c84c2738a0cd72a914f8afbcf3e66.png

通过这个方法,可以随时随地的测试以及更新文档,简直是后端小伙伴的福音~

但是,不知道小伙伴们有没有发现一个问题,就是在生成接口文档的时候,还是需要自己填写参数描述。

填写参数描述是我们最烦恼的一件事情,尤其对于很多接口来说,往往具有大量相同名称、相同意义的参数,假如每次都需要手动录入,将会是一件非常耗时、低效的事情。

这个时候,我们可以通过 ApiPost 参数描述库解决这个问题,通过自定义参数描述库,我们可以将本项目用到的大量参数进行预注释。

9eacc76ed96743226ed5e4e8c3e1b2c.png

并且,我们在填写完某个描述后,会自动同步到 参数描述库,以后如果匹配到了相同的名称,会自动生成对应的描述,简直是一劳永逸的方法。

Mock 工具

我们都知道,在后端接口还没有开发完成的时候,接口是无法获取数据的,那么前端小伙伴就需要通过 Mock 事先编写好 API 的数据生成规则,由工具动态生成 API 的返回数据。通过访问 Mock 来获得页面所需要的数据,就可以轻松地完成对接工作。前后端人员只需要定义好接口文档就可以开始并行工作,互不影响,只在最后的联调阶段往来密切。

ApiPost 可以让你在没有后端程序的情况下能真实地返回接口数据,我们可以用 ApiPost 实现项目初期纯前端的效果演示,也可以用 ApiPost 实现开发中的数据模拟从而实现前后端分离。

同时,ApiPost 支持参数直接引用 mock.js 变量,点击下方可以查看 内置 Mock 字段变量 有哪些

76b67a018350fd34e7493c2e4ddcd65.png

目前常用的内置变量有以下几种:

@guid():随机生成一个 GUID,例:DEfbBBBf-7A23-a4DB-9BB1-57BCFf5FB5fc

@integer(1,100):随机生成一个 1 ~100 的整数

@datetime('yyyy-MM-dd HH:mm:ss'):返回一个随机的日期和时间字符串。例:1977-11-17 03:50:15

@url('http'):生成随机一个 http URL

@email():生成一个随机 email 邮箱

@province():随机生成一个中国省份(或直辖市、自治区、特别行政区)

@city():随机生成一个中国城市

@title():随机生成一个标题

@cname():随机生成一个中文名称

@cparagraph():随机生成一段中文文本

下面我们利用这些常见的 Mock 变量,来生成一个 Mock 服务吧。

首先点击 Mock 服务,然后编辑 Mock 模板,右侧即可看到我们实时生成的 Mock 数据 了

619098773fd429686e59105cd3e5ef4.png

在点击上方的 复制链接 ,即可把这个接口的 mock 请求交给前端小伙伴了,然后各种进行合作开发。

测试流程

流程测试是针对一个接口集合的测试,选择相应的环境,可以作为一系列请求一起运行。当您想要自动化 API 测试时,流程测试非常有用。点击开始,接口集合会并发的像服务器发出请求,最后会按照定义好的测试校验模块给出测试结果。对于测试同学来说,这是一个非常不错的功能。

在 ApiPost 中,创建一个流程测试需要如下步骤:

新建接口,并添加断言

打开流程测试,新建一个流程

向流程添加测试接口

选择环境,点击开始测试

查看返回的测试接口

流程测试界面如下图:

9acd54863e4af27c6a50a3f6909d0b9.png

通过点击接口名称查看请求的请求和响应参数信息

a5458f9224d4abdc9d2fb7fe9fb2b3f.png

同时在 ApiPost 中,还提供了很多内置函数,例如我们很轻松的就可以对某个变量进行解密处理。


更多关于 ApiPost 的功能,还等待小伙伴去发现。好啦,本期就到这里啦。

< END >

目录
相关文章
|
5月前
|
JSON JavaScript 测试技术
Postman接口测试工具详解
Postman接口测试工具详解
214 1
|
2天前
|
监控 JavaScript 测试技术
postman接口测试工具详解
Postman是一个功能强大且易于使用的API测试工具。通过详细的介绍和实际示例,本文展示了Postman在API测试中的各种应用。无论是简单的请求发送,还是复杂的自动化测试和持续集成,Postman都提供了丰富的功能来满足用户的需求。希望本文能帮助您更好地理解和使用Postman,提高API测试的效率和质量。
27 11
|
3月前
|
JSON Java 数据格式
使用postMan调试接口出现 Content type ‘multipart/form-data;charset=UTF-8‘ not supported“
本文介绍了使用Postman调试接口时遇到的“Content type ‘multipart/form-data;charset=UTF-8’ not supported”错误,原因是Spring Boot接口默认只接受通过`@RequestBody`注解的请求体,而不支持`multipart/form-data`格式的表单提交。解决方案是在Postman中将请求体格式改为`raw`并选择`JSON`格式提交数据。
使用postMan调试接口出现 Content type ‘multipart/form-data;charset=UTF-8‘ not supported“
|
2月前
|
JavaScript 前端开发 API
vue尚品汇商城项目-day02【9.Home组件拆分+10.postman测试接口】
vue尚品汇商城项目-day02【9.Home组件拆分+10.postman测试接口】
43 0
|
5月前
|
存储
Postman 接口测试配置 Pre-request Script
Postman 接口测试配置 Pre-request Script
233 5
Postman 接口测试配置 Pre-request Script
|
4月前
|
测试技术 API
软件测试:Postman 工具的使用。开发及测试均需要掌握的测试工具
这篇文章详细介绍了Postman工具的各个模块功能,包括创建请求、集合、环境、自动化测试等,并解释了如何使用Postman进行GET、POST、PUT和DELETE等常见HTTP请求的测试。
|
4月前
|
XML Web App开发 数据挖掘
Postman接口测试工具全解析:功能、脚本编写及优缺点探讨
文章详细分析了Postman接口测试工具的功能、脚本编写、使用场景以及优缺点,强调了其在接口自动化测试中的强大能力,同时指出了其在性能分析方面的不足,并建议根据项目需求和个人偏好选择合适的接口测试工具。
138 1
|
4月前
|
Web App开发 JSON 测试技术
精通Postman接口测试:关联技术与自动化实践指南
这篇文章详细介绍了如何使用Postman进行接口测试,包括关联技术、自动化实践,以及如何通过环境变量和全局变量解决接口之间的关联性问题。
125 0
精通Postman接口测试:关联技术与自动化实践指南
|
5月前
|
XML JSON 测试技术
Postman接口测试工具详解
📚 Postman全攻略:API测试神器!📚 发送HTTP请求,管理集合,写测试脚本,集成CI/CD。从安装配置到环境变量、断言、数据驱动测试,一步步教你如何高效测试RESTful API。实战案例包含GET、POST、PUT、DELETE请求。用Newman在命令行跑集合,自动化测试不发愁!👉 [洛秋小站](https://www.luoqiu.site/) 学更多!🚀
91 1
|
5月前
|
JavaScript 前端开发
文本,wangEditor5教程-上传图片,在开发文档的菜单配置当中,去搜索里搜索图片,也可以找到,上传图片必须有服务端的图片,验证接口正确用postman,wangEditor的postman接口
文本,wangEditor5教程-上传图片,在开发文档的菜单配置当中,去搜索里搜索图片,也可以找到,上传图片必须有服务端的图片,验证接口正确用postman,wangEditor的postman接口