RAP 接口Mock示例

先後端分離式開發的思考

目前大部分公司都實行了先後端分離開發。然而在項目開發過程中，常常會遇到如下幾個尷尬的場景；

一、前端開發依賴於後端接口數據，須要與後端接口聯調才能得到數據展現，從而拖慢了開發進度；

二、沒有一個很好的結構化接口文檔管理工具，可以對項目中所用到的接口進行管理。如一個請求的地址、有幾個參數、參數名稱及類型含義等等。同時支持項目、歷史版本的切換。

變量名	含義	類型	備註
url	引用mockjs已生成的數值	string	@mock=http：//ex.com/@size/@background
text	隨機得到一段連續字符串	string	@mock=@word
size	圖片尺寸	string	@mock=@ad_size
data|1-5	構造一個數組，含有1-5個元素	array<object
cn|1-5	重複1-5個'漢字'	string	@mock=@漢字
date	隨機生成一段日期字符串，格式爲yyyy-MM-dd	string	@mock=@DATE
datetime	隨機生成一段時間字符串，默認根式爲yyyy-MM-dd HH:mm:ss	string	@mock=@DATETIME
dummyimage	符合對象屬性	object
background	隨機生成一個顏色做爲背景色	string	@mock=@COLOR
format|1	從數組中隨機挑選一個元素做爲屬性值	array<object>	@mock=png,git,jpg
email	隨機生成一個Email	string	@mock=@email
float|1.10	浮點數，整數部分爲1，小數部分保留10位	number

咱們來看下其返回的mock數據：

這樣就逐個對應起來了；前端能夠直接用mock出來的數據進行調試；

怎樣應用於實踐

RAP提供了Mock插件（暫時僅支持Kissy和jQuery），使用只須要一步。在你的前端代碼中增長以下一行，

http://{{domainName}}/rap.plugin.js?projectId={{projectId}}&mode={{mode}}

RAP中經過設置白名單、黑名單模式（即mode參數）來限定對哪些接口作mock服務，默認RAP中已收錄的接口會入入白名單；

不足之處

固然是用過程當中也有一些不足之處：

一、插件目前僅支持Kissy和jQuery；

二、對自動化測試支持不夠；

三、使用過程當中卡頓較多；