VirAPI -- 非侵入式虚拟数据在线请求响应生成接口,支持MockJs语法,请求即可得自定义规则的响应数据。
恭喜你发现了这么一款好的工具 -- VirAPI,具体VirAPI是干嘛的?有什么用?这里简单介绍一下它创建的初衷,以及它可以在你的开发过程中为你带来哪些便利与功能。
从MockJS谈起
如果你是前端开发人员或测试人员,应该对MockJS有所耳闻,甚至在实际开发工作中有接触使用到它。MockJS是一款功能强大的虚拟随机数据生成及模拟Ajax请求的框架。官方为其给出了六大特点:
- 前后端分离
- 开发无侵入
- 数据类型丰富
- 增加单元测试的真实性
- 用法简单
- 方便扩展
确实很是美好,但在使用过程中其中有一环节在我看来并不友好,说是“开发无侵入”,但在使用时需要引入MockJS包,然后还要在项目中通过Mock.mock
定义模拟的响应数据结构,再借助拦截Ajax请求的机制来实现整个响应请求生成虚拟数据的过程。单独这一点在我看来就不够优雅友好,现实开发过程中引入生产环境不需要的Js包,定义本地测试才需要的JS代码,都是一种侵入式的污染,对我这种有代码洁癖,及考虑线上线下正式环境与本地开发环境一致性的开发者来说,确实有些顾虑。
// 引入mockjs
import Mock from 'mockjs'
const url = '/custom_request_url_01';
// 使用mockjs定义模拟响应数据
Mock.mock(url, {
"code": 0,
"data": {
"mtime": "@datetime", //随机生成日期时间
"score|1-800": 800, //随机生成1-800的数字
"rank|1-100": 100, //随机生成1-100的数字
"stars|1-5": 5, //随机生成1-5的数字
"nickname": "@cname", //随机生成中文名字
}
});
// 这里省略部分逻辑...
// 真正需要的逻辑:拦截网络请求返回随机虚拟响应数据
axios.get(url).then(res => {
// 这里即可获得 Mock 随机虚拟数据
// res.data = {code:0, data:{...}}
})
.catch(error => {
// ...
});
为此,VirAPI应运而生,它站在MockJS的肩膀之上,采用 “云定义” “云引用”的方式,达到完全 “零入侵” “零污染”。那么VirAPI是怎么做到的呢?
我们先来想想真实开发过程是怎样的,是不是后端开发同学准备好前端所需的开发接口,然后前端同学通过请求一个URL,按照接口的要求和规范(携带什么参数、使用什么请求方式等等),去请求这个接口URL,然后服务端接口对请求进行必要的验证(参数是否正确是否合法等),再返回对应的响应结果或响应数据?
这才是真实开发过程中真实的模样和流程。而VirAPI正是尊重并遵循这个既定事实,将MockJS打造成为一个提供接口URL,验证请求数据,响应返回模拟数据的更加合理的场景化的在线虚拟数据云接口平台。
VirAPI的使用介绍
1. 三步快速创建在线云虚拟数据接口
1.1 创建应用
就像实际项目开发,都是针对一个个项目应用进行开发,而其具体的接口都是在这个项目应用下创建的。VirAPI的虚拟接口也是通过项目应用来区分管理的。
1.2 创建虚拟接口
创建一个项目应用后,然后再在该项目下创建接口。目前支持创建POST
,GET
,PUT
,DELETE
四种请求类型虚拟接口;支持自定义请求路由(包括动态路由)、请求参数、请求数据合法性验证规则,及预期请求响应返回数据结构。
其中接口响应数据即为MockJs的Mock.mock
方法中定义的虚拟响应数据结构;熟悉MockJS语法的同学能快速适应上手,定义出或复杂或丰富的想要的响应数据。
若是对MockJS语法不是很了解的也不需要担心,其语法很是简单,基本就是JSON的结构,只不过提供了丰富的方法(方法用 @
引出,且还可以为方法传参进行调整)。具体MockJS支持的方法及参数可见http://mockjs.com/examples.html;而且几乎对着该文档说明就能马上上手。
1.3 请求接口URL获取虚拟数据
获取应用对应的Token,提交请求参数给虚拟接口URL,即可获取目标虚拟响应数据。就是这么简单!
而且更为重要的是,在你的项目中你只需要在获取请求或发送请求的地方,将请求URL换为虚拟接口URL,即可在你的项目中使用了!
若后端开发同学的接口URL命名规则一致,则在生产环境下只需替换一下接口的请求域名即可。几乎就不用再做任何的修改,以及删除不需要的代码或做生产环境的大的适配。
2. 更加丰富的功能支持
真实项目接口总会有对提交的数据进行验证,比如是否必须、数据类型、长度范围等。而VirAPI都给予了这些支持,在创建接口时,声明接收哪些数据参数,并对其可设置验证规则。若请求传递过来的数据不合符请求数据规则,即会得到请求失败的提示。如:
当前VirAPI支持 String
、Number
、Boolean
、Array
、Object
、Array/String
、Array/Number
、Array/Boolean
、Array/Object
等多种数据类型;基本满足绝大部分的开发场景。
此外,VirAPI还提供了接口文档,在线测试,以及接口请求日志及统计的功能,以帮助开发者更好的管理与分析自己的项目。
以上就是VirAPI https://www.virapi.com的简单介绍,感兴趣或有需要的同学可以去尝试一下。
VirAPI是借助了MockJS的核心功能进行的扩展,在此也感谢MockJS。当前VirAPI也还存在很多不足,衷心的欢迎各位小伙伴的批评与建议。
期待VirAPI能为你的日常开发过程带去一丝帮助。谢谢~