前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >docker搭建yapi接口文档系统、Idea中上传接口、在线调用

docker搭建yapi接口文档系统、Idea中上传接口、在线调用

作者头像
掉发的小王
发布于 2022-10-05 07:41:53
发布于 2022-10-05 07:41:53
1K00
代码可运行
举报
文章被收录于专栏:小王知识分享小王知识分享
运行总次数:0
代码可运行

一、前言

在我们后端开发中,必不可少的是接口的交接,有很多种方式,常见的就是swagger,不过这个侵入性太强了。还有就是接口文档的框架,比如今天小编带大家一起搭建的yapi,在公司还是挺常见的! 今天小编就大家从搭建到使用,详细的教学一波哈!!

二、介绍

1. 平台介绍

YApi 是高效、易用、功能强大的 api 管理平台,旨在为开发、产品、测试人员提供更优雅的接口管理服务。可以帮助开发者轻松创建、发布、维护 API,YApi 还为用户提供了优秀的交互体验,开发人员只需利用平台提供的接口数据写入工具以及简单的点击操作就可以实现接口的管理。

2. 特性

  • 基于 Json5 和 Mockjs 定义接口返回数据的结构和文档,效率提升多倍
  • 扁平化权限设计,即保证了大型企业级项目的管理,又保证了易用性
  • 类似 postman 的接口调试
  • 自动化测试, 支持对 Response 断言
  • MockServer 除支持普通的随机 mock 外,还增加了 Mock 期望功能,根据设置的请求过滤规则,返回- - 期望数据
  • 支持 postman, har, swagger 数据导入
  • 免费开源,内网部署,信息再也不怕泄露了

3. 环境支持

docker中只需要搭建一下mongo,用来数据的存储即可!

三、运行mongo

0. 创建网络

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
docker network create yapi

1. 创建挂载文件

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
mkdir -p /data/mongo

2. 运行mongo

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
docker run -d \
  --name mongodb \
  --restart always \
  --net=yapi \
  -p 27017:27017 \
  -v /data/mongo:/data/db \
  -e MONGO_INITDB_DATABASE=yapi \
  -e MONGO_INITDB_ROOT_USERNAME=yapi \
  -e MONGO_INITDB_ROOT_PASSWORD=yapi \
  mongo

启动 MongoDB,其中 -e 指定 MONGO_INITDB_ROOT_USERNAME 为 MongoDB 的 ROOT 用户名,MONGO_INITDB_ROOT_PASSWORD 为 MongoDB 的 ROOT 用户密码

3. 进入容器初始化数据库

进入 MongoDB 容器,从上图查看 MongoDB 容器可以获取到容器 id,以下示例使用 50f1f6c50139代表 MongoDB 的容器 id,只需要简写即可!

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
docker exec -it 50 /bin/bash

接着输入:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
mongosh

==新版本需要加上sh,不然无法进入!==

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
use admin;
db.auth("yapi", "yapi");
# 创建 yapi 数据库
use yapi;
# 创建给 yapi 使用的账号和密码,限制权限
db.createUser({
  user: 'yapi',
  pwd: 'yapi',
  roles: [
 { role: "dbAdmin", db: "yapi" },
 { role: "readWrite", db: "yapi" }
  ]
});
# 退出 Mongo Cli
exit
# 退出容器
Ctrl+P+Q

四、运行yapi

1. 搭建挂载配置文件

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
mkdir -p /data/yapi
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
vim config.json
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
{
   "port": "3000",
   "adminAccount": "wangzhenjun1221@163.com",
   "timeout":120000,
   "db": {
     "servername": "mongo",
     "DATABASE": "yapi",
     "port": 27017,
     "user": "yapi",
     "pass": "yapi",
     "authSource": ""
   },
   "mail": {
     "enable": true,
     "host": "smtp.gmail.com",
     "port": 465,
     "from": "*",
     "auth": {
       "user": "wangzhenjun1221@163.com",
       "pass": "xxx"
     }
   }
 }

:wq退出

2. 初始化数据库表

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
docker run -d --rm \
  --name yapi-init \
  --link mongodb:mongo \
  --net=yapi \
  -v /data/yapi/config.json:/yapi/config.json \
   yapipro/yapi \
  server/install.js

3. 测试连接mongo

