在前端开发中，我们常常需要使用接口进行数据交互。而在开发的初期，后端可能尚未开发出相应的接口。这时，我们就需要使用一些 mock server 来模拟接口数据，以便于前端进行开发调试。mock-api-server-cli 就是一个非常方便的 mock server 工具。本篇文章将为你详细介绍如何使用该工具。
安装
使用 npm 进行安装：
npm install -g mock-api-server-cli
使用
安装完成后，进入你的项目目录，执行以下命令：
mock-api-server-cli init
这个命令将会在当前目录生成 mock 目录以及 mock/server.js 文件，这个 server.js 文件就是你的 mock server 入口文件。你可以在这个文件中定义你的接口响应数据。比如：
-- -------------------- ---- -------
-- --------------
-------------- - -
---- ----------- -
--- --
--------- --------
--
----- ------------ -
-------- -----
------ ---------
-
--以上代码就定义了两个接口，一个是 GET 请求 /api/user 路径返回的数据，另一个是 POST 请求 /api/login 路径返回的数据。其中，路径和请求方法的组合就是接口的唯一标识，因此在这个对象中需要一一对应地进行定义。
接着，在命令行中执行以下命令：
mock-api-server-cli start
这个命令将会启动你的 mock server，你可以在浏览器或者你的前端代码中通过 http://localhost:3000 地址进行访问。比如前面提到的 /api/user 接口，你可以在浏览器中输入 http://localhost:3000/api/user，就可以得到如下响应：
{"id":1,"username":"myname"}配置文件
我们可以通过配置文件来进行更加详细的配置。在项目根目录中新建一个名为 mock.config.js 的文件，并在其中定义你的配置：
// mock.config.js
module.exports = {
port: 8080,
delay: 500,
dataPath: 'data'
};其中 port 是 mock server 的端口号，delay 是响应数据的延迟时间，dataPath 是存放数据文件的目录（该目录下的文件可以被直接访问作为接口的响应）。
使用技巧
模拟不同状态的响应
我们可以使用 http 状态码来模拟不同的请求状态。例如：
module.exports = {
'GET /api/user': {
id: 1,
username: 'myname'
},
'GET /api/user/not-found': 404
};上面的代码中，当请求 /api/user/not-found 时，mock server 会返回 http 状态码为 404 的响应。
随机生成数据
mockjs 是一个非常好用的随机数据生成工具库。如果你需要响应数据中有一些随机数据，可以使用它来生成。首先安装 mockjs：
npm install mockjs --save-dev
然后在你的接口响应数据中使用 mockjs 的语法：
-- -------------------- ---- -------
-- --------------
----- ---- - ------------------
-------------- - -
---- ----------- -
--- -------------------
--------- -------------------
------ -------------------
-
--这样，每次访问 /api/user 接口时，都会返回不同的随机数据。
总结
本文介绍了如何使用 mock-api-server-cli 进行 mock server 的搭建，并对其进行了一些使用技巧的分享。mock server 很大程度上能够提高我们的前端开发效率，因此建议使用 mock server 进行前端开发。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055bc181e8991b448d95a1