【技术实现步骤摘要】
前端接口数据模拟方法、装置及系统
[0001]本专利技术涉及前端开发
,具体而言,涉及一种前端接口数据模拟方法、装置及系统。
技术介绍
[0002]在前后端分离的技术背景下,前后端的联系通常仅涉及接口,因此在开发前端部分时,通常会采用模拟数据的方式进行单独开发。目前大部分在使用的模拟数据方案为,在前端工程内直接引入mock.js来实现,它的原理是通过重写XMLHttpRequest对象的方式拦截所有请求并代理至本地,因此在调试时浏览器控制台不会监控到任何请求。这种方式带来两个问题:1、调试不便。由于在浏览器控制台看不到任何请求,因此想知道对应接口返回了何种数据仅能通过console.log的方式或者手动Debug才可以;2兼容问题。由于mock.js的实现原理是重写XMLHttpRequest对象,导致一些底层依赖XMLHttpRequest对象产生兼容性问题。
[0003]因此,现有技术缺少一种即便于调试又不会产生兼容性问题的模拟数据方案。
技术实现思路
[0004]本专利技术为了解决上述背景 ...
【技术保护点】
【技术特征摘要】
1.一种前端接口数据模拟方法,其特征在于,包括:接收前端发起的接口请求;若所述接口请求中请求的接口与MockServer服务端绑定,则将所述接口请求转发到所述MockServer服务端,以使所述MockServer服务端将与所述接口请求中请求的接口对应的模拟数据返回至所述前端,其中,所述MockServer服务端部署在所述前端本地。2.根据权利要求1所述的前端接口数据模拟方法,其特征在于,在所述接收前端发起的接口请求之前,还包括:构建所述前端并同时启动所述MockServer服务端,其中,所述MockServer服务端在启动时与所述前端的目标接口进行绑定,并从所述前端的各功能代码文件中加载所述目标接口对应的模拟数据到本地进行缓存。3.根据权利要求2所述的前端接口数据模拟方法,其特征在于,所述MockServer服务端对所述前端的各功能代码文件中的与所述目标接口对应的模拟数据进行监听,并在监听到数据变化时先清空本地缓存的模拟数据,再从所述前端的各功能代码文件中加载所述目标接口对应的模拟数据到本地进行缓存。4.根据权利要求2所述的前端接口数据模拟方法,其特征在于,所述构建所述前端并同时启动所述MockServer服务端,具体包括:通过webpack工具构建所述前端并同时利用所述webpack工具的webpack
‑
dev
‑
server功能通过钩子函数启动所述MockServer服务端。5.一种前端接口数据模拟装置,其特征在于,包括:接口请求接收模块,用于接收前端发起的接口请求;接口请求转发模块,用于若所述接口请求中请求的接口与MockServer服务端绑定,则将所述接口请求转发到所述MockServer服务端,以使所述MockServer服务端将与所述接口请求中请求的接口对应的模拟数据返回至所述前端,其中,所述MockServer服务端部署在所述前端本地。6.根据权利要求5所述的前端接口数据模拟装置,其特征在于,还包括:启动模块,用于构建所述前端并同时启动所述MockServer服务端,其中,所述MockServer服务端在启动时与所述前端的目标接口进行绑定,并从所述前端的各功能代码文件中加载所述目标接口对应的模拟数据到本地进行缓存。7.根据权利要求6所述的前端接口数据模拟装置,其特征在于,所述MockServer服务端对所述前端的各功能代码文件中的与...
【专利技术属性】
技术研发人员:刘泱,杨再同,詹娇淑,沈聪,
申请(专利权)人:中国工商银行股份有限公司,
类型:发明
国别省市:
还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。