V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
xinyu198736
V2EX  ›  程序员

团队刚刚开放出来的在线 Mock 服务,欢迎试用

  •  4
     
  •   xinyu198736 ·
    xinyu198736 · 2017-04-26 15:08:52 +08:00 · 12890 次点击
    这是一个创建于 2773 天前的主题,其中的信息可能已经有所发展或是发生改变。

    什么是 Easy Mock

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

    网站地址: https://www.easy-mock.com 欢迎注册体验。

    目前 easy-mock 在大搜车已经支持了 200 个项目, 4000 条 mock 数据的量级,并且完全独立部署,请大家放心使用。

    PS: 反馈问题请加 QQ 群: 595325417

    前言

    今天我们要说一说 如何有效提高前端开发效率 ,这个话题似乎有些大了, 更确切的说应该是 如何使用 Easy Mock 提高前端开发效率。在前后端分离的大浪潮下,如何有效保障我们在开发环节不被打断?(接口开发需要的时间往往比前端多)

    数据伪造

    我相信大家都有各自的办法。比如说,

    • 将 Mock 数据写在代码里
    • 利用请求拦截
    • 利用 Charles 等代理工具,将 URL Map 到本地文件
    • 本地 Mock Server

    上面这些方法虽然可以解决我们的问题,但同样伴随着一些问题。比如说,

    • 脏代码
    • 依赖特定的框架
    • 增加切换成本
    • 接口数据结构重构需要手动更新
    • 效率低下
    • 无法优雅的进行协同编辑
    • 无法持久化

    看到这些,它们真的能够提高我们的开发效率吗?答案就在你的心中。 为此,Easy Mock 就这样诞生了。

    支持 Swagger

    Swagger 是一个规范和完整的框架,用于生成、描述、调用和可视化 RESTful 风格的 Web 服务。

    效率一直我们关注的问题, Easy Mock 支持基于 Swagger 生成 Mock List 。并且,智能的更新操作只会对已经变动的接口做覆盖式更新。 并且基于 Swagger 创建的接口是支持参数显示的,也就是说我们能看到这个接口的请求参数和响应数据结构。

    再简单点讲,它的强大之处在于彻底解放我们的双手。只要后端用了 Swagger (并且按照规范生成 API 文档),生成 Mock 数据只是 1 秒钟 的事情。

    具体的使用方式见 Easy Mock 官网文档。

    更简单的团队协作

    Easy Mock 提供了 2 种方式以实现团队协作编辑。

    • 个人项目 下邀请小伙伴一起参与编辑
    • 创建团队加入团队 即可参与该团队下所有项目的编辑

    响应数据

    如果能根据传入的参数动态返回数据该多好? Easy Mock 支持处理 Request 对象。 也就是说我们可以通过 Request 对象的某些属性进行条件判断,从而实现 响应式数据。 那么,Request 对象都有些什么属性呢?如下,

    • header
    • method
    • url
    • querystring
    • host
    • hostname
    • query
    • cookies

    这些只是一部分,更多属性和使用方式见 Easy Mock 官网文档

    接口代理

    有了接口代理可以做更多的事情。

    • 代码调试
    • 跨域请求

    工作台

    如何在茫茫的项目列表中找到你想要进行编辑的项目? 搜索虽然很方便,但有时候来回切换项目也需要时间成本,并且这是烦人的。 为此我们可以通过将项目添加到工作台中,以提高我们的使用效率。

    快捷键

    为了进一步提升效率,值得一提的小细节是 Easy Mock 支持快捷键操作。

    创建项目 & 创建接口

    项目列表接口列表 中,按下 ctrl + c

    搜索

    项目列表接口列表 中,按下 ctrl + s

    更多特性

    导出接口

    有可能你需要在本地用到这些接口,正好 Easy Mock 支持导出数据。

    复制

    这对于接口版本升级是很有用的。试想一下,一个项目超过 200 个接口,如果后面接口版本升级,同时以前的接口不变。再一次创建 200 个接口是什么感觉?

    Restful

    如果后端提供 /restful/:id/list 或者 /restful/{id}/list 这样的接口地址。别慌, Easy Mock 是支持的

    扩展

    移动端调试

    步骤如下:

    • 利用 Charles Fiddler 等代理工具,抓取客户端中包含页面入口的接口
    • Easy Mock 上创建一个接口
    • 将刚刚抓取的接口数据复制到 数据模型 中,修改页面入口为本地的入口然后保存。要用本地 ip 哦,localhost 在手机上是无效的
    • 点击 预览,复制接口地址
    • 回到代理工具。点击最开始抓取的接口,将其代理成刚刚复制的地址即可

    这个方式可以为调试带来极大的帮助。

    联系方式

    反馈问题请加 QQ 群: 595325417

    15 条回复    2017-09-18 10:36:36 +08:00
    razor1895
        1
    razor1895  
       2017-04-26 15:36:54 +08:00
    你的名字暴露啦
    byfar
        2
    byfar  
       2017-04-26 16:21:36 +08:00
    确实实用,不过阿里的 anyproxy 也可以实现相同的功能

    https://github.com/alibaba/anyproxy
    iannil
        3
    iannil  
       2017-04-26 16:22:16 +08:00
    强势围观芋千万
    ThinkCat
        4
    ThinkCat  
       2017-04-26 17:42:55 +08:00
    偶遇同事,围观一下
    firefox12
        5
    firefox12  
       2017-04-26 17:56:39 +08:00
    作为品牌宣传,并看不出这个 mock 是在那个层面工作 它如何工作 谁需要它 如何和它集成?我第一个感觉是那个 easymock 框架。
    xuzywozz
        6
    xuzywozz  
       2017-04-26 18:44:29 +08:00
    围观芋头 2333
    jeneser
        7
    jeneser  
       2017-04-26 18:48:15 +08:00
    🏊
    先收藏,再点赞,然后去体验...
    itommy
        8
    itommy  
       2017-04-26 18:52:35 +08:00
    密码不能超过 20 个字符
    itommy
        9
    itommy  
       2017-04-26 18:53:28 +08:00
    btw, 很赞!
    xinyu198736
        10
    xinyu198736  
    OP
       2017-04-26 19:02:54 +08:00
    @ThinkCat who are you...
    xinyu198736
        11
    xinyu198736  
    OP
       2017-04-26 19:03:12 +08:00
    @byfar 作用完全不一样哈。。
    xinyu198736
        12
    xinyu198736  
    OP
       2017-04-26 19:03:43 +08:00
    @firefox12 完全不是一个东西哈,这个是给前端用的服务,理解不了也很正常。
    fhefh
        13
    fhefh  
       2017-04-26 21:33:14 +08:00
    @xinyu198736 谢谢推荐 正在尝试使用了
    yangjie6020
        14
    yangjie6020  
       2017-04-27 10:17:20 +08:00
    创建了两个项目,很不错,推荐公司使用
    funing
        15
    funing  
       2017-09-18 10:36:36 +08:00
    好东西,也可以尝试下一向以体验见长 apizza.cc 的在线 mock 功能,话不多说,上图( http://cdn.apizza.cc/mock.jpg ),官网地址 http://apizza.cc
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1019 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 19ms · UTC 21:36 · PVG 05:36 · LAX 13:36 · JFK 16:36
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.