RAP 接口Mock示例

前后端分離式開發的思考

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

1、前端開發依賴於后端接口數據，需要與后端接口聯調才能獲得數據展示，從而拖慢了開發進度；

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

變量名	含義	類型	備注
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中已收錄的接口會入入白名單；

不足之處

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

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

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

3、使用過程中卡頓較多；