2023-09-15 推荐下面这个链接阅读,体验会好点

我记得之前的格式不是这样的哈,😭😭, 最近太忙了, 有空了我再来把这个坑填上,对不住各位看官老爷了。

效果

image.png

2022-09-22更新 yapi应该是不维护了

偶然回想起这个yapi,然后去github里面看看他的动态,却发现最后一次提交就来是2021年10月,感觉是作者没精力维护了,应该是放弃了,issue也是一千多没解决,感觉凉凉了,还爆出了安全问题,哈哈,果然为爱发点不长远

希望你可以活过来把😭😭😭

希望你可以活过来把

  • yapi安全漏洞问题

    替换方案

    我还特意发了个邮件去问了大佬,有幸大佬也回复了我,并推荐了新的替换方案:
  • 推荐用runapi 和showdoc组合使用,可以替代yapi runapi/30291
  • 虽然yapi不维护了,但是还是感谢他为我们提供了一个很好用的工具,祝他越来越好~

前言

  • 以前还是根据后台的swagger手写mock数据,被自己蠢哭~,最近有点时间了, 就研究了下能不能动态的去弄这些mock数据,之后就找到了yapi,感觉大佬就是牛逼哈
  • 官网说有docker部署的方式,我试了, 一直不行,所以就用了比较蠢的方法,手动安装各种环境 😃
  • 差不多就这样了,日常bb结束
  • yapi官网
  • 感谢去哪儿前端团队的开源,大佬

