关于前端:YApi手摸手带你在Win10环境下安装YApi可视化接口管理平台

前言

作为一名前端开发，你在开发过程中，频繁书写 mockjs 感到困惑吗？Network 不显示 mockjs 返回的数据感到发愁吗？写了半天数据返回谬误时一脸问号吗？退出蓝天打算吧，让你一夜暴富，成为第二个码云，第二个 xxx，咳咳 …

道歉，方才打错字了，作为一名前端开发工程师，已经在我的项目开发过程中，都会有那么一段时间，用在书写 mock 数据上，上面这波操作，会让你甩开懊恼的本地 mock，不必在本地创立 js 文件模仿数据，你没看错，就是这么骚气

本文章次要针对 win10 部署 Yapi 进行介绍，Linux 出门左转，大致相同

API 治理平台

市面上开源的接口治理平台，频频公布，上面来简略看一下

1. EsayMock：刚入行的时候用过，不过服务器总是爆炸，起初就没用了
2. Yapi：我司目前采纳的接口模仿治理计划

另外两款用的不多，不做太多评论了，

Yapi

YApi 是高效、易用、功能强大的 api 治理平台，旨在为开发、产品、测试人员提供更优雅的接口治理服务。能够帮忙开发者轻松创立、公布、保护 API，YApi 还为用户提供了优良的交互体验，

开发人员只需利用平台提供的接口数据写入工具以及简略的点击操作就能够实现接口的治理。

一、环境要求

• nodejs（7.6+)
• mongodb（2.6+）
• git

二、装置 Git

1. Git 官网下载：https://git-scm.com/downloads
2. 间接下一步，下一步装置。

三、装置 Node

1. 官网下载：https://nodejs.org/en/download/
2. 下一步下一步下一步装置
3. 装置胜利后，可查看 node 版本

node -v
或
node --version

1. 查看 npm 版本

npm -v

四、装置 MongoDB

1. 下载 MongoDB

• 官网下载：https://www.mongodb.com/try/d…
• 官网下载太慢的话，能够应用上面的链接：http://dl.mongodb.org/dl/win3…

1. 抉择 Custom，一路 next

1. 下一步装置 “install mongoDB compass” 不勾选，否则可能要很长时间都始终在执行装置，MongoDB Compass 是一个图形界面管理工具，咱们能够在前面本人到官网下载安装，下载地址：https://www.mongodb.com/downl…
2. 配置 MongoDB，进入 MongoDB 装置目录，进入 bin 文件夹，复制文件夹门路，关上控制面板，抉择“零碎与平安”——“零碎”——“高级零碎设置”，点击环境变量 Path，将复制的门路新建在环境变量外面。

• MongoDB 的装置门路个别在：C:Program FilesMongoDBServer4.2bin

1. 在装置目录下 data 创立一个 db 目录，作为装置目录 data 的备用目录，能够应用 –dbpath”” 装置目录 datadb” 显式指定该目录为存储地位，来启动 MongoDB，如：

1 cd C:\Program Files\MongoDB\Server\4.2
2 mongod.exe --dbpath "C:\Program Files\MongoDB\Server\4.2\data\db"

1. 此时 MongoDB 曾经开启，浏览器拜访 http://localhost:27017/，页面上会呈现如下图所示。阐明 MongoDB 曾经启动了，且默认端口（27017）没有被占用。

装置 Yapi

1. 前提装置好 Node、Git、MongoDB
2. 采纳形式一：可视化部署 [举荐]
3. 在 D 盘下创立 yapi 空文件夹，利用 git 工具进行开启 yapi 服务。在文件夹空白处鼠标右击，会呈现“Git Bash Here”，点击。

1. 装置 yapi，命令如下所示。

1 npm install -g yapi-cli --registry https://registry.npm.taobao.org
2 yapi server

1. 胜利装置后，会呈现如下截图。

1. 间接依照提醒要求，关上网站 http://localhost:9090/，填写公司名称。

1. 点击开始部署，部署实现并胜利后，可通过底部提醒启动服务器。

1. 咱们回到 Git Hash 终端，最终底部也有雷同的提醒。如下图所示。

1. 间接输出“node vendors/server/app.js 的命令，可看出有 throw 异样报错。报错如下图所示

1. 关上创立我的项目的文件 D：yapi，可发现文件夹下多出一个 my-yapi 的文件夹。在 my-yapi 上面才是 YApi 我的项目的文件。如下图所示。

咱们可得悉，是咱们运行的文件目录不对，应从新定位文件目录。咱们须要定位目录至 my-yapi 文件夹。如下图所示。

这样，咱们就能够间接拜访 http://127.0.0.1:3000/。默认帐号：admin@admin.com, 默认明码：ymfe.org。如下图所示。

Yapi 后盾运行治理

• 利用 PM2 治理 YApi 后盾运行

PM2 是 node 过程管理工具，能够利用它来简化很多 node 利用治理的繁琐工作，如性能监控、主动重启、负载平衡等，而且应用非常简单。

1. 先全局装置 PM2。关上 CMD 输出全局装置命令。如下所示。

 npm install -g pm2

间接装置可看出常常装置失败。咱们可利用国内镜像来装置，如下图所示

npm install -g pm2 --registry https://registry.npm.taobao.org

装置胜利，如下图所示。

1. 后盾启动或敞开

我的 YApi 的装置目录在 D:yapimy-yapi, 启动执行：

pm2 start D:\yapi\my-yapi\vendors\server\app.js

启动执行胜利，如下所示

敞开执行：

pm2 stop D:\yapi\my-yapi\vendors\server\app.js

敞开执行胜利，如下所示

参考

1. Yapi 接口治理平台
2. PM2 实用入门指南
3. MongoDB 装置与配置

注：笔者最近发现了一款客户端接口管理工具，不过临时不反对本地部署，笔者也只是在本人电脑上用一下，好用的话，当前会写文章具体介绍