接口测试平台代码实现88: 全局请求头-3

简介: 上节,成功搞定了请求头的增删改查。本节我们就一起来研究,在接口库调试页面,用例库步骤详情页 这俩个地方如何加入这些项目公共请求头吧。

 这里还要说一句,这个公共请求头是变量,也就是说,当我们的具体很多接口选中了某些公共请求头后,那么之后需要变化请求头具体内容,只需要在请求头设置弹层设置即可,所有的接口都是实际请求时候去调用最新的请求头。具体选中了哪些请求头的name是储存在接口表,而实际请求头的name/key/value是储存在请求头表的。

    首先打开P_apis.html 先找到我们的调试弹层代码:

微信图片_20220625154227.png

然后找到header上下文:

微信图片_20220625154244.png

注意看,我们之前是用一个ul 标签包裹着 俩个li标签,这样保证了他们在一行,第一个li标签是header的输入框,第二个标签是后面的clear按钮:

微信图片_20220625154250.png

这里我们要在它最后再新增一个按钮选择公共请求头用,所以这个input的长度要再缩短一些,新按钮直接复制上面的Clear即可。可复制:

微信图片_20220625154256.png

效果:

微信图片_20220625154304.png

到这里,我们发现另一个之前遗漏的功能,就是这俩个Clear按钮没有实现。

所以我们这里插一下,解决掉:

微信图片_20220625154311.png

一个是host,一个是header的俩个Clear按钮都加上onclick。

然后我们在下面加上这俩个小js函数:

微信图片_20220625154316.png

很简单,然后我们回归正传。


给这个公共请求头选择按钮加上onclick:

微信图片_20220625154322.png

然后下面新建这个js函数:

微信图片_20220625154328.png到这里我们要设计一下,这些header的显示效果。

我在这个位置放了一个空的li标签,并写好了id,可能厉害的同学已经猜到了,没错我要用js去控制展示效果:

微信图片_20220625154333.png

可以手动写几个demo看看效果,然后别忘了删掉:

微信图片_20220625154339.png

效果:

微信图片_20220625154344.png

这个应该是展示成多选框效果。

好了我们删除掉这三个展示用demo。

微信图片_20220625154349.png

现在我们要在进入这个页面的时候就带上所有请求头数据,所以这里要用个for循环:微信图片_20220625154354.png

效果:

微信图片_20220625154400.png

但是我们要让它默认是隐藏状态,所以加上属性display,然后在下面的展示js函数中写:微信图片_20220625154406.png

微信图片_20220625154411.png

现在是默认隐藏,点击倒三角按钮后才会出现。


然后我需要在接口表中,设置这个接口选用的请求头的id字段,(之前我设计是用name存放,后来意识到name是可重复的,所以改用更加准确的请求头id)


本节内容到此结束,下节课我们 对接口表中的请求头选中字段进行设计 功能实现。

相关文章
|
3月前
|
数据采集 机器学习/深度学习 大数据
行为检测代码(一):超详细介绍C3D架构训练+测试步骤
这篇文章详细介绍了C3D架构在行为检测领域的应用,包括训练和测试步骤,使用UCF101数据集进行演示。
87 1
行为检测代码(一):超详细介绍C3D架构训练+测试步骤
|
8天前
|
算法 Java 测试技术
使用 BenchmarkDotNet 对 .NET 代码进行性能基准测试
使用 BenchmarkDotNet 对 .NET 代码进行性能基准测试
40 13
|
18天前
|
监控 JavaScript 测试技术
postman接口测试工具详解
Postman是一个功能强大且易于使用的API测试工具。通过详细的介绍和实际示例,本文展示了Postman在API测试中的各种应用。无论是简单的请求发送,还是复杂的自动化测试和持续集成,Postman都提供了丰富的功能来满足用户的需求。希望本文能帮助您更好地理解和使用Postman,提高API测试的效率和质量。
70 11
|
2月前
|
并行计算 算法 测试技术
C语言因高效灵活被广泛应用于软件开发。本文探讨了优化C语言程序性能的策略,涵盖算法优化、代码结构优化、内存管理优化、编译器优化、数据结构优化、并行计算优化及性能测试与分析七个方面
C语言因高效灵活被广泛应用于软件开发。本文探讨了优化C语言程序性能的策略,涵盖算法优化、代码结构优化、内存管理优化、编译器优化、数据结构优化、并行计算优化及性能测试与分析七个方面,旨在通过综合策略提升程序性能,满足实际需求。
65 1
|
2月前
|
人工智能 供应链 安全
AI辅助安全测试案例某电商-供应链平台平台安全漏洞
【11月更文挑战第13天】该案例介绍了一家电商供应链平台如何利用AI技术进行全面的安全测试,包括网络、应用和数据安全层面,发现了多个潜在漏洞,并采取了有效的修复措施,提升了平台的整体安全性。
|
2月前
|
JSON Java 测试技术
SpringCloud2023实战之接口服务测试工具SpringBootTest
SpringBootTest同时集成了JUnit Jupiter、AssertJ、Hamcrest测试辅助库,使得更容易编写但愿测试代码。
70 3
|
2月前
|
监控 安全 测试技术
构建高效的精准测试平台:设计与实现指南
在软件开发过程中,精准测试是确保产品质量和性能的关键环节。一个精准的测试平台能够自动化测试流程,提高测试效率,缩短测试周期,并提供准确的测试结果。本文将分享如何设计和实现一个精准测试平台,从需求分析到技术选型,再到具体的实现步骤。
150 1
|
3月前
|
人工智能 监控 测试技术
云应用开发平台测试
云应用开发平台测试
82 2
|
2月前
|
监控 安全 测试技术
构建高效精准测试平台:设计与实现全攻略
在软件开发过程中,精准测试是确保产品质量的关键环节。一个高效、精准的测试平台能够自动化测试流程,提高测试覆盖率,缩短测试周期。本文将分享如何设计和实现一个精准测试平台,从需求分析到技术选型,再到具体的实现步骤。
71 0
|
3月前
|
JSON 算法 数据可视化
测试专项笔记(一): 通过算法能力接口返回的检测结果完成相关指标的计算(目标检测)
这篇文章是关于如何通过算法接口返回的目标检测结果来计算性能指标的笔记。它涵盖了任务描述、指标分析(包括TP、FP、FN、TN、精准率和召回率),接口处理,数据集处理,以及如何使用实用工具进行文件操作和数据可视化。文章还提供了一些Python代码示例,用于处理图像文件、转换数据格式以及计算目标检测的性能指标。
83 0
测试专项笔记(一): 通过算法能力接口返回的检测结果完成相关指标的计算(目标检测)