yapi 插件_精神多了,当Swagger遇上YApi,瞬间高大上了!
YApi简介
YApi是高效、易用、功能强大的API管理平台,旨在为开发、产品、测试人员提供更优雅的接口管理服务。YApi在Github上已累计获得了18K+Star,具有优秀的交互体验,YApi不仅提供了常用的接口管理功能,还提供了权限管理、Mock数据、Swagger数据导入等功能,总之功能很强大!
安装
环境准备
本地部署YApi需要先安装nodejs和MongoDB,我们先把它们安装好。
安装nodejs,直接下载安装包双击安装即可,这里安装的是
12.14.0
版本,下载地址:https://nodejs.org/dist/v12.14.0/node-v12.14.0-x64.msi;安装MongoDB,参考《MongoDB快速入门,掌握这些刚刚好!》中的安装即可,这里安装的是
4.2.5
版本。
安装yapi-cli
yapi-cli
是YApi官方提供的安装工具,可以通过可视化界面来部署YApi服务,非常方便!
- 使用npm命令来安装
yapi-cli
:
npm install -g yapi-cli --registry https://registry.npm.taobao.org
- 安装成功后控制台输出如下内容;
- 安装成功后使用
yapi server
命令来启动YApi的可视化部署界面。
yapi server
安装YApi
- 通过可视化部署界面安装YApi服务,访问地址:http://localhost:9090
- 安装完成后会输出如下信息,提示YApi的默认管理员账号密码及访问地址;
- 进入YApi的安装目录,使用node命令启动YApi服务:
node vendors/server/app.js
- 启动成功后控制台输出信息如下;
- 通过页面访问Yapi,默认账号密码为
admin@admin.com:ymfe.org
,访问地址:http://localhost:3000
使用
从Swagger导入数据
- 使用管理员账号登录成功后,先创建一个
mall-tiny-group
分组;
- 创建分组成功后,在该分组下点击
创建项目
,添加mall-tiny-swagger
项目;
- 之后启动我们之前的
mall-tiny-swagger
项目,启动成功后Swagger接口文档访问地址:http://localhost:8088/swagger-ui/
- 选择好YApi的
数据管理
功能,配置好Swagger的api-docs路径,然后进行数据导入;
- 至此Swagger中的API接口已成功导入到YApi,点击
接口
标签查看所有导入接口。
接口管理
- 打开
添加商品
的接口看看,可以看到非常完善的接口文档信息,注释都有了;
- 来试试接口运行功能,我们会发现默认的接口请求地址并不符合我们的要求,需要在
环境配置
中设置;
- 由于是跨域请求,Chrome浏览器需要安装跨域请求插件,下载地址:https://github.com/YMFE/cross-request/archive/master.zip
- 由于我们的部分接口在请求头中添加token才能访问,所以我们先调用登录接口获取token;
- 之后在
设置->环境配置
中添加Authorization头;
- 再次调用需要登录的接口,可以正常获取到数据,返回数据虽然格式化了,但是没有折叠功能,数据太长的话就不太好看了;
Mock功能
- 在我们调用POST接口提交JSON数据时,默认Mock的JSON数据有点不太符合我们的要求;
- 可以通过接口信息中的
编辑->高级设置
进行修改;
- 我们可以发现每一个接口信息中都有个Mock地址,当我们后台接口已经定义好格式,但是没有实现时,前端可以使用该地址来Mock数据进行调试;
- 调用Mock地址可以获取到一些测试数据,数据取值返回可以通过上面的Mock设置自行修改;
从Swagger自动同步
- 当我们的接口修改了,API文档如何同步呢,我们可以通过
设置->Swagger自动同步
来开启自动同步功能,有三种数据同步模式可以选择;
权限管理
如果有新的成员加入进来,需要查看API文档怎么办?
- 首先可以通过注册界面注册一个成员账号,此处账号为
test@qq.com:123456
;
- 之后使用管理员账号登录,然后通过
成员列表->添加成员
,将用户添加到相应分组;
- 最后使用成员账号登录即可访问相应API文档了。
总结
YApi结合Swagger使用果然很强大!之前使用Postman结合Swagger使用时,文档查看、自动同步的问题都得到了解决,为了保证我们API文档访问的安全性还提供了权限管理功能。当API数据格式定义好后,Mock功能让前端无需后台实现也可以调试接口。不过对于JSON格式支持有点偏弱,要是能对JSON数据进行折叠显示就更好了!
参考资料
官方文档:https://hellosean1025.github.io/yapi/documents/index.html
SpringBoot健康检查,如何与容器配合?
2020-12-08
Validator,就来这一篇吧
2020-12-08
Docker 命令自动补全必须有
2020-12-06
「五大常用算法」一文图解分治算法和思想
2020-12-04
写代码有这16个好习惯,可以减少80%非业务的bug
2020-12-04
yapi 插件_精神多了,当Swagger遇上YApi,瞬间高大上了!相关推荐
- yapi 界面修改_当Swagger遇上YApi,瞬间高大上了!(一个好用的接口管理工具)...
前言 Swagger经常被人吐槽界面不够好看.功能不够强大,其实有很多工具可以和Swagger结合使用,结合之后就会变得非常好用.最近体验了一把YApi,发现确实不错,推荐给大家! YApi简介 YA ...
- yapi 插件_强大的开源API接口可视化管理平台——YAPI
背景 在之前有些时日,曾经写过一个API管理平台--DOClever,但是总觉得界面上稍微差了点,刚好之前有朋友在评论区留言,让我知道了今天要介绍的这个平台YAPI,YApi 是一个可本地部署的.打通 ...
- 类似360浏览器 拖拽插件_又一个好用的能上谷歌学术的插件,收藏吧。!
前段时间,给大家安利了一个能上谷歌学术的插件: 大飞鸽软件助手:一个插件,让你轻松浏览谷歌学术,助力科研!zhuanlan.zhihu.com 废话不多说,今天再次安利一个能够上谷歌学术的插件. 这 ...
- vue.js上传头像插件_一个基于vue2.0的头像上传组件
vue-avatar 基于vuejs2.0 + webpack环境使用的上传组件 支持服务器的域名和接口单独设置 支持自定义提交字段 支持自定义xhr 提交的header字段/表单name/限定上传格 ...
- 当 Swagger 遇上 Torna,瞬间高大上了!
Swagger作为一款非常流行的API文档生成工具,相信很多小伙们都在用!用多了可能会觉得它界面丑.功能弱.今天给大家推荐一款工具Torna,配合Swagger使用可以搭建界面漂亮.功能强大的A ...
- 平流式隔油池计算_当隔油池整改工作遇上“露天铁板烧”
八点半的太阳虽然火力不猛 但是每一排车座已经被烧至了七成热 这时候放入执法队员 -- 眼下正值一年中最热的"三伏天" 对于那些仍要在外面坚守岗位的执法队员们来说 这一整天下来 就像 ...
- win10任务栏透明_任务栏1秒变透明,桌面瞬间高大上,美化必备!
电脑工具第14期: 大家好呀,有的小伙伴在看到我的教程截图后,问我的电脑任务栏是怎样变透明的,其实很简单,本期章鱼哥就给大家推荐一款一键任务栏变透明神器,仅仅600多K,基本不占用电脑的cpu. 下图 ...
- html实体编码_多视角学习 | 当自动编码器“遇上”自动编码网络
作者 | 张泽宇 编辑 | 肖棠 李仲深 今天给大家介绍天津大学张长青教授等人在CVPR2019上发表的文章"AE2-Nets: Autoencoder in Autoencoder Net ...
- 漫画算法python篇_有点意思!当漫画遇上算法后(儿童节福利)
原标题:有点意思!当漫画遇上算法后(儿童节福利) 大家好,我是军哥 算法在大部分程序员眼里是枯燥的,晦涩难懂的,看到算法就感到头疼. 工作中也很少要去自己写个算法,直接调API完事,似乎没有学算法的必 ...
最新文章
- 设计模式之“代理模式”
- c语言动态迁移mysql,flask-migrate动态迁移数据库
- 基于Transformers入门自然语言处理!
- 【撸码师读书笔记】 大型网站技术架构——核心原理与案例分析
- 经常遇到的浏览器的兼容性有哪些?
- osm2mysql_安装部署MySQL主从复制
- 现任明教教主DM×××的3G链路备份
- 什么是java 前端_java前端后端分别是指什么?
- Qt实现音视频播放器
- php怎么设置浏览器禁止打开新窗口,JS打开新窗口防止被浏览器阻止的方法_javascript技巧...
- 在线广告系统的架构变迁
- 学习笔记(01):2019软考网络工程师--基础知识视频教程-数据通信基础(一)
- 《工程学导论》读后感
- win7音量图标不见了怎么办捏
- 微云虚拟化VOS操作系统
- 活动预告|CoodeWisdom 软件智能化开发与运维学术报告系列 第4期(陈鹏飞 中山大学)...
- Mac下如何将Safari书签导入Chrome
- 小红书运营模式是怎样的?弄清楚小红书底层逻辑
- 一、微信小程序-快速回顾(创建项目、项目结构分析)
- 【Web接口测试_基础概念】接口概念、接口分类、接口定义、接口规范、接口方法、接口用例设计整理
热门文章
- 用VC写Assembly代码(5) --函数调用(二)
- 程序员6年换了8份工作,工资从4.5K涨到40K,网友问:谁敢要你?
- 2019值得学习的5种编程语言,程序员来告诉你
- 抱歉,程序员的工作不能用时间来衡量
- java discard方法,Java ByteBuf.discardReadBytes方法代码示例
- 轨迹相似性度量方法总结
- 如何更合理地选择图表形式
- 没钱买KEGG怎么办?REACTOME开源通路更强大
- python for循环文件每一行_python – 在使用for循环读取文件时跳过一行
- OJ(Online Judge)系统汇总