easymock 图片_easy-mock的使用

上一节我们讲了如何使用mockjs来生成模拟数据，这一节我们来介绍另外一个实用的mock工具 - easy-mock，它是一个简单、高效、可视化的在线mock工具。相对于我们上节的 mockjs主要用于生成和拦截数据，easy-mock有些更加强大和实用的功能。它不仅能够生成模拟数据，更能以项目的方式管理的你接口，还能实现团队协作。此外，它还是支持接口动态入参和返回响应值。这样在前后端分离的开发环境中，接口多且复杂，它能发挥最大的作用。它的一些特性包括：支持接口代理

支持协同编辑

支持团队项目

支持Restful

支持Swagger 1.2 & 2.0

基于Swagger 快速创建项目

支持显示接口入参与返回值

支持显示实体类

响应式数据开发

支持Mock.js语法

使用easy-mock

首先我们打开easy-mock官网(官网：https://www.easy-mock.com  )，注册登录之后，它里面会有一个演示项目，我们也可以自己创建一个新的项目。如果是第一次使用easy-mock，可以使用它这个演示项目，方便我们熟悉它的各项用法。

下面我们来创建一个项目，首先点击页面右下角的蓝色的添加按钮，填写好项目名称和url，如果是团队协作，可以输入其他用户的昵称来邀请他们加入。easy-mock也支持swagger。

创建完成之后就来到了项目主页，在这里我们进行可以添加接口，同步swagger文档等操作。这里的base URL就是mock数据接口的统一地址，在请求数据的方法里面设置好统一前缀地址，之后在每个页面里面单独写请求方法的时候，就只需要后面的接口名字就可以啦。在实际项目中我们肯定也会有一个公共的请求方法用来控制网络请求，写在那里就好啦。比如在axois里面就有一个baseURL配置项。

现在我们先来创建一个接口吧。点击添加接口，在页面右边填写好接口的名称和描述，这里为了方便项目协同工作和日后修改，我们最好是写上接口的描述，养成良好习惯噢！然后就可以在左边的编辑框里面编辑你想要的数据啦，easy-mock支持mockjs语法，所以我们这里直接拿上节用mockjs语法写的数据进行测试。你也在这个编辑器进行编辑，它还有mockjs的语法提示，健忘症的盆友走过路过不要错过啦哈哈哈~

需要注意的是，easy-mock不支持@dataImage这种写法，只能使用@image，直接将上一节的代码复制过来接口是会报错的噢，所以要把生成图片的代码替换成@image才可以。你也可以在编辑器里面输入em.demo.all按下回车，它会为你自动创建好所有的数据对象，你就可以根据自己的需要增增减减啦~