在很早以前公司里面就接入了rap在线管理接口文档平台，通过图形化书写接口文档，给前端同事使用。但是之前也仅仅是用于写接口文档，从来没有研究过它还有其他用途。最近与自己合作的一个前端同事说，你为啥不利用好rap来写接口文档，它会自动生成mock数据，我们就不用将rap默认生成的数据修改后，再本地测试一下。弄完之后再与你们联调。今儿就花了2个小时左右研究一下rap，顺藤摸瓜出来mock。下面简单介绍一下，mock以及如何在rap中使用mock，生成比较好的模拟数据，提高前后端协作效率。

mock.js1

mock.js随机生成数据，让前端开发人员在开发阶段时独立于后端，使用mockjs可以自测代码。

语法规范

  • 数据模板定义规范(DTD:Data Template Definition)
  • 数据占位符规范(DPD: Data Placeholder definition)

数据模板定义规范

格式

'name|rule':value (属性名|生成规则:属性值)，其中生成规则是可选的

生成规则

  • 7种生成规则

    1. 'name|min-max':value
    2. 'name|count':value
    3. 'name|min-max.dmin-dmax':value
    4. 'name|+step':value
    5. 'name|min-max.dcount':value
    6. 'name|count.dmin-dmax':value
    7. 'name|count.dcount':value

  • 生成规则的含义依赖属性值的类型才能确认，这一点特别重要。也是mock的关键所在。
    比如：

    • 'name|min-max':string: 通过重复[min,max]次string生成新字符串。
    • 'name|min-max':number: 生成一个number，返回在[min,max]。

属性值

  1. 属性值可含@（占位符）
  2. 指定最终的值和类型
  3. 属性值类型
    • String
    • Number
    • Boolean
    • Object
    • Array
    • Function
    • RegExp
    • Path

学过js看着十分简单，只是多了RegExp 和 Path，其他简直一模一样。

数据占位符定义规范DPD

占位符

1.占位符只是在属性字符串中占个位置，并不出现在最终的属性值中
2.格式：@占位符或者@占位符(参数[,参数])
3.占位符

  • 用@标识后面的字符串是占位符
  • 引用的是Mock.Random中的方法
  • 扩展定义占位符：Mock.Random.extend()
  • 引用数据模板中的属性
  • 支持相对路径和绝对路径

4.数据占位符类型
数据占位符一共有如下几种类型：

  • Basic
  • Date
  • Image
  • Color
  • Text
  • Name
  • Web
  • Address
  • Helper
  • Miscellaneous

具体mock语法示例，请参考mock示例2，里面详细的介绍了各个类型使用方法。

rap写接口文档中运用mock3

什么是rap

RAP是前后端沟通桥梁的通信接口，是一个图形化的接口文档管理的软件。它可以自动生成mock数据，在开发时候前端同事可以不依赖于后端的数据，而是根据mock规则自动生成的模拟数据进行测试。
RAP

怎么在rap中是使用mock

有很多资料，且是图文并茂写博文4,5。总结起来，在rap中运用mock方法如下：

  • 左边变量写 name|rule，此处相当于就是mock中的'name|rule';
  • 右边备注写 @mock=value。其语法规则mock一样。
  1. 1.https://github.com/nuysoft/Mock/wiki ↩
  2. 2.http://mockjs.com/examples.html ↩
  3. 3.https://github.com/thx/RAP/wiki/ ↩
  4. 4.http://www.imooc.com/article/17588 ↩
  5. 5.http://blog.sina.com.cn/s/blog_c00ccc680102x0ue.html ↩