資訊專欄INFORMATION COLUMN
摘要：而則是主要用于接口緩存的一款。初始化完成后，將在當前目錄生成文件。其它未在規則中的請求，將直接代理并緩存下來，而不進行轉發。每條記錄包含和兩個屬性，并且也是隨機自動生成的。
概述
搜到這篇文章之前，相信你已對Mock Server及mock.js有一定的了解。簡單概括，Mock Server即模擬服務器，用于模擬后端api服務。mock.js是國內的高云開發的一款json數據生成器，主要用于模擬后端api數據。而justreq則是主要用于http(s)接口緩存的一款Mock Server。
開發現狀那么，我們要用Mock Server解決什么呢？在前端開發過程中，相信大家都有遇到過以下一些問題：
后端api接口還沒開發完，前端只能無盡的等待...
開發過程中，接口服務器宕機了，也只能無盡的等待...
網絡奇差，一半時間都在等待接口響應了
自己模擬數據，但部署時還得逐個去js文件清理
邏輯太復雜，模擬數據雜亂，無法管理
現有Mock Server或多或少都需要往項目里植入一些代碼
并不是所有接口都需要mock，后端已完成的接口希望直接調用
模擬的數據不夠真實、不夠靈活
解決方案只要遇到上面任何一項，那么接下來的方案或許就是你想要的。
首先，justreq就是為解決以上問題而生的，可以參看我上一篇文章《 justreq 永不離線的測試接口服務，擺脫測試接口離線之痛》，也可以去github查看最新文檔。它首先解決的就是接口的緩存，定時更新機制讓你開發過程中不至于請求到過舊數據，又能不依賴網絡，實現即使離線也能毫秒級響應。然后對于部分后端沒開發完成的接口，可以自行mock，并且不需要往項目中植入任何代碼。
然后，前兩天無意中發現了mock.js這一神器，我又想到，如果把兩者結合起來，那么問題8還可以解決得更優雅。幸運的是，justreq一開始的設計理念就是支持調用一切node模塊，所以我們可以很容易的把justreq和mock.js組合起來。
好了，廢話完了，接下來詳細說下組合方法。已迫不及待的話，我這里已經為大家準備好一份樣例，可下載親自運行調試。以下講解的用到的例子也來自該樣例。
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
進入自己項目目錄運行以下命令安裝justreq主程序（當然也可以專門另設目錄安裝，看個人喜好）
npm install justreq
最后，安裝mock.js
npm install mockjs步驟2 - 配置
運行以下命令初始化justreq
justreq init
除了第一個問號The remote"s hostname of you wanna proxy?必須填入接口服務器主機名（如：192.168.50.50），其它問號一路回車使用默認即可。
初始化完成后，將在當前目錄生成“.justreq”文件?，F在打開它，并在rules里添加以下一條規則：
{
...
"rules": [
{
"href": "getUsersList.do",
"subs": "getUsersList.jrs"
}
]
}
稍微解釋一下，這一條規則是告訴justreq：當請求地址為getUsersList.do的時候，轉發至getUsersList.jrs。其它未在規則中的請求，justreq將直接代理并緩存下來，而不進行轉發。
而我們的getUsersList.jrs腳本，即是用來mock接口的。
在當前目錄找到.jr目錄，在里面創建并打開getUsersList.jrs（注意，.jr前面有個“.”）。編寫以下代碼：
// .jr/getUsersList.jrs
const Mock = require("mockjs");
let data = Mock.mock({
// 屬性 list 的值是一個數組，其中含有 6 到 20 個元素
"list|6-20": [{
// 屬性 id 是一個自增數，起始值為 80001，每次增 6
"id|+6": 80001,
"name": "@name"
}]
});
end(data);
至此，我們的第一個mock腳本就完成了。該腳本將會輸出一個列表list，這個list隨機產生6到20條用戶記錄。每條記錄包含id和name兩個屬性，并且name也是隨機自動生成的。是不是好神奇？
更多的mock.js用法可參看官方示例
至此，我們已經完成了所有的工作，下面一起來體驗一下吧。
Mock初體驗首先，我們在當前目錄運行以下命令啟動justreq：
justreq start
接著，我們寫一個html文件來測試下mock效果
保存為mock-demo.html，并雙擊打開，然后點擊“Reload User List”按鈕，將看到如下圖的結果。
可多點幾次查看效果^_^
對于大多數的前端開發情況，以上這些已經足夠應付了。但也許你還會需要定制更高級、仿真度更高的模擬接口，又或許你僅僅只需要調用一些固定格式的文件等等等等。這些需求，justreq都有考慮到。你也可以把justreq共享到局域網，讓其它前端小伙伴跟你一道共用一套mock腳本。甚至用justreq來做一些簡單的站點服務，也是可以的。
更多高級玩法可查看justreq文檔
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/81884.html
摘要：背景隨著互聯網應用工程規模的日益復雜化和精細化，我們在開發一個標準應用的早已開始告別單干模式，為了提升開發效率，前后端分離的需求越來越被重視，前端負責展現交互邏輯，后端負責業務數據接口，基本上也成為了我們日常項目分工中的標配，但是前后端分離 背景 隨著互聯網應用工程規模的日益復雜化和精細化，我們在開發一個標準web應用的早已開始告別單干模式，為了提升開發效率，前后端分離的需求越來越被重...
摘要：前言最近一直在搗鼓畢設，準備做的是一個基于前后端開發的平臺，前期花了很多時間完成了功能模塊的交互。核心代碼就是這么一句。經過各種猜想和測試，發現是模擬有問題。其實用的最終核心思路還是一樣的。 前言 最近一直在搗鼓畢設，準備做的是一個基于前后端開發的Mock平臺，前期花了很多時間完成了功能模塊的交互。現在進度推到如何設計核心功能，也就是Mock數據的解析。 根據之前的需求設定加上一些思考...
摘要：前言最近一直在搗鼓畢設，準備做的是一個基于前后端開發的平臺，前期花了很多時間完成了功能模塊的交互。核心代碼就是這么一句。經過各種猜想和測試，發現是模擬有問題。其實用的最終核心思路還是一樣的。 前言 最近一直在搗鼓畢設，準備做的是一個基于前后端開發的Mock平臺，前期花了很多時間完成了功能模塊的交互。現在進度推到如何設計核心功能，也就是Mock數據的解析。 根據之前的需求設定加上一些思考...
閱讀 2157·2021-09-22 10:56
閱讀 1465·2021-09-07 10:11
閱讀 1800·2019-08-30 15:54
閱讀 2290·2019-08-30 15:44
閱讀 2306·2019-08-29 12:40
閱讀 3031·2019-08-28 18:25
閱讀 1735·2019-08-26 10:24
閱讀 3186·2019-08-23 18:39
