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；

二、对自动化测试支持不够；

三、使用过程当中卡顿较多；