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