首页 > 其他分享 >Mock 测试快速上手 :什么是 Mock 测试?

Mock 测试快速上手 :什么是 Mock 测试?

时间:2023-10-20 17:32:39浏览次数:34  
标签:url 数据 前端 测试 test 快速 Mock

Mock测试

什么是 Mock ?

Mock 的意思就是,当你很难拿到源数据时,你可以使用某些手段,去获取到跟源数据相似的假数据,拿着这些假数据,前端可以先行开发,而不需要等待后端给了数据后再开发。

Mock 测试快速上手 :什么是 Mock 测试?_API

Mock 的重要性

在现在 前后端分离 的时代,前后端如何效率更高地去完成协同开发,是一个大问题。

举个例子:

后端接口还没数据,前端要怎么去调试前端页面呢?总不能等后端有数据了再开发吧。。。

所以 Mock 重要性极高,可以让前端先行开发,而不需要等待后端有数据了再开发。

Mock 测试

Mock 功能的好处太多了,最主要的就是能让前端不用去等后端造假数据,让前端后端并行开发,但是 Mock 返回的数据也有可能不符合我们的预期,所以我们也需要严谨点,做一下 Mock 测试时很有必要的。

Mock 测试快速上手 :什么是 Mock 测试?_前端开发_02

如何进行 Mock 测试

那么如何进行 Mock 测试呢?

当然是借助工具啦,市面上现成的工具不用白不用,下面简单实用 Apifox 来给大家演示下。

创建请求、完善 Mock 参数

点击添加按钮,填入对应的接口名称、接口URL、接口请求方法:

Mock 测试快速上手 :什么是 Mock 测试?_API_03

接着我们需要补充一下响应结构,并且补充一下响应每个字段的 Mock 表达式,Apifox 为我们提供了很多现成的 Mock 表达式,我们需要去选择这些 Mock 表达式:

  • name: @name
  • email: @email
  • url: @url("http")
  • hour: @now("hour")

Mock 测试快速上手 :什么是 Mock 测试?_API_04

设置测试脚本

然后我们需要校验返回的数据,比如,我写了两个测试的断言代码:

  • 测试 url 这个字段返回的数据是否符合 url
  • 测试 email 这个字段返回的数据是否符合 email
const jsonData = pm.response.json()

