送给前端的你：可视化快速生成模拟数据服务——Easy Mock

内容来源：2017年11月18日，大搜车前端工程师高攀在“2017中国开源年会”进行《Easy Mock 接口数据模拟服务》演讲分享。IT 大咖说（微信id：itdakashuo）作为独家视频合作方，经主办方和讲者审阅授权发布。

阅读字数：1940 | 5分钟阅读

摘要

Easy Mock 是一个极其简单、高效、可视化、并且能快速生成模拟数据的在线 Mock 服务。以项目管理的方式组织 Mock List，能帮助我们更好的管理 Mock 数据，不怕丢失。你问我为什么要用它？请听我一一道来它的过人之处。

嘉宾演讲视频及PPT回顾：http://suo.im/1HsWF9

需求

大部分前端或者客户端开发对 Mock 都是有需求的，这是由于后端的接口开发往往会慢于前端进度。

从前端编码阶段到开发环境、预发环境、线上环境这样一个流程中，其实后期的预发、线上环境阶段对应的 API 是不用太过关心的，因为这个时候开发已经处于完成阶段了。唯一无法把控的是开发阶段，这个时候后端往往会因为某些情况滞后前端，这样就会造成节点同步的问题，需要使用 Mock 环境来解决。

Mock常见方法

代码层硬编码

代码层硬编码是将 Mock 的数据统一写在代码内，这样的缺点就是耦合性非常强，有着局限性，无法模拟真实请求。

代码中请求拦截

这种方式和第一种很相似，唯一的不同是 Mock 的数据不是放在代码中而是放在本地的文件中，缺点也是和第一种一样。

代理工具拦截

代理工具拦击和代码中请求类似，是借助代理工具进行请求拦截，缺点是操作繁琐，成本比较高

Mock Server

Mock Server 就是在本地或者远端启一个新的线上Mock 服务器。像 Mock Server 这样的线上服务阿里和网易都是有提供的，但是 Mock 在它们的服务里其实只是一个附带的功能。

什么是Easy Mock

如果可以用一句话来总结，那就是“可视化，并且能快速生成模拟数据的持久化服务”。

同步Swagger

Easy Mock 的第一个核心特性是同步 Swagger，生成接口只需要1秒。Swagger 简单来说是一套接口管理工具，后端一般是使用它管理接口。这套工具同样提供了 Mock 功能，但是我们只是用它来进行接口的管理和测试。所以借助这个接口文档，我们把它集成到了 Easy Mock 内，这样就可以基于 Swagger 直接生成现成的 Mock 接口，极大的提升了效率。

Swagger 其实是基于 Open API 规范的，这套规范已经发布了3.0，不过目前用得更多的是1.2和2.0，好在 Easy Mock 都支持。

接口代理

接口代理是 Easy Mock 的第二个特性。 有时候我们会需要一些特殊的场景，例如需要接口的转发，这个接口可能是线上的也可能是线下等等不同的情况。这个时候就可以很轻松的通过Easy Mock 完成接口代理的任务。

协同编辑

开发的过程中会有不同的人员参与进来，包括前端、后端、客户端等等，这个时候协同编辑就显得比较重要了。因为一个项目里只能一个人编辑的话，其他人就会显的非常被动，这个时候邀请相关的开发人员参与进来，就能够获得更高的执行效率。

工作台

当使用到众多项目中某一个项目的时候，就可以将这个特定的项目添加到工作台方便进行管理。

响应式数据

除开简单的数据外，Easy Mock 还可以去模拟动态化的响应，例如根据不同参数写一些脚本，然后根据脚本判断应该生成什么样的数据，使得数据能动态响应，并且更加的真实化。

Easy Mock CLI

Easy Mock CLI是基于 Easy Mock 快速创建 API 文件的命令行工具，在我们的业务开发中创建一个 API 大致是下面这样的流程。

首先抽象出一个目录用来放置 API 文件，然后判断当前业务是否需要新建该文件，如果需要就新建 API.JS 文件。接着在文件里定义一个新的请求方法，这个方法往往伴随着 Easy Mock 上对应的接口，最后就是实现具体的代码细节，比如复制代码，更改url之类的。使用这个 CLI 工具，只需要一份配置文件加上一行命令就可以生成 API 文件。

拥抱后端

Easy Mock 只专注于 Mock 领域而没有接口方面的管理，而借助 Swagger 后就可以快速的生成项目并查看相应的参数。但是却无法进行编辑，这样一来对后端其实是不太友好的，后端需要先在 Swagger 内修改，完成后再通过同步功能进行同步。

为了避免误操作，EasyMock 提供了一个非常实用的特性。当用户修改配置文件的结构后再进行同步，文件的配置结构会被回填，保留原有的结构，而文件的内容则是可以被直接修改的。

今天的分享就到这里，喜欢本次分享请给我点赞~谢谢大家！有什么问题可以在评论区讨论。