我们使用Navicat进行可视化的连接 数据库输入:admin 用户名密码都是刚刚配置的:yapi

连接成功!!

4. 运行yapi

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
docker run -d \
   --name yapi \
   --link mongodb:mongo \
   --restart always \
   --net=yapi \
   -p 3000:3000 \
   -v /data/yapi/config.json:/yapi/config.json \
   yapipro/yapi \
   server/app.js

5. 测试使用

ip:3000 http://192.168.84.144:3000/

初始化管理员账号在上面的 config.json 配置中adminAccount 初始化密码就是:yapi.pro

6. 新建项目

7. 获取token

五、Idea中使用

1. 下载插件

插件名称:EasyYapi

2. 配置插件

3. 测试上传

找到controller

选择你要上传的接口,点击对号上传!

填写token

上传成功:

六、在线请求使用

1. 配置地址

2. 配置地址

3. 安装cross-request 插件

发送请求时,会提醒你安装,你按照提示安装下载即可!

也可以下载小编的:

链接:https://pan.baidu.com/s/1Bx6nGFjKsQ3ajbnLPcjsSA 提取码:gljt

直接解压,拖拽到这里就行!!

4. 点击发送

测试完成!!

七、总结

总的来说搭建还是比较简单,集成和使用也挺好用!非常推荐哈!!

小编辛辛苦苦写了半天,看到这里还不给小编点个关注!!谢谢大家


