2023-09-15 推荐下面这个链接阅读,体验会好点
我记得之前的格式不是这样的哈,😭😭, 最近太忙了, 有空了我再来把这个坑填上,对不住各位看官老爷了。
效果
2022-09-22更新 yapi应该是不维护了
偶然回想起这个yapi,然后去github里面看看他的动态,却发现最后一次提交就来是2021年10月,感觉是作者没精力维护了,应该是放弃了,issue也是一千多没解决,感觉凉凉了,还爆出了安全问题,哈哈,果然为爱发点不长远
希望你可以活过来把😭😭😭
替换方案
我还特意发了个邮件去问了大佬,有幸大佬也回复了我,并推荐了新的替换方案:
- 推荐用runapi 和showdoc组合使用,可以替代yapi runapi/30291
- 虽然yapi不维护了,但是还是感谢他为我们提供了一个很好用的工具,祝他越来越好~
前言
- 以前还是根据后台的swagger手写mock数据,被自己蠢哭~,最近有点时间了, 就研究了下能不能动态的去弄这些mock数据,之后就找到了yapi,感觉大佬就是牛逼哈
- 官网说有docker部署的方式,我试了, 一直不行,所以就用了比较蠢的方法,手动安装各种环境 😃
- 差不多就这样了,日常bb结束
- yapi官网
感谢去哪儿前端团队的开源,大佬
大纲
- 内网部署
yapi 和swagger 的结合使用
内网部署
- 官网说明
Windows 手动安装 MongoDB
- 环境要求
- 环境要求
打开安装包开搞😃
* 
* 选择安装位置
* 
* 
* 
* 耐心等待,中途会要个权限,给他就是了
* 安装完毕
* 创建数据库和账户,创建一个新的数据库给yapi部署使用(其实可以不用做这一步,我在linux部署的时候就没搞,照样跑得起来 哈哈)
* 点开这个文件
* 查看所有的数据库
* show dbs
* use \[数据库名称\] 有就直接切换,没有就给你创建一个
* 查看当前数据库
* db
* 删除某个数据库
* use \[要删除的数据库\]
* db.dropDatabase()
* 创建一个数据库管理员账户
* db.createUser({user: "admin",pwd: "123456",roles: \[ { role: "userAdminAnyDatabase", db: "admin"}\]})
* 数据库工具:
* [Navicat Premium 15 永久破解激活](http://my.oschina.net/u/4405407/blog/4271799#comments)
* Linux环境搭建
* 环境准备
* 查看系统命令:cat /proc/version
* 我本机的版本:Linux version 2.6.32-696.el6.x86\_64 (mockbuild@[c1bm.rdu2.centos.org](http://c1bm.rdu2.centos.org/)) (gcc version 4.4.7 20120313 (Red Hat 4.4.7-18) (GCC) ) #1 SMP Tue Mar 21 19:29:05 UTC 2017
* 操作系统:centos 7
* nodejs>7.6
* mongodb>2.6
* git
* 安装nodejs
* 1\. 获取资源(部署nodejs尽可能选择偶数版本,因为偶数版本官方有较长的维护时间,故这次选择8.x。)随便装, 我装的是10的版本
* curl -sL [https://rpm.nodesource.com/setup\_8.x](https://rpm.nodesource.com/setup_8.x) | bash -
* 2. 安装
* yum install -y nodejs
* 3. 查看版本
* node -v
* 4. 查看npm版本
* npm -v
* 安装mongodb
* 1. 更新yum源,非必须但是更新一下无害
* yum -y update
* 2. 添加mongodb源文件,在/etc/yum.repos.d 创建一个 mongodb-org.repo 文件
* touch /etc/yum.repos.d/mongodb-org.repo
* 3. 编辑mongodb-org.repo文件
* vim /etc/yum.repos.d/mongodb-org.repo
* 4. 添加文件内容
* 要这种形式的,幕布不支持Markdown 恶心哦
* \[mongodb\-org\]
* name\=MongoDB Repository
* baseurl\=[http://mirrors.aliyun.com/mongodb/yum/redhat/7Server/mongodb-org/3.2/x86\_64/](http://mirrors.aliyun.com/mongodb/yum/redhat/7Server/mongodb-org/3.2/x86_64/)
* gpgcheck=0
* enabled=1
* 如果你也是在第四步卡了,无法继续安装,[可以参考](http://stackoverflow.com/questions/34725574/yum-install-mongodb-3-2-fails)
* [https://stackoverflow.com/questions/34725574/yum-install-mongodb-3-2-fails](https://stackoverflow.com/questions/34725574/yum-install-mongodb-3-2-fails) 我用了下图的方式 搞定
* 1\. 更改源
* \[mongodb\-org\-3.6\]
* name\=MongoDB Repository
* baseurl\=[https://repo.mongodb.org/yum/redhat/$releasever/mongodb-org/3.6/x86\_64/](https://repo.mongodb.org/yum/redhat/$releasever/mongodb-org/3.6/x86_64/)
* gpgcheck=1
* enabled=1
* gpgkey=[https://www.mongodb.org/static/pgp/server-3.6.asc](https://www.mongodb.org/static/pgp/server-3.6.asc)
* 2\. 重新安装
* sudo yum install \-y mongodb\-org
* [Error starting mongod. /var/run/mongodb/mongod.pid exists解决方案.](http://www.cnblogs.com/zmoumou/p/10303792.html)
* 5. 安装mongodb
* yum install -y mongodb-org
* 6. 启动mongodb
* service mongod start
* 7. 设置开机启动
* chkconfig mongod on
* 8. 查找mongod.conf文件
* ps -ax | grep mongod
* [查询mongodb的数据库存放路径](http://blog.csdn.net/heiyouhei123/article/details/82660102)
* 9. 配置远程访问
* 主要是为了方便直接使用数据库工具连接数据库
* vim/etc/mongod.conf
* 重启mongod
* service mongod restart
* 安装git
* 官方推荐,在内网部署的时候安装git,可以根据自己所需安装
* yum -y install git
* 搭建YApi环境
* 1. 准备环境搭建完成后,开始搭建YApi,安装命令
* npm install \-g yapi\-cli \--registry [https://registry.npm.taobao.org](https://registry.npm.taobao.org/)
* yapi server
* 实例截图:
* 
* 2. 执行 yapi server 启动可视化部署程序,浏览器打开提示窗口上的地址,非本地服务器,将[0.0.0.0](http://0.0.0.0/)替换指定的域名或IP,进入部署页面。例如:[http://127.0.0.1:9090/](http://127.0.0.1:9090/)
* 
* 看到这个提示说明已经部署成功了, 9090端口可以关闭了
* 提示说让我们切换到部署路径,执行相关命令~
* 执行相关命令,就可以用了
* node vendors/server/app.js
* 访问:[http://127.0.0.1:3000/](http://127.0.0.1:3000/)
* 终于出来了, 美滋滋~
* yapi服务管理
* 利用pm2方便服务管理维护
* npm install pm2 -g //安装pm2
* cd {项目目录}
* pm2 start "vendors/server/app.js" --name yapi //pm2管理yapi服务
* pm2 info yapi //查看服务信息
* pm2 stop yapi //停止服务
* pm2 restart yapi //重启服务
* yapi 升级管理
* 升级
* 升级项目版本是非常容易的,并且不会影响已有的项目数据,只会同步 vendors 目录下的源码文件
* cd {项目目录}
* yapi ls //查看版本号列表
* yapi update //更新到最新版本
* yapi update -v {Version} //更新到指定版本
yapi 和swagger 的结合使用
* 创建一个项目项目
* 注册一个帐号
* 创建一个项目
* 
* swagger的设置
* 切换到swagger的同步设置
* 找到后台的地址: 输入上面,然后点保存,之后就耐心等待2分钟之后,yapi会自动同步
* 如果出现这种错误,不用理会,多点两下 他就会好了
* 成功触发yapi的同步任务
* 成功同步过来,如果同步的不理想, 就把swagger的同步设置改成全部覆盖就好了
* 集成到业务系统
* 设置请求上下文
* 找到上下文,配置mock数据, 把这个地址,放到反向代理的设置里面去,就会有数据了
* 
* 这些值就都是yapi 帮我们mock的数据了,开心~~再也不用写mock数据了,以前自己好蠢 😃
* 接口页面相关说明
* 
* 请求配置,自定义请求头和返回值
* 官方的说明
* [https://hellosean1025.github.io/yapi/documents/project.html#%E8%AF%B7%E6%B1%82%E9%85%8D%E7%BD%AE](https://hellosean1025.github.io/yapi/documents/project.html#%E8%AF%B7%E6%B1%82%E9%85%8D%E7%BD%AE)
* 
* 你可以在这里设置1.请求头 2.根据不同状态,返回不同的数据格式等
* 设置请求头
* context.requestHeader.ergouzi=66666
* 设置返回值
* 官网说明
* [https://hellosean1025.github.io/yapi/documents/adv\_mock.html#%E8%87%AA%E5%AE%9A%E4%B9%89-mock-%E8%84%9A%E6%9C%AC](https://hellosean1025.github.io/yapi/documents/adv_mock.html#%E8%87%AA%E5%AE%9A%E4%B9%89-mock-%E8%84%9A%E6%9C%AC)
* 
* 
* 实际使用:默认所有接口都是ok的,我们和后台约定返回的数据格式是 {data:xxx,resultCode:xxx} 所有的数据都放在data 里面,resultCode 为1 表示请求成功
* mockJson.resultCode=1
* 设置生效, 之前的随机数变成了1 搞定收摊
*
* 接口 --- 编辑页面介绍
* 
* 例子1:我们发现我们的年龄字段默认随机是一个负数,其实和真实数据相差还是很大的,我们真实的世界里面能活到100岁就很牛逼了,看看怎么设置
* 
* 
* 可以直接点预览看效果,如下想再业务系统里面看效果,记得点保存按钮,不然不生效!
* 例子2: auditStatus 表示审核状态,审核状态会有很多个, 我们想看多个审核状态怎么搞呢
* 
* 设置
* 效果
* 他会在我们刚才的枚举里面,随机取一个
* 接口 --- 运行页面介绍
* cross-request 插件
* [怎么安装请访问](https://juejin.im/post/6844903795743260685)
* [cross-request 被官方下架后的插件安装方法](http://github.com/YMFE/yapi/issues/1603)
* 
* 添加环境
* 
* 添加你需要的环境并保存,之后就随便调用了, cross-request 会帮你处理跨域,作者说只有https的在network才看不到请求, 我http的也看不到,不知道什么鬼
结束语
- 本文如有错误,欢迎指正,非常感谢
* 觉得有用的老铁,点个双击,小红心走一波
* 欢迎灌水,来呀,互相伤害哈 o(∩\_∩)o 哈哈
参考资料
* [从零开始搭建Yapi环境](http://www.jianshu.com/p/5bda5556c149)
* [查看Linux内核版本的命令](http://blog.csdn.net/earlyup/article/details/2784707)
* [查询mongodb的数据库存放路径](http://blog.csdn.net/heiyouhei123/article/details/82660102)
* [mongodb启动报错如何处理](http://www.cnblogs.com/zmoumou/p/10303792.html)
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。