最近一直在思考如何对Web API的其接口数据进行独立开发的问题,随着Web API的越来越广泛应用,很多开发也要求前端后端分离,例如统一的Web API接口后,Winform团队、Web前端团队、微信小程序或者APP团队大家可以同步开发,在最初约定一些接口的输入JSON数据和输出JSON数据,但是随着项目的进度开展,这些数据结构一直有所变化,那么我们模拟的JSON数据格式也需要协同变化,但是很不幸既然大家忙着开发,接口协调的事情肯定优先级没那么高,即使每次记得协调接口数据,也不一定能够完全一致。

在Web API端也就是后端没有完全做好的情况下,我们不可能给出所有接口的输入输出JSON格式,那么我们是否可以考虑采用折中模拟数据接口的方式来提供,并且能够提供比较易读、易维护的处理方式呢?答案是肯定有的,结合RAP2和Mock.js两者的特点,可以较为方便的模拟出我们需要接口的URL、输入参数、输出参数等信息。

RAP2是一个Web接口管理工具,开源免费,接口自动化,MOCK数据自动生成,自动化测试,企业级管理。

Mock.js的出现解决了前端离开后端就没法请求数据的问题,但也出现了新的问题,就是在切换生产环境的时候,模拟的数据可能和接口又发生不同步的情况。

RAP2是一个新的解决方案,将前端后端拉倒一个团队仓库中,共享一个仓库,无论是URL地址,还是请求需要的参数,在团队仓库中双方都可以管理,并且可以记录团队成员修改了哪些接口,整合到生产环境的时候,可以比较完美的切换,同步性较好!

相关网站资源:

1、RAP2创建接口

打开网站http://rap2.taobao.org/,注册一个用户账号,并创建自己的模块和接口,如下所示

默认有一个示例接口指引我们做相关的参数或者响应内容

对每个参数,都可以使用Mock规则进行生成值,如下界面所示

除了示例,我们也可以创建自己的模块和接口,如下所示我们创建一个用户管理的模块,以及两个接口。

获取用户的接口定义如下所示。

这个URL地址是我们逻辑上的相对地址,实际在使用的时候,我们加上一个基地址就可以了,在RAP2 它也是一个相对地址,测试接口的地址也是加上一个基础地址,这样我们实际开发的时候,把这部分基础地址替换为生产环境的地址即可顺利切换过去了。

这个接口实际返回的JSON数据格式就是我们约定好的JSON格式了,如果我们有变化,大家参考这个中间的平台就可以了,沟通时比较方便,也可以对比那些字段参数变化调整了,这样前后端就有了一个参考的中间平台,一致性较好。

2、接口参数定义和Mock变量使用

那么这些JSON数据是如何来的,我们其实是填写了一些变量,让它自动生成的数据的,这个也是Mock.js的功劳吧。RAP2集成了MockJS的很多变量使用,参考着使用就可以构建很多不一样的数据,非常方便。

下面列出我的一些输入、输入的变量内容。

输入的参数,定义如下:

响应的输出参数如下定义。

获得的输出自动生成的JSON数据如下所示。

这个就是我们使用Mock变量的好处,自动根据规则填充,上面我使用了各种变量来定义数据,如果你需要了解Mock的变量,可以结合Mock的变量来测试即可。具体参考下面说明。

http://mockjs.com/examples.html

上面链接列出了Mock的两项定义:数据模板定义和数据占位符定义,可以根据情况用不同的定义。我更侧向于使用后者,方便快捷。

RAP2给前后端开发者一种更好更透明的协同开发方式,一个负责维护接口、一个负责参考修改调用,大家相互配合,其乐融融。
关于RAP2的功能好像还有很多,不过我们使用它最主要的目的是解决模拟API接口和协同性的问题,这个大原则是它的主要目的,基于RAP2和Mock.js的结合,我们可以解放频繁沟通而得不到接口一致性问题的问题,从而实现更好从调试环境到生产环境的切换。

甚至更好的方案是我们 在Web API接口开发的初期,先花点功夫来定义好所有的接口输入输出,整理一个大家认为比较好的接口规范后,再开始Web API的编码,这样肯定后期开发是事半功倍,而且前端也可以很快对接。

 