Q.E.D.

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2022-09-28,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
7b2美化-列表文章上浮效果
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
小狐狸说事
2022/11/16
4480
7b2美化-列表文章上浮效果
7b2美化-首页添加导航会员区块
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
小狐狸说事
2022/11/17
8070
WordPress网站B2主题会员展示模块
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
小狐狸说事
2022/11/17
1.1K0
WordPress网站B2主题会员展示模块
7b2美化-添加好看的底部介绍
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
小狐狸说事
2022/11/16
7100
7b2美化-添加好看的底部介绍
WordPress动漫图片主题cxudy模板代码
WordPress多功能CX-UDY图片主题是基于wordpress开源程序开发的简洁时常自适应图片模板,适用于各种图片写真类型、图片壁纸类、博客站、多媒体分享站等类型站点。图片主题效果演示http://m.bokequ.com/dongman/gc
博客趣
2024/02/14
4210
WordPress动漫图片主题cxudy模板代码
关于本博客皮肤样式配置
先向博客园申请开通博客 向博客园申请博客js权限 这两步谷歌吧, 我已经申请好了,没法截图 设置博客皮肤模板 否则下面css,js会跟其他模板不兼容 修改页面定制css代码 *,.Cal{paddin
iginkgo18
2020/09/27
5090
关于本博客皮肤样式配置
高质量编码-轨迹管理平台(CSS样式)
样式仿照百度地图鹰眼轨迹服务早期版本的web端轨迹管理台,地图和UI都使用了夜色风格。
MiaoGIS
2020/12/17
5250
高质量编码-轨迹管理平台(CSS样式)
7b2美化-首页添加动态北极熊搜索样式
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
小狐狸说事
2022/11/16
7470
7b2美化-首页添加动态北极熊搜索样式
菜鸡博客开……开……开源了!
因为很多人找我要过博皮源码,所以本宝宝经过深思熟虑,最终决定把自己的源码分享给大家!
attack
2018/09/21
2.9K0
HTML5环形音乐播放器
通过 HTML5,音乐在网络上东山再起。添加音频文件就像插入图像那样简单,并且用户能在浏览器外播放音乐,从而实现惊人的音乐体验。<audio> 标签的推出使您不再需要外部音乐播放器,在网站上实现真正的声音融合。 随着 HTML5 的出现,发生了一些重大变化,特别是在音乐和音频方面。开发人员不再要求 web 冲浪者使用 Adobe Flash、Apple QuickTime 或 Microsoft Windows 媒体播放器等特殊的播放器。这意味着用户不必担心是否有最新的兼容插件(或任何播放器插件)。他们只需打开自己喜欢的浏览器并聆听能发出声音的任何内容,如音乐、有声读物、FX 声音效果或朋友和家人录制的消息。
业余草
2019/01/21
5.2K0
HTML5环形音乐播放器
一套简约漂亮的响应式博客园主题皮肤分享给你们
  最近在自己博客园逛的时候,总会有一个感觉,真是太丑了,然而又觉得自己暂时抽不出太多的时间来搭建自己的博客系统,上网一搜才发现,原来我们可以自定义博客的布局以及样式的,那我就在网上找到了一个哥们的自定义Hexo经典主题Ligt的CSS文件,然后根据自己的审美及需要来做改动后上传以此来使自己的博客看起来像是自己搭建的个人博客。因为我总觉得一个良好的界面才会给博友读下去的欲望,否则很恶心,连自己都这么觉得。下面我们就来分享这个替换步骤教程。
阿豪聊干货
2018/08/09
2.1K0
一套简约漂亮的响应式博客园主题皮肤分享给你们
Joe主题加大图
1.复制代码 2.修改index.php 3.修改post.php 4.增加css文件 5.引入css文件 6.站长总结
堡主
2023/03/04
6320
Joe主题加大图
7b2美化-首页添加导航区块
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
小狐狸说事
2022/11/16
8490
主题hondsome折腾,css修改
主题hondsome折腾,css修改 ps:我现在已经没有使用hondsome主题了,不过依旧保留在后台。感情颇深。 代码如下: 加入到自定义css 或者创建css文件,在footer引入即可 //首页头像自动旋转// .thumb-lg{ width:130px; } .avatar{ -webkit-transition: 0.4s; -webkit-transition: -webkit-transform 0.4s ease-out; transition: tra
乐心湖
2020/07/31
1.1K0
底部关于我们美化代码
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
小狐狸说事
2022/11/17
2.8K0
底部关于我们美化代码
分享一个自用emlog手机底部导航加样式代码
看到很多朋友都要这个手机端底部导航索性就分享了,这玩意其实我也不是不舍得发,是懒得而已 这玩意我都是扣别人的所以这个东西自己扣就行了,如果你不会扣那我赶紧我分享出来你也不会用。
用户8099761
2023/05/11
7580
7b2主题评论气泡
这个功能来自于https://github.com/515184405/barrage,版权归他所有。
小狐狸说事
2022/11/17
4140
7b2主题评论气泡
纯CSS3绘制的逼真,呆萌,超酷的CSS3动画纯CSS3人物行走动画 逼真炫酷CSS3动画纯CSS3绘制的小猫笑脸动画 超呆萌纯CSS3绘制可爱小男孩动画 超酷面部表情
纯CSS3人物行走动画 逼真炫酷CSS3动画 CSS3实在是太强大了,今天分享的CSS3动画非常神奇,它可以模拟人物行走,而且人物行走动画非常逼真。人物行走时的跨步动画时多张图片重叠实现的。有了这个
wblearn
2018/08/27
1.7K0
纯CSS3绘制的逼真,呆萌,超酷的CSS3动画纯CSS3人物行走动画 逼真炫酷CSS3动画纯CSS3绘制的小猫笑脸动画 超呆萌纯CSS3绘制可爱小男孩动画 超酷面部表情
Butterfly主题美化
在butterfly/source/css/创建一个universe.css文件。
ymktchic
2022/01/18
1.6K0
Butterfly主题美化
Typecho美化主题教程
但是现在我们会发现,整个网站的标签都变成了这样,那我们如何只让他在文章中出现呢? 在第一个代码块ol前面加上#post即可使用了。
回忆大大
2021/08/09
1.5K0
推荐阅读
相关推荐
7b2美化-列表文章上浮效果
更多 >
LV.0
这个人很懒,什么都没有留下~
目录
  • 一、前言
  • 二、介绍
    • 1. 平台介绍
    • 2. 特性
    • 3. 环境支持
  • 三、运行mongo
    • 0. 创建网络
    • 1. 创建挂载文件
    • 2. 运行mongo
    • 3. 进入容器初始化数据库
  • 四、运行yapi
    • 1. 搭建挂载配置文件
    • 2. 初始化数据库表
    • 3. 测试连接mongo
    • 4. 运行yapi
    • 5. 测试使用
    • 6. 新建项目
    • 7. 获取token
  • 五、Idea中使用
    • 1. 下载插件
    • 2. 配置插件
    • 3. 测试上传
  • 六、在线请求使用
    • 1. 配置地址
    • 2. 配置地址
    • 3. 安装cross-request 插件
    • 4. 点击发送
  • 七、总结
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档