-
前言
相信多数前端都会遇到这类问题:明明是要验证一个很简单的东西,但是这个问题复现的前置条件实在太难完成了,导致自己很痛苦。这里的太难完成可能是:
-
业务流程太长(不熟悉流程或懒的重走一遍)
-
要验证的是测试环境,不能通过前端硬编码解决
-
修改数据库困难(没有条件改、不会改或者不想麻烦后端改)
-
不想使用代理软件(没必要、没用过或者安装、配置麻烦等)
如何解决上述问题呢?如果可以在客户端接收数据前拦截并加以修改再返回,就可以达到mock数据的目的。Easy Interceptor就是利用上述思路,作为一个chrome插件,它对使用者的心智负担极小,它可以拦截XMLHttpRequest数据请求方式的http请求,通过覆盖response,responseText字段,从而达到对数据的修改。
注意:它是通过代理xhr的方法、属性,覆盖特定的字段,因此需要保证接口正常,devtool-network的信息并不会改变
特点
-
免费,无广告
-
监听当前请求,省略填写的麻烦
-
集成了Json Editor,更方便的编辑json
-
自动将js对象修复为json格式
-
导入导出,工程序列化
使用说明
图标状态
-
灰色:关闭状态
-
橙色:监听状态
-
紫色:拦截状态
左上方工具栏
-
【新增】:添加一条数据
-
【删除】:删除数据(默认删除所有,可勾选删除)
-
【导入、导出】:对当前数据的序列化
-
【刷新】:刷新数据(更新数据,清除拦截次数,并折叠展开的数据)
-
【切换主题】:亮色模式 | 暗色模式
右上角菜单
-
关闭状态:关闭插件
-
监听功能:监听请求(仅对Content-Type为json类型的请求有效)
-
拦截功能:自定义responseText
使用方法
下面提供三种使用方式,可以结合具体的场景使用
方式1
新建一个数据然后手动填写general和response选项,如下
方式2
使用监听形式,重新请求接口,然后修改数据
方式3
使用监听形式,控制台replay,然后修改数据(注意:使用此方式无法获取response,需要手动填写)
注意事项
-
仅在开发时使用,不使用时请关闭
-
因为存储仅有5M,插件使用shorten函数对单条数据做精简(规则:数据超过50000字符时启用,当满足数组超过10项或字符串超过200字符时会通过递归折半精简数据)
-
可以书写js对象,程序会尝试修复
参考
-