使用RAP2和Mock.JS实现Web API接口的数据模拟和测试的更多相关文章

  1. Web API接口之FileReader

    Web API接口之FileReader *:first-child { margin-top: 0 !important; } body>*:last-child { margin-botto ...

  2. WebApi系列~通过HttpClient来调用Web Api接口~续~实体参数的传递

    回到目录 上一讲中介绍了使用HttpClient如何去调用一个标准的Web Api接口,并且我们知道了Post,Put方法只能有一个FromBody参数,再有多个参数时,上讲提到,需要将它封装成一个对 ...

  3. 如何让你的 Asp.Net Web Api 接口,拥抱支持跨域访问。

    由于 web api 项目通常是被做成了一个独立站点,来提供数据,在做web api 项目的时候,不免前端会遇到跨域访问接口的问题. 刚开始没做任何处理,用jsonp的方式调用 web api 接口, ...

  4. Asp.Net Web Api 接口,拥抱支持跨域访问。

    如何让你的 Asp.Net Web Api 接口,拥抱支持跨域访问. 由于 web api 项目通常是被做成了一个独立站点,来提供数据,在做web api 项目的时候,不免前端会遇到跨域访问接口的问题 ...

  5. Asp.Net Web Api 接口

    如何让你的 Asp.Net Web Api 接口,拥抱支持跨域访问.   由于 web api 项目通常是被做成了一个独立站点,来提供数据,在做web api 项目的时候,不免前端会遇到跨域访问接口的 ...

  6. 微信小程序的Web API接口设计及常见接口实现

    微信小程序给我们提供了一个很好的开发平台,可以用于展现各种数据和实现丰富的功能,通过小程序的请求Web API 平台获取JSON数据后,可以在小程序界面上进行数据的动态展示.在数据的关键 一环中,我们 ...

  7. 使用egg.js开发后端API接口系统

    什么是Egg.js Egg.js 为企业级框架和应用而生,我们希望由 Egg.js 孕育出更多上层框架,帮助开发团队和开发人员降低开发和维护成本.详细的了解可以参考Egg.js的官网:https:// ...

  8. ASP.NET Web API 接口执行时间监控

    软件产品常常会出现这样的情况:产品性能因某些无法预料的瓶颈而受到干扰,导致程序的处理效率降低,性能得不到充分的发挥.如何快速有效地找到软件产品的性能瓶颈,则是我们感兴趣的内容之一. 在本文中,我将解释 ...

  9. 不使用jQuery对Web API接口POST,PUT,DELETE数据

    前些天,Insus.NET有演示Web API接口的操作: <怎样操作WebAPI接口(显示数据)>http://www.cnblogs.com/insus/p/5670401.html ...

随机推荐

  1. 关于单元测试的思考--Asp.Net Core单元测试最佳实践

    在我们码字过程中,单元测试是必不可少的.但在从业过程中,很多开发者却对单元测试望而却步.有些时候并不是不想写,而是常常会碰到下面这些问题,让开发者放下了码字的脚步: 这个类初始数据太麻烦,你看:new ...

  2. 在asp.net core2.1中添加中间件以扩展Swashbuckle.AspNetCore3.0支持简单的文档访问权限控制

    Swashbuckle.AspNetCore3.0 介绍 一个使用 ASP.NET Core 构建的 API 的 Swagger 工具.直接从您的路由,控制器和模型生成漂亮的 API 文档,包括用于探 ...

  3. MySQL学习(四)Join 等开发常用的操作 --- 2019年2月

    1.查数据太多不会把内存用光 InnoDB 的数据是保存在主键索引上,然后索引树分割保存在数据页上,数据页存在内存中/磁盘.change buffer 就是先把修改操作记录,然后读数据的时候,内存没有 ...

  4. Python 进度条显示

    运行工具:Pycharm, import timescale = 50print("开始执行".center(scale//2,"-")) start = ti ...

  5. 编辑器开发之 Selection 对象的学习

    上一篇,介绍了 range 对象的一些属性和方法,了解了一些基本操作,现在来介绍另外一个重要的对象:selection 对象: MDN 的解释是:Selection 对象表示用户选择的文本范围或插入符 ...

  6. Spring Cloud Eureka 你还在让它裸奔吗??

    前些天栈长在微信公众号Java技术栈分享了 Spring Cloud Eureka 最新版 实现注册中心的实战教程:Spring Cloud Eureka 注册中心集群搭建,Greenwich 最新版 ...

  7. .NET Core微服务之基于Consul实现服务治理

    Tip: 此篇已加入.NET Core微服务基础系列文章索引 一.Consul基础介绍 Consul是HashiCorp公司推出的开源工具,用于实现分布式系统的服务发现与配置.与其他分布式服务注册与发 ...

  8. 《HelloGitHub》第 27 期

    公告 网站新增了简单的搜索功能,可以通过项目名称或地址搜索.查看项目.欢迎star和推荐项目,我们一只在路上,希望志同道合者加入进来. 现招募专栏负责人: C# Java <HelloGitHu ...

  9. 用python读文件如.c文件生成excel文件

    记录一下,如何实现的,代码如下: #!/usr/bin/env python # coding=utf-8 # 打开文件 import xlwt import re import sys bookfi ...

  10. [开发技巧]·Numpy中对axis的理解与应用

    [开发技巧]·Numpy中对axis的理解与应用 1.问题描述 在使用Numpy时我们经常要对Array进行操作,如果需要针对Array的某一个纬度进行操作时,就会用到axis参数. 一般的教程都是针 ...