摘要：而則是主要用于接口緩存的一款。初始化完成后，將在當(dāng)前目錄生成文件。其它未在規(guī)則中的請求，將直接代理并緩存下來，而不進(jìn)行轉(zhuǎn)發(fā)。每條記錄包含和兩個屬性，并且也是隨機自動生成的。

搜到這篇文章之前，相信你已對Mock Server及mock.js有一定的了解。簡單概括，Mock Server即模擬服務(wù)器，用于模擬后端api服務(wù)。mock.js是國內(nèi)的高云開發(fā)的一款json數(shù)據(jù)生成器，主要用于模擬后端api數(shù)據(jù)。而justreq則是主要用于http(s)接口緩存的一款Mock Server。

那么，我們要用Mock Server解決什么呢？在前端開發(fā)過程中，相信大家都有遇到過以下一些問題：

后端api接口還沒開發(fā)完，前端只能無盡的等待...

開發(fā)過程中，接口服務(wù)器宕機了，也只能無盡的等待...

網(wǎng)絡(luò)奇差，一半時間都在等待接口響應(yīng)了

自己模擬數(shù)據(jù)，但部署時還得逐個去js文件清理

邏輯太復(fù)雜，模擬數(shù)據(jù)雜亂，無法管理

現(xiàn)有Mock Server或多或少都需要往項目里植入一些代碼

并不是所有接口都需要mock，后端已完成的接口希望直接調(diào)用

模擬的數(shù)據(jù)不夠真實、不夠靈活

只要遇到上面任何一項，那么接下來的方案或許就是你想要的。

首先，justreq就是為解決以上問題而生的，可以參看我上一篇文章《 justreq 永不離線的測試接口服務(wù)，擺脫測試接口離線之痛》，也可以去github查看最新文檔。它首先解決的就是接口的緩存，定時更新機制讓你開發(fā)過程中不至于請求到過舊數(shù)據(jù)，又能不依賴網(wǎng)絡(luò)，實現(xiàn)即使離線也能毫秒級響應(yīng)。然后對于部分后端沒開發(fā)完成的接口，可以自行mock，并且不需要往項目中植入任何代碼。

然后，前兩天無意中發(fā)現(xiàn)了mock.js這一神器，我又想到，如果把兩者結(jié)合起來，那么問題8還可以解決得更優(yōu)雅。幸運的是，justreq一開始的設(shè)計理念就是支持調(diào)用一切node模塊，所以我們可以很容易的把justreq和mock.js組合起來。

好了，廢話完了，接下來詳細(xì)說下組合方法。已迫不及待的話，我這里已經(jīng)為大家準(zhǔn)備好一份樣例，可下載親自運行調(diào)試。以下講解的用到的例子也來自該樣例。
https://github.com/vilien/justreq-demo/releases/download/v0.1.1/justreq-demo-v0.1.1.zip

首先下載安裝Node.js，然后運行以下命令安裝justreq命令行工具

npm install -g justreq-cli

進(jìn)入自己項目目錄運行以下命令安裝justreq主程序（當(dāng)然也可以專門另設(shè)目錄安裝，看個人喜好）

npm install justreq

最后，安裝mock.js

npm install mockjs

運行以下命令初始化justreq

justreq init

除了第一個問號The remote"s hostname of you wanna proxy?必須填入接口服務(wù)器主機名（如：192.168.50.50），其它問號一路回車使用默認(rèn)即可。

初始化完成后，將在當(dāng)前目錄生成“.justreq”文件。現(xiàn)在打開它，并在rules里添加以下一條規(guī)則：

{
  ...
  "rules": [
    {
      "href": "getUsersList.do",
      "subs": "getUsersList.jrs"
    }
  ]
}

稍微解釋一下，這一條規(guī)則是告訴justreq：當(dāng)請求地址為getUsersList.do的時候，轉(zhuǎn)發(fā)至getUsersList.jrs。其它未在規(guī)則中的請求，justreq將直接代理并緩存下來，而不進(jìn)行轉(zhuǎn)發(fā)。
而我們的getUsersList.jrs腳本，即是用來mock接口的。

在當(dāng)前目錄找到.jr目錄，在里面創(chuàng)建并打開getUsersList.jrs（注意，.jr前面有個“.”）。編寫以下代碼：

// .jr/getUsersList.jrs
const Mock = require("mockjs");

let data = Mock.mock({
  // 屬性 list 的值是一個數(shù)組，其中含有 6 到 20 個元素
  "list|6-20": [{
      // 屬性 id 是一個自增數(shù)，起始值為 80001，每次增 6
      "id|+6": 80001,
      "name": "@name"
  }]
});

end(data);

至此，我們的第一個mock腳本就完成了。該腳本將會輸出一個列表list，這個list隨機產(chǎn)生6到20條用戶記錄。每條記錄包含id和name兩個屬性，并且name也是隨機自動生成的。是不是好神奇？

更多的mock.js用法可參看官方示例

至此，我們已經(jīng)完成了所有的工作，下面一起來體驗一下吧。

首先，我們在當(dāng)前目錄運行以下命令啟動justreq：

justreq start

接著，我們寫一個html文件來測試下mock效果

保存為mock-demo.html，并雙擊打開，然后點擊“Reload User List”按鈕，將看到如下圖的結(jié)果。

可多點幾次查看效果^_^

對于大多數(shù)的前端開發(fā)情況，以上這些已經(jīng)足夠應(yīng)付了。但也許你還會需要定制更高級、仿真度更高的模擬接口，又或許你僅僅只需要調(diào)用一些固定格式的文件等等等等。這些需求，justreq都有考慮到。你也可以把justreq共享到局域網(wǎng)，讓其它前端小伙伴跟你一道共用一套mock腳本。甚至用justreq來做一些簡單的站點服務(wù)，也是可以的。

更多高級玩法可查看justreq文檔