pm.test("test url", function () {
    const reg = /^((http|https)://)?(([A-Za-z0-9]+-[A-Za-z0-9]+|[A-Za-z0-9]+).)+([A-Za-z]+)[/?:]?.*$/
    const res = reg.test(jsonData.url)
    if (!res) {
      throw new Error('fail')
    }
});

pm.test("test email", function () {
    const reg = /^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*.[a-zA-Z0-9]{2,6}$/
    const res = reg.test(jsonData.email)
    if (!res) {
      throw new Error('fail')
    }
});

Mock 测试快速上手 :什么是 Mock 测试?_API_05

发送请求、得到断言结果

想要使用 Apifox 的 Mock 功能的话,我们需要选择本地 Mock 环境

Mock 测试快速上手 :什么是 Mock 测试?_mock_06

最后点击发送,可以得到断言校验的结果,我们可以看到

  • url 字段的 Mock 数据符合预期
  • email 字段的 Mock 数据符合预期

Mock 测试快速上手 :什么是 Mock 测试?_mock_07

知识扩展

标签:url,数据,前端,测试,test,快速,Mock
From: https://blog.51cto.com/u_15477422/7957136

相关文章

  • 利用 CSS 的 clip-path 属性快速画三角形、气泡框
    clip-path 结合polygon函数,可以快速切出一个三角形、气泡框。a.三角形有三个顶点,因此 polygon 需要传三个参数,每个参数是顶点的x和y轴位置百分比:#triangle-1{-webkit-clip-path:polygon(50%0,100%100%,0100%);clip-path:polygon(50%0,100%100%,......
  • php批量上传大文件,快速解决php大文件上传问题
    处理这个问题要先明白,多大的文件才能算是大文件?两三百M算不算大文件。所谓大小其实是一个相对值。和你所处的网络环境,处理的语言有关系。语言不必多少,网络环境嘛,如果你的上传带宽足够大,那么两三百M不算是太的的文件。当然总有一般情况,就目前普遍的带宽,对于PHP处理上百M的文件就算......
  • 软件测试|网安学院举办第二届“火焰杯”软件测试高校就业选拔赛颁奖典礼
    软件测试就业联盟主办的第二届“火焰杯”软件测试高校就业选拔赛颁奖典礼于11月25日下午在9A206报告厅举行,庄严隆重。网络空间安全学院首次参与了这一赛事,派出了6位同学参加,他们都成功入围了决赛。其中,19级软件工程2班的梁垧同学获得了决赛的三等奖,奖金为2000元,而其......
  • 软件测试|计算机科学与工程学院举行火焰杯颁奖仪式
    11月25日下午,在S楼会议室举行了"火焰杯"软件测试开发选拔赛和三江-慧科卓越工程师班暑期编程能力训练营的颁奖仪式。仪式的重要参与者包括计算机科学与工程学院的领导,刘亚军院长、叶传标副院长、曹阳副院长、吴德副院长、以及院党总支的副书记王兰英、系主任杨少雄,慧科企业代......
  • 软件测试|计算机系本科生获“火焰杯”软件测试高校就业选拔赛一等奖
    2022年12月2日,计算机系党总支书记、副系主任王琦副教授在工学院南楼551会议室为19级徐驰同学颁发第二届“火焰杯”软件测试开发选拔赛一等奖奖项,为刘烨庞助理教授颁发赛事优秀指导老师奖项。徐驰同学于2022年4月获得该赛事全国总决赛第一名,由于疫情原因,组委会未能线......
  • SaaS设备互联平台快速对接MES平台
    SaaS设备互联平台是一种基于云的设备接入及管理平台,通过私有云部署或者公有云接入可以快速实现数据的实时管理分析及预警监控管理,满足多中心、高并发的应用场景需求。企业无需额外购买服务器设备,就能轻松实现各种个性化、人性化的数据应用服务。 在MES行业中,需要解决大量数据采集......
  • 三种基本排序算法:桶排序,冒泡排序,快速排序
    第一节桶排序(最快最简单的排序)1、概括就实现申请大小为的数组为例,inta[11]。首先将所有变量初始化为0,表示还没有出现过任何数字。下面开始处理得到的数字:若存入的第一个数字是5,就将相对应的a[5]的值在原来的基础上增加1.即将a[5]的值从0改为1,表示5出现过一次。若第二个......
  • SOLIDWORKS焊件模型快速进行属性反写
    SOLIDWORKS焊件模块是一个非常好用的模块,在SOLIDWORKS中,焊件模型是一个多实体零件,但实际上每个实体都代表着一个零件,相比于装配体来说,多实体焊件模型更易于管理与修改,因此焊件功能深受广大工程师们的喜爱。使用焊件建模非常简便,只需要绘制草图,选择结构构件即可。而且焊件还带有焊......
  • 麒麟系统开发笔记(十三):在国产麒麟系统上编译OSG库、搭建基础开发环境和移植测试Demo
    前言  在国产麒麟系统上实现C++三维仿真,使用OSG技术,其他基于web的技术也是可以但是交互上鼠标拽托等交互相对差一些,所以这块需要斟酌选择到底是何种技术来取舍。  本篇在厂家指定的麒麟系统上编译OSG。 环境系统版本:银河麒麟桌面操作系统V10(SP1)(注意:不对外提供)......
  • PHP 快速实现大文件上传
    简单的上传代码最简上传代码<?phpmove_uploaded_file($_FILES["file"]["tmp_name"],$_FILES["file"]["name"])?><formaction=""method="post"enctype="multipart/form-data"><inputt......