mock简介

在你知道mock调试之前，客户端开发一个比较大的问题就是需要配合服务端完成接口的联调工作，在服务端接口可用之前，比较常见的方法就是在代码中通过一段伪造的数据代码来展示页面，如果数据比较多那么伪造数据还是一件比较麻烦的事情，而mock接口调试正是为了彻底解决掉这个问题，mock说白了就是可以在不依赖服务端的情况下伪造出客户端想要的数据结果，如果你还在使用原始的在代码中伪造数据的形式调试开发程序，又或者等到服务端开发完成后才能进行接口调试的话，那么mock调试是你必须要掌握的技能。
使用mock调试接口的好处显而易见，客户端可以和服务端并行进行开发，再也不用担心ui页面开发完成后没有数据测试的情况了，mock强大的随机数据可以让每一次调用接口都呈现不同的结果，可以尽可能的将一些业务逻辑都覆盖掉。

mock语法

mock语法可以说是简单易学，几乎可以说是看一遍就能直接掌握，这里就直接贴出教程地址戳我看教程，这里重点说下，直接看教程里面的”语法规范”就可以了，其他部分在需要使用的时候过来查下就可以了，关于mock的安装部分，没必要去看了，因为我们直接使用在线的mock进行调试，无需安装。这里推荐一个好用的在线mock调试平台，好用的mock平台，引用官网的一句话”Easy Mock 是一个可视化，并且能快速生成 模拟数据 的持久化服务。 忘掉下面这些实用但麻烦的 Mock 方式吧。在你用了 Easy Mock 之后，你肯定会爱不释手的。“

实战部分

自己动手实践一遍才能真正体会到mock的好处，mock上手很容易，加上easymock这个好用的平台，可以让接口调试非常顺利。当你在平台上注册完毕之后，你会发现easymock已经默认给你创建好了一个demo工程，可以简单的看一下里面的内容。这不是重点，现在我们自己动手创建一个项目，生成一些mock数据。

创建项目

很简单，可以在页面的右下角看到一个这样的图标 QQ截图20180823173813.png

点击创建项目即可，填写好url项目就创建成功了，等下在请求数据的时候需要使用到这些url。

生成mock数据

比如说开发文档有这么一个数据结构

{
    "code": 0,
    "data": {
        "rst": {
            "id": "5b4703985c46bd1a58b600b8",
            "image_url": "https://stcbeta.8531.cn/1.jpg",
            "nick_name": "hello1",
            "mobile": "13213219602",
            "grade_swtich": 1,
            "cur_grade_name": "平民",
            "cur_grade": 2,
            "cur_sub_experience": 25,
            "total_sub_experience": 300,

            "is_full_level": 0,
            "next_grade_name": "斗士资格者12222",
            "cur_experience": 427,
            "total_integral": 1210,
            "shopping_switch": true,
            "sign_swtich": 1,
            "user_task_list": [{
                    "name": "签到",
                    "finish_times": 0,
                    "frequency": 1,
                    "experience": 0,
                    "integral": 0,
                    "completed": 0,
                    "member_task_type": 1
                },
                {
                    "name": "新闻资讯阅读",
                    "finish_times": 0,
                    "frequency": 5,
                    "experience": 10,
                    "integral": 20,
                    "completed": 0,
                    "member_task_type": 2
                },
                {
                    "name": "邀请好友",
                    "finish_times": 0,
                    "frequency": 3,
                    "experience": 100,
                    "integral": 100,
                    "completed": 0,
                    "member_task_type": 7
                },
                {
                    "name": "新闻资讯评论",
                    "finish_times": 0,
                    "frequency": 3,
                    "experience": 0,
                    "integral": 100,
                    "completed": 0,
                    "member_task_type": 4
                }
            ]
        }
    }
}

如果直接在代码中造数据的话是比较痛苦的一件事情，为了看不同的结果需要不停的修改代码然后编译运行。使用mock后你会发现这将变成一件非常简单的事情。mock数据类型如下

{
  "code": 0,
  "data": {
    "rst": {
      "id": "5b4703985c46bd1a58b600b8",
      "image_url": "",
      "nick_name": "@string(0, 20)",
      "mobile": "13213219602",
      "grade_swtich|0-1": 1,
      "cur_grade_name": "@string(0, 20)",
      "cur_grade|1-99": 1,
      "cur_sub_experience|0-1000": 1,
      "total_sub_experience": "@cur_sub_experience" + "@integer(0, 10)",

      "is_full_level|0-1": 0,
      "next_grade_name": "@string(20, 40)",
      "cur_experience": 427,
      "total_integral": 1210,
      "shopping_switch|1": true,
      "user_task_list|0-9": [{
        "name": "@string(4, 10)",
        "finish_times|0-5": 0,
        "frequency": 5,
        "experience|90-200": 0,
        "integral|90-200": 0,
        "completed|0-1": 0,
        "member_task_type|1-6": 1
      }]
    }
  }
}

里面的语法规则其实比较简单，建议看下我之前说的github上的教程或者easymock上的语法规则后回过头来再看都能看懂含义。

伪造后数据之后接下来的事情就比较简单了，修改代码中请求的url地址为easymock提供给我们的url即可，接下来就是见证奇迹的时刻，运行程序后你就会发现我们可以获取到这些随机数据了，上面的数据结构是自己开发中使用到的一个真实接口，附上一张动态gif给大家看下实际效果 ezgif-1-fbc5d7e3c5.gif 录出来的效果有点卡，实际展示效果比较流畅，可以看到每次进入页面的时候获取到的数据都是不一样的，具体展示什么数据完全可以根据mock语法对数据模板进行修改，学会使用mock来调试接口后再也不用手写代码造数据了，毕竟mock才是专业干这事的。