Loading [MathJax]/jax/output/CommonHTML/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >接口测试平台代码实现48: 自动异常测试-1

接口测试平台代码实现48: 自动异常测试-1

作者头像
我去热饭
发布于 2022-05-19 01:02:05
发布于 2022-05-19 01:02:05
55000
代码可运行
举报
文章被收录于专栏:测试开发干货测试开发干货
运行总次数:0
代码可运行

本功能属于番外,不是必须的。长度大概3章节。难度不高,也算给大家休息一下。

这个功能是什么意思呢?简单点说,就是一个接口保存好之后,你保存的请求数据都是正常的。但是错误的用例也就是无效等价类中,具体参数格式不同的要怎么测呢?正常来说有以下几种类型:整形,字符串,单字符,超长字符串,为空,全空格,有中文,纯英文,含标点符号,数组,sql注入,不符合需求规则的 等等等等。一个超全面的接口测试,几乎要把所有参数都依次替换成这些不同的格式来请求,看看是否会引起服务器报错甚至更加严重的后果。

当我们用手工来测试的时候,这几乎是不可能办到的事,举个例子,假如接口有10个字段,要替换的各种不同格式测试数据是20个,那么你一共要测试10 * 20 = 200个测试用例。但是真的有人这么测么?现实中基本没有。原因就在于这个成本太高了,性价比极低。

在我们传统的测试理论-11种用例设计方法中,哪怕一个简单的功能都可能要写出几百条甚至上千条用例,如果真的可以实现如此全面的覆盖,理论上没有bug会遗漏了。但是实际中无法做到真正覆盖的根本原因在于国内的高节奏敏捷迭代的大环境,这种工匠精神,细细打磨的事注定做不起来。不过技术是不断发展的,高成本的痛点早晚会被技术所解决,测试同学们也不要指望着说国内it行业的那么多大神总会有人来解决,因为他们的精力被放在了更加重要的事上,这个行业只能靠我们自己想办法了。

我在之后的各种章节中,会有意无意的讲解这些降低成本的新解决方案。

比如这个接口异常自动测试功能,我们的做法其实就是用代码简单的进行依次替换,比如10个字段,我们用20个测试数据依次替换的时候,其他9个字段保持用户保存在接口库中的正确值。然后请求20次,每次的结果如果出现问题,那么很显然极大概率就是这个字段的问题。这也是集成测试的半个思想。

那么为什么要做这个非必须的功能呢?因为我们做的好歹也是个接口测试平台,那就要有平台的样子,各种新工具,新设计 只要业务有帮助,我们就上。在系列一开始的时候就说过,我们做的是平台,所以不要去和postman这种cs单机工具去比,也不要和jmeter去比性能测试,也不要和charles/fiddler去比抓包,也不要和jenkins去比监控,我们的优势和特点是:多人协作,历史保存,约束流程,符合公司内的小工具和设计,接口管理等一系列的综合体。比如这个自动异常测试功能,就是其他工具不具备的。我们之后还会讲许多这种新的技术功能。

好,现在我们打开P_apis.html,找到异常测试的按钮,给它加上onclick,

函数名我们就叫做error_test,传入接口id做为参数。

我们在下面找个风水好的地方,声明这个函数:

不要着急写,我们先考虑一下,我们测试完之后,这个巨量的测试结果要显示在哪?肯定应该有个div来承载这些返回值,所以我们先写好这个div:

这个新div的id我叫做error_div,style属性呢直接复制调试层的div即可:

这个div默认同样也是隐藏的,在我们的js函数error_test中,我们给div变成显示状态即可。

如图,我们现在要考虑一些事情:

  1. 这么巨大的返回值量,一次请求基本是不可能把请求体返回来的。比如有100次请求,我们最好是发送100次请求,每次只获取一个返回值,依次显示到这个div里,所以我们是先把div给显示出来,再循环发送100次请求,每次得到返回值,都展示在这个div中即可。
  2. 那我们可以先做好前端的样式,先展示一次请求的返回值展示的demo看看。然后再在js中让其自动生成所有次请求的展示效果。

div中我们如下设计:

如上图,我手动写了三段请求的展示效果,然后我们看看如何:

貌似还不错,那让我们接下来继续开发吧..

因为我们每次发送请求,传给后台的参数都是替换后的,这就意味着我们要在前端js里处理 复杂的替换功能:

我们可以先只完成这个复杂的替换代码,不真的去请求后台。

我们在一开始传入这个js的参数中只有接口id,当我们进行n次请求时,后台是可以根据这个id来拿到接口的一切数据的,但是我们要测的是真实是不同的请求体,所以我们现在还需要原始的请求体,原始的请求体配合上 要替换的测试数据,才能组装成最新的请求体 。然后和接口id一起给到后台。

那么在我们调用这个js函数的onclick里,加上原始请求体吧:

这里要进行注意的是,这个单双引号,千万别加错了!

同样js函数也要加上:

现在我们还缺少什么呢?就是要替换的数据何在?

我们的设计是给出默认的,用户还可以根据需要自行修改。所以存放的应该是一个可修改的input框。

在我们的div中加上这个输入框吧:

我们给它写上预置的几个值:

注意我们前面忘记增加了文案颜色为黑色的属性设置,这里补上了:

看看效果:

可复制的源码如下:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
{# 异常值测试 #}
<div id="error_div" style="display: none;border-radius:5px;width: 80%;
position: absolute;left: 10%;top: 10%;background-color: #3c4043;box-shadow: 4px 4px 8px grey;
color: white;padding-left: 10px;">
    <h4>接口:<small id="error_api_name"></small> 的异常值测试结果如下:</h4>
    <strong>待替换数据:(用英文逗号隔开)</strong>
    <input id="ready_error_data" type="text" style="color: black;border-radius: 5px;width: 99%"
    value="'a',123,'',' ','./?*&^','中文'"
    > <br><br>
    
    <span>替换:username -> 123</span>
    <textarea style="width: 99%;height: 50px;border-radius: 5px;color: black">
    </textarea>

    <span>替换:username -> "aaa"</span>
    <textarea style="width: 99%;height: 50px;border-radius: 5px;color: black">
    </textarea>

    <span>替换:username -> "哈哈哈"</span>
    <textarea style="width: 99%;height: 50px;border-radius: 5px;color: black">
    </textarea>

</div>

好,到这为止。今天的前端样式算是完成了。

大家可以自行稍微修饰优化。明天继续本功能实现

本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2020-09-18,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 测试开发干货 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
公网可用的RTMP和RTSP测试地址(更新于2021年3月)
好多博客提到的公网可测试的RTSP和RTMP URL大多都不用了,以下是大牛直播SDK(Github)于2021年3月亲测可用的几个URL,有其他可用的URL,也欢迎大家在评论区回复。
音视频牛哥
2021/03/16
27.6K0
rtmp/rtsp/hls公网真正可用的测试地址
相信大家在调试播放器的时候,都有这样的困惑,很难找到合适的公有测试源,以下是大牛直播SDK(GitHub地址)整理的真正可用的直播地址源。
全栈程序员站长
2022/08/25
22.9K1
rtmp/rtsp/hls公网真正可用的测试地址
海康威视rtsp取流地址(海康威视设置教程)
本文目的主要是想要实时显示海康威视的摄像头数据,笔者尝试了如下几种方式(部分未做完):
全栈程序员站长
2022/08/01
23.9K0
海康威视rtsp取流地址(海康威视设置教程)
轻松实现在web页面中直接播放rtsp视频流「建议收藏」
我之前研究在 web 中直接播放 rtsp 视频流时,写过一篇文章:【前端】rtsp 与 rtmp 视频流的播放方法。阅读这篇文章对你的学习有很大帮助。在文章中我有过详细的分析和解读,并给出了 结论:
全栈程序员站长
2022/11/07
9.3K1
轻松实现在web页面中直接播放rtsp视频流「建议收藏」
Nginx+FFmpeg打造自己的视频直播服务
现在很多项目都有视频实时播放的功能需求,例如监控,直播等,原始的摄像头采集的视频流协议一般都是 rtsp 协议,在旧版的浏览器中使用
ruochen
2021/11/24
6.2K0
rtsp 获取视频流 java_OpenCV – 如何捕获rtsp视频流
例如,我们有工作rtsp流测试像:“rtsp://184.72.239.149/vod/mp4:BigBuckBunny_115k.mov”(它在发布这篇文章的时候工作)
全栈程序员站长
2022/11/02
2.7K0
用猿大师VLC播放程序在高版本Chrome浏览器中播放海康、大华RTSP(图文教程)
近期在做一个智慧城市项目,要求将海康威视、大华等摄像头RTSP视频流在Chrome、Firefox、Edge等浏览器中播放,并且要求延迟必须要低,能到多低就多低,最好是实时视频。
喵大侠
2021/10/11
2.1K0
用猿大师VLC播放程序在高版本Chrome浏览器中播放海康、大华RTSP(图文教程)
完全依赖QML实现播放器
一直听闻QML无比强大好用,工作中需要扣一个同时播放视频的Demo,所以就趁这个机会研究了一下。
gongluck
2020/03/05
2.3K0
完全依赖QML实现播放器
API网关是否真的起到了它该有的作用?
点击上方蓝色“程序猿DD”,选择“设为星标” 回复“资源”获取独家整理的学习资料! 以下内容来源 https://www.jianshu.com/p/9fab0982c6bb,部分内容稍做修改 最近看到一篇翻译一篇API网关的文章,介绍了其三种角色:API管理、集群入口控制、API网关模式,最后还讲了与服务网格的关系,通过此文可以更全面的理解API网关的作用。 原文 API Gateways are going through an identity crisis (地址如下:https://mediu
程序猿DD
2023/04/04
4050
API网关是否真的起到了它该有的作用?
网页播放rtsp视频流
GitHub – vbence/stream-m: An HTML5-compatible live streaming server supporting the WebM and H.264 formats.
全栈程序员站长
2022/11/02
2.9K0
nodejs 框架排名
第一名: express 50.4k (2010年1月发布) 目前star 和下载量最高的老牌框架。
ruochen
2021/12/07
2.7K0
SDP在RTSP、国标GB28181、WebRTC中的实践
注意的是SDP虽然具备这些能力参数信息的描述功能,但是SDP并不是传输协议,需要用RTSP、SIP、HTTP等协议进行承载传输、交换,如果大家协调好了之后,就可以建立会话,完成真实的音视频码流传输,再完成解码和播放。
潇湘落木
2020/11/12
2.2K0
SDP在RTSP、国标GB28181、WebRTC中的实践
datax_web环境搭建
https://github.com/alibaba/DataX/blob/master/introduction.mdgithub.com
ruochen
2021/11/21
1.1K0
生产环境下的Node.js
Node应用指标监控看板显示了运行中的Node.js应用程序的性能数据。这是一个简单的模块,在Node.js入口文件的顶部应用并初始化。你可以通过在终端中运行以下命令从npm安装。
花落花相惜
2021/11/26
1.9K0
流媒体服务器如何在浏览器播放RTSP格式的视频流?
一般海康威视摄像头的视频流采用的RTSP协议的视频流,但是html5支持的是RTMP,所以RTSP协议的视频流无法直接在web页面上面显示。我们的EasyNVR流媒体服务器是支持RTSP协议和RTMP协议输出的视频流,下面我们来看一下流媒体服务器如何在浏览器播放RTSP格式的视频流。
EasyNVR
2020/04/23
2K0
流媒体服务器如何在浏览器播放RTSP格式的视频流?
深入了解Webpack
本质上,有两种构建JavaScript应用程序的模式:开发和生产。以前,您已使用开发模式在本地开发环境中开始使用Webpack Dev
ruochen
2021/11/26
7.3K0
html播放rtsp流,浏览器播放rtsp视频流解决方案
最近项目中需要实时播放摄像头rtsp视频流,于是就专门做了些研究。而浏览器不能直接播放,只有通过插件或者转码来实现这个需求。
全栈程序员站长
2022/11/02
6.6K0
抓取视频网站的流媒体数据
打开VLC,点击媒体 -> 打开网络串流,添加网络流媒体链接: rtsp://wowzaec2demo.streamlock.net/vod/mp4:BigBuckBunny_115k.mp4
AnieaLanie
2021/12/30
3.6K0
webrtc-streamer-v0.7.1-dirty-Windows-AMD64-Release 下载
1、把压缩包html文件夹下的webrtcstreamer.js文件和html/libs文件夹下adapter.min.js文件复制到VUE项目public目录下
收心
2024/07/24
7950
react-native修改第三方包
社区提供了一个工具:[patch- package](https://links.jianshu.com/go?to=https%3A%2F%2Fgithub.com%2Fds300%2Fpatch-
ruochen
2021/12/01
1.1K0
推荐阅读
相关推荐
公网可用的RTMP和RTSP测试地址(更新于2021年3月)
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验