大纲

  • 内网部署
  • yapi 和swagger 的结合使用

  • 内网部署

  • 打开安装包开搞😃

    
    *   ![](https://api2.mubu.com/v3/document_image/114df668-cb0a-4fb6-9dac-4e9b790290dd-2331693.jpg)  
        
    
    *   选择安装位置![](https://api2.mubu.com/v3/document_image/63991b08-af55-4784-9a4a-981f11a35aa5-2331693.jpg)  
        
    
    *   ![](https://api2.mubu.com/v3/document_image/7657cf4d-7054-451f-81ed-b3272c34539a-2331693.jpg)  
        
    
    *   ![](https://api2.mubu.com/v3/document_image/b94422ab-dced-4d78-a989-bb0f83c39ee2-2331693.jpg)  
        
    
    *   ![](https://api2.mubu.com/v3/document_image/cbf6cdb6-5901-4c72-8e1c-9680f485f0ed-2331693.jpg)  
        
    
    *   耐心等待,中途会要个权限,给他就是了![](https://api2.mubu.com/v3/document_image/ffe49ed9-c418-4e6c-b241-0e92e4a8590f-2331693.jpg)  
        
    
    *   安装完毕![](https://api2.mubu.com/v3/document_image/02cb0495-dd44-4569-903d-fcbfcf29ab28-2331693.jpg)  
        

    *   创建数据库和账户,创建一个新的数据库给yapi部署使用(其实可以不用做这一步,我在linux部署的时候就没搞,照样跑得起来 哈哈)  
        
        *   点开这个文件![](https://api2.mubu.com/v3/document_image/18e7cd93-9bc5-42a5-bb37-b6f993c98f1d-2331693.jpg)  
            
        
        *   查看所有的数据库  
            *   show dbs![](https://api2.mubu.com/v3/document_image/061b8030-251a-471e-b642-cffb25af6199-2331693.jpg)  
                
        
        *   use \[数据库名称\] 有就直接切换,没有就给你创建一个![](https://api2.mubu.com/v3/document_image/fcf64aed-26b1-47fc-bc6e-de27ef5d07b4-2331693.jpg)  
            
        
        *   查看当前数据库  
            *   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 恶心哦![](https://api2.mubu.com/v3/document_image/e28e12df-8e3a-4513-b442-fc40dcdccb34-2331693.jpg)  
                
            
            *   \[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) 我用了下图的方式 搞定![](https://api2.mubu.com/v3/document_image/feb04702-227e-43ea-98a5-299c59e21c9f-2331693.jpg)  
                
                *   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)![](https://api2.mubu.com/v3/document_image/97dbfb4d-2b28-427b-9339-e7fd169c2d3f-2331693.jpg)  
                
        
        *   5. 安装mongodb  
            *   yum install -y mongodb-org  
                
        
        *   6. 启动mongodb  
            *   service mongod start  
                
        
        *   7. 设置开机启动  
            *   chkconfig mongod on  
                
        
        *   8. 查找mongod.conf文件  
            
            *   ps -ax | grep mongod![](https://api2.mubu.com/v3/document_image/33580516-2c92-4bf7-9b93-7c1ae97d06a0-2331693.jpg)  
                
            
            *   [查询mongodb的数据库存放路径](http://blog.csdn.net/heiyouhei123/article/details/82660102)  
                
        
        *   9. 配置远程访问  
            
            *   主要是为了方便直接使用数据库工具连接数据库  
                
            
            *   vim/etc/mongod.conf![](https://api2.mubu.com/v3/document_image/4dc573f0-a4f6-487b-8330-24f54921792b-2331693.jpg)  
                
            
            *   重启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  
            
        
        *   实例截图:  
            *   ![](https://api2.mubu.com/v3/document_image/d4fb3559-574f-47e7-afa5-57ba6acdf6c3-2331693.jpg)  
                
    
    *   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/)![](https://api2.mubu.com/v3/document_image/c4276e52-91ac-44f0-8123-a62f4de6a595-2331693.jpg)  
        
    
    *   ![](https://api2.mubu.com/v3/document_image/c2110f7c-556f-46c7-b6e7-31bbac58194e-2331693.jpg)  
        
    
    *   看到这个提示说明已经部署成功了, 9090端口可以关闭了![](https://api2.mubu.com/v3/document_image/61258aa8-67aa-4780-9984-b4ac50360548-2331693.jpg)  
        
    
    *   提示说让我们切换到部署路径,执行相关命令~![](https://api2.mubu.com/v3/document_image/8ed5c038-a8a3-4cdb-8cec-6fc021a248d5-2331693.jpg)  
        
    
    *   执行相关命令,就可以用了![](https://api2.mubu.com/v3/document_image/ed4c6dfc-1471-496d-bec1-77d8fa4606d1-2331693.jpg)  
        
        *   node vendors/server/app.js  
            
        
        *   访问:[http://127.0.0.1:3000/](http://127.0.0.1:3000/)  
            
        
        *   终于出来了, 美滋滋~![](https://api2.mubu.com/v3/document_image/0a11148f-a49b-4248-bd81-50b4087b2c10-2331693.jpg)  
            

*   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} //更新到指定版本  
            

*   创建一个项目项目  
    
    *   注册一个帐号![](https://api2.mubu.com/v3/document_image/392d4ec1-e629-4a93-b3a4-0f885ef57708-2331693.jpg)  
        
    
    *   创建一个项目![](https://api2.mubu.com/v3/document_image/906d762a-2eb3-4d77-ae49-cd464de2ef73-2331693.jpg)  
        
    
    *   ![](https://api2.mubu.com/v3/document_image/ecba9b53-e0d3-422f-8ef8-b502b6de9f1a-2331693.jpg)  
        

*   swagger的设置  
    
    *   切换到swagger的同步设置![](https://api2.mubu.com/v3/document_image/400c7717-5f02-4741-a0cc-a1b1e116d209-2331693.jpg)  
        
    
    *   找到后台的地址: 输入上面,然后点保存,之后就耐心等待2分钟之后,yapi会自动同步![](https://api2.mubu.com/v3/document_image/3e634919-5495-408f-a75b-c56576214365-2331693.jpg)  
        
    
    *   如果出现这种错误,不用理会,多点两下 他就会好了![](https://api2.mubu.com/v3/document_image/276b6032-991f-40ba-a056-fff4ca2029a0-2331693.jpg)  
        
    
    *   成功触发yapi的同步任务![](https://api2.mubu.com/v3/document_image/79479d3a-4dd5-400c-93b9-6141db25f3b1-2331693.jpg)  
        
    
    *   成功同步过来,如果同步的不理想, 就把swagger的同步设置改成全部覆盖就好了![](https://api2.mubu.com/v3/document_image/5b6d760e-ccbd-4b75-a542-61cf3c3b8e85-2331693.jpg)  
        

*   集成到业务系统  
    
    *   设置请求上下文  
        
        *   找到上下文,配置mock数据, 把这个地址,放到反向代理的设置里面去,就会有数据了  
            
        
        *   ![](https://api2.mubu.com/v3/document_image/d49c563e-c000-43e1-8626-cbaed0d063f5-2331693.jpg)  
            
        
        *   这些值就都是yapi 帮我们mock的数据了,开心~~再也不用写mock数据了,以前自己好蠢 😃![](https://api2.mubu.com/v3/document_image/4e8a40a4-951a-490d-aa4c-2e1aad20a052-2331693.jpg)  
            
    
    *   接口页面相关说明  
        *   ![](https://api2.mubu.com/v3/document_image/6616cae1-92cd-4996-abef-0b94c2b495b6-2331693.jpg)  
            
    
    *   请求配置,自定义请求头和返回值  
        
        *   官方的说明  
            
            *   [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)![](https://api2.mubu.com/v3/document_image/3a1f46ef-a3e0-469e-b90b-d188b2ae43e1-2331693.jpg)  
                
            
            *   ![](https://api2.mubu.com/v3/document_image/b472a442-f04e-4044-9ef2-ce3ec3eddec9-2331693.jpg)  
                
        
        *   你可以在这里设置1.请求头 2.根据不同状态,返回不同的数据格式等![](https://api2.mubu.com/v3/document_image/af4c8d88-ea59-4593-875f-578ae69e391a-2331693.jpg)  
            
        
        *   设置请求头  
            *   context.requestHeader.ergouzi=66666![](https://api2.mubu.com/v3/document_image/ed466246-cdf7-43b2-80dc-5db38b4f6756-2331693.jpg)  
                
        
        *   设置返回值  
            
            *   官网说明  
                
                *   [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)![](https://api2.mubu.com/v3/document_image/dad4cf1c-43d3-4f56-9e80-220fc28fc87b-2331693.jpg)  
                    
                
                *   ![](https://api2.mubu.com/v3/document_image/ffbc5106-7c24-459b-be69-3f1dc2356558-2331693.jpg)  
                    
                
                *   ![](https://api2.mubu.com/v3/document_image/7c3521dc-c0ab-4599-8434-99f7895841b7-2331693.jpg)  
                    
            
            *   实际使用:默认所有接口都是ok的,我们和后台约定返回的数据格式是 {data:xxx,resultCode:xxx} 所有的数据都放在data 里面,resultCode 为1 表示请求成功  
                
                *   mockJson.resultCode=1![](https://api2.mubu.com/v3/document_image/3571804f-53a0-4666-b239-688da33efd1a-2331693.jpg)  
                    
                
                *   设置生效, 之前的随机数变成了1 搞定收摊![](https://api2.mubu.com/v3/document_image/8bcaab23-4c7e-4024-9beb-1a776ae91b3d-2331693.jpg)  
                    
            
            *     
                
    
    *   接口 --- 编辑页面介绍  
        
        *   ![](https://api2.mubu.com/v3/document_image/d0178853-2d59-4ac7-84dd-7b0cd36cca46-2331693.jpg)  
            
        
        *   例子1:我们发现我们的年龄字段默认随机是一个负数,其实和真实数据相差还是很大的,我们真实的世界里面能活到100岁就很牛逼了,看看怎么设置  
            
            *   ![](https://api2.mubu.com/v3/document_image/a197a54b-99cd-4a29-a005-f5f1cdcde108-2331693.jpg)  
                
            
            *   ![](https://api2.mubu.com/v3/document_image/a1c11c86-f393-4f3d-a1b1-c30ffe018be7-2331693.jpg)  
                
            
            *   可以直接点预览看效果,如下想再业务系统里面看效果,记得点保存按钮,不然不生效!![](https://api2.mubu.com/v3/document_image/470c0ef1-5c4d-4658-b787-27a3a3fce465-2331693.jpg)  
                
        
        *   例子2: auditStatus 表示审核状态,审核状态会有很多个, 我们想看多个审核状态怎么搞呢   
            
            *   ![](https://api2.mubu.com/v3/document_image/9920b004-7537-4933-9339-5a9012f8acbe-2331693.jpg)  
                
            
            *   设置![](https://api2.mubu.com/v3/document_image/7ae5fd0d-f9fd-4d8e-bdb8-107485276744-2331693.jpg)  
                
            
            *   效果![](https://api2.mubu.com/v3/document_image/7f382c6b-aebd-4ff4-aebc-702692656428-2331693.jpg)  
                
            
            *   他会在我们刚才的枚举里面,随机取一个![](https://api2.mubu.com/v3/document_image/53d12310-27fe-4c0f-9e10-5ad379f01a94-2331693.jpg)  
                
    
    *   接口 --- 运行页面介绍  
        
        *   cross-request 插件  
            
            *   [怎么安装请访问](https://juejin.im/post/6844903795743260685)   
                
            
            *   [cross-request 被官方下架后的插件安装方法](http://github.com/YMFE/yapi/issues/1603)  
                
        
        *   ![](https://api2.mubu.com/v3/document_image/a03d79aa-7339-45c1-868d-6afd10268c25-2331693.jpg)  
            
        
        *   添加环境  
            
            *   ![](https://api2.mubu.com/v3/document_image/43290ed2-dbed-4e98-b4f9-a32df4e6e816-2331693.jpg)  
                
            
            *   添加你需要的环境并保存,之后就随便调用了, cross-request 会帮你处理跨域,作者说只有https的在network才看不到请求, 我http的也看不到,不知道什么鬼![](https://api2.mubu.com/v3/document_image/523135b9-91a4-4c4f-bac7-cdee4e7196fa-2331693.jpg)  
                
  • 结束语

    • 本文如有错误,欢迎指正,非常感谢

*   觉得有用的老铁,点个双击,小红心走一波  
    

*   欢迎灌水,来呀,互相伤害哈 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)

qinyuanqiblog
20 声望3 粉丝

擅长摸鱼~