前后端分离开发接口定义mock 数据

现在开发的方式基本都采用了前后端分离的技术来实现，初期有页面原型，后端代码没有开发完成，前端工程师就不能开发前端页面，这样前端在初期就不能作业面设计，假数据是写死的不是很灵活。于是有了mock的概念。

mock介绍《图片来自mock官网》 http://mockjs.com/

这里我安利一个国内开源的mock接口定义的官方网站

https://www.easy-mock.com

这是对mock的封装，不需要单独搭建mock环境，直接定义接口按照他的返回方式进行数据返回

缺点：数据是标准的JSON key-value方式出现的 只可以对value可以采用function的方式变化 模拟复杂的对象就很困难。

优点：节省成本，快速入手，采用mock数据格式可以支持Swagger支持restFul风格请求

Lets do it

首先打开 easy-mock的官网输入用户名密码登录，没有用户名密码的会自动创建一个用户登录系统

创建一个个人项目

打开项目创建接口

如下图

具体规则查看文档

示例：

{
  data: function({
    _req,
    Mock
  }) {
    let needLoadTpl = {
      type: "danger",
      text: "该操作需要登陆才能完成，请登陆系统",
      code: null,
      errors: []
    }
    let buildStuts = _req.params.buildStuts // 请求参数 《building,builded》其他参数不接受无数据 
    let token = _req.header.token // 请求头
    let body = _req.body // 请求体
    let page = body.page
    let pageSize = body.pageSize
    let currentPage = body.currentPage
    if (token) {
      let havaData = false
      let data = {
        id: @increment(100),
        projectCode: P@date("yyyyMMdd")@string("0123456789",4), //编码
        projectName: 公园@cword("一二三四五六七八九十")号@integer(1, 4)# @string("0123456789",3), //项目名称
        customerName: @cname, //客户姓名
        customerPhone: /^(1[356789][0-9]|14[012356789])[0-9]{8}$/, //手机号
        address: @county(true)@projectName,
        workStatus: 
      } //项目地址
      if (buildStuts === building && body.length > 0) {
        data.workStatus = @integer(0, 3) // 工程状态在建工程
        havaData = true
      } else if (buildStuts === builded && body.length > 0) {
        havaData = true
        data.workStatus = 4 //完工工地
      } else {
        havaData = false
        return  params must in [building,builded] your params  + JSON.stringify(buildStuts)
      }
      if (havaData) {
        // 设置请求超时
        /*
          Mock.setup({
            timeout: 200-600
          })
        */
        return Mock.mock({
          content|1-10: [data],
          page: page ? Number.parseInt(page) : 1,
          pageSize: pageSize ? Number.parseInt(pageSize) : 10,
          totalPage: currentPage ? Number.parseInt(currentPage) : 1,
          totalRows: currentPage ? Number.parseInt(currentPage) * Number.parseInt(pageSize) : 1 * 10,
          currentPage: currentPage ? Number.parseInt(currentPage) : 1,
          body: body
        })
      }
    } else {
      return Mock.mock(needLoadTpl)
    }
  }
}