CN113220584A - 页面测试方法、装置、计算机设备和可读存储介质 - Google Patents

Abstract

本申请提供一种页面测试方法、装置、计算机设备和可读存储介质，其中，该方法包括：响应于前端页面发送接口数据请求至服务器端，利用预设抓包工具，抓取接口数据请求，根据接口数据请求，获取接口返回数据，利用预设抓包工具，将接口返回数据反馈至前端页面。该技术方案中，通过预先设置的抓包工具，抓取前端页面发送至服务器端的接口数据请求，并利用抓取的接口数据请求，反馈对应的接口返回数据至前端页面，使得当服务器端的接口出现异常时，前端页面仍然能够利用接口返回数据进行页面测试，避免整个测试过程受服务器端的影响，提高测试效率。

Description

页面测试方法、装置、计算机设备和可读存储介质

技术领域

本申请涉及软件测试技术领域，尤其涉及一种页面测试方法、装置、计算机设备和可读存储介质。

背景技术

在全球广域网(World Wide Web，WEB)系统技术架构领域，后台的服务器端与前端的页面端是互相分离的，开发人员可以并行开发服务器端的接口和前端的页面端，以缩短开发周期，当开发完成之后的需要对页面端进行测试，确定开发后页面端是否存在有异常问题。

现有技术中，在测试人员进行测试时，主要是直接利用页面端发送接口数据请求至服务器端的接口，然后由接口返回接口数据至页面端，测试人员根据返回的接口数据，执行测试用例，测试前端页面是否存在有异常，得到测试结果。

但是，现有技术的这种测试方式，当服务器端的接口出现故障或者堵塞时，此时服务器端的接口无法再返回接口数据给页面端，使得测试人员无法及时的进行后续的测试步骤，只能够等待开发人员修复接口之后才能够重新开始测试，导致测试效率降低。

发明内容

本申请提供一种页面测试方法、装置、计算机设备和可读存储介质，用于解决现有的前端页面测试效率低的问题。

第一方面，本申请实施例提供一种页面测试方法，应用于测试设备，所述测试设备设置有预设抓包工具，所述方法包括：

响应于前端页面发送接口数据请求至服务器端，利用所述预设抓包工具，获取所述接口数据请求，所述接口数据请求用于所述前端页面从所述服务器端的目标接口请求得到接口数据；

根据所述接口数据请求，获取接口返回数据，所述接口返回数据用于所述前端页面进行页面测试；

利用所述预设抓包工具，将所述接口返回数据反馈至所述前端页面。

在第一方面的一种可能设计中，所述利用所述预设抓包工具，抓取所述接口数据请求，包括：

获取所述目标接口的服务状态，所述服务状态用于指示所述目标接口是否出现异常；

若所述目标接口出现异常，则利用所述预设抓包工具，抓取所述接口数据请求。

在第一方面的另一种可能设计中，所述根据所述接口数据请求，获取接口返回数据，包括：

若所述目标接口未出现异常，则将所述预设抓包工具抓取的接口数据请求发送至所述服务器端的目标接口；

利用所述预设抓包工具，从所述服务器端的目标接口获取所述接口数据，作为所述接口返回数据。

在第一方面的再一种可能设计中，所述根据所述接口数据请求，获取接口返回数据，包括：

若所述目标接口出现异常，则根据所述预设抓包工具抓取的接口数据请求，从预设数据库中选取与所述接口数据请求匹配的模拟接口数据，作为所述接口返回数据。

在第一方面的又一种可能设计中，所述获取所述目标接口的服务状态，包括：

在前端页面发送接口数据请求至服务器端时，获取所述服务器端的目标接口反馈至所述前端页面的反馈信息；

根据所述反馈信息，确定所述服务器端的目标接口的服务状态。

在第一方面的又一种可能设计中，所述根据所述接口数据请求，获取接口返回数据，包括：

根据所述接口数据请求，获取所述前端页面进行页面测试的测试内容；

根据所述测试内容，从预设数据库中选取对应的预设测试用例，作为所述接口返回数据。

在第一方面的又一种可能设计中，所述测试内容包括页面控件样式测试和页面校验规则测试，所述根据所述测试内容，从预设数据库中选取对应的预设测试用例，作为所述接口返回数据，包括：

若所述测试内容为页面控件样式测试，则从预设数据库中选取预设样式测试用例，作为所述接口返回数据；

若所述测试内容为页面校验规则测试，则从预设数据库中选取预设安全测试用例，作为所述接口返回数据。

在第一方面的又一种可能设计中，所述根据所述测试内容，从预设数据库中选取对应的预设测试用例，作为所述接口返回数据之前，还包括：

获取所述前端页面中页面控件的字符类型和字符长度，根据所述字符类型和字符长度，构造所述预设样式测试用例；

将所述预设样式测试用例存储至所述预设数据库中。

在第一方面的又一种可能设计中，所述根据所述测试内容，从预设数据库中选取对应的预设测试用例，作为所述接口返回数据之前，还包括：

获取跨站脚本，根据所述跨站脚本，构造得到所述预设安全测试用例；

将所述预设安全测试用例存储至所述预设数据库中。

在第一方面的又一种可能设计中，所述利用所述预设抓包工具，将所述接口返回数据反馈至所述前端页面之后，还包括：

根据所述接口返回数据，获取测试用例；

根据所述测试用例，对所述前端页面进行页面测试，得到测试结果，所述测试结果包括前端页面展示样式是否异常和/或前端页面数据校验测试结果。

在第一方面的又一种可能设计中，所述预设抓包工具为Fiddler超文本传输协议调试抓包工具。

第二方面，本申请实施例提供一种软件测试装置，包括：

抓取模块，用于响应于前端页面发送接口数据请求至服务器端，利用所述预设抓包工具，获取所述接口数据请求，所述接口数据请求用于所述前端页面从所述服务器端的目标接口请求得到接口数据；

获取模块，用于根据所述接口数据请求，获取接口返回数据，所述接口返回数据用于所述前端页面进行页面测试；

反馈模块，用于利用所述预设抓包工具，将所述接口返回数据反馈至所述前端页面。

第三方面，本申请实施例提供一种计算机设备，包括存储器和至少一个处理器；

所述存储器存储计算机执行指令；

所述至少一个处理器执行所述存储器存储的计算机执行指令，使得所述至少一个处理器执行如上述的方法。

第四方面，本申请实施例提供一种可读存储介质，所述可读存储介质中存储有计算机指令，所述计算机指令被处理器执行时用于实现如上述的方法。

第五方面，本申请实施例提供一种计算机程序产品，包括计算机程序/指令，该计算机程序/指令被处理器执行时实现上述的方法。

本申请实施例提供的页面测试方法、装置、计算机设备和可读存储介质，通过预先设置的抓包工具，抓取前端页面发送至服务器端的接口数据请求，并利用抓取的接口数据请求，反馈对应的接口返回数据至前端页面，使得当服务器端的接口出现异常时，前端页面仍然能够利用接口返回数据进行页面测试，避免整个测试过程受服务器端的影响，提高测试效率。

附图说明

此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本申请的实施例，并与说明书一起用于解释本申请的原理；

图1为本申请实施例提供的页面测试方法的场景示意图；

图2为本申请实施例提供的前端页面的示意图；

图3为本申请实施例提供的页面测试方法实施例一的流程示意图；

图4为本申请实施例提供的页面测试方法实施例二的流程示意图；

图5为本申请实施例提供的页面测试方法实施例三的流程示意图；

图6为本申请实施例提供的页面测试装置的结构示意图；

图7为本申请实施例提供的计算机设备的示意框图。

通过上述附图，已示出本申请明确的实施例，后文中将有更详细的描述。这些附图和文字描述并不是为了通过任何方式限制本申请构思的范围，而是通过参考特定实施例为本领域技术人员说明本申请的概念。

具体实施方式

为使本申请实施例的目的、技术方案和优点更加清楚，下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本申请一部分实施例，而不是全部的实施例。基于本申请中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本申请保护的范围。

首先对本申请所涉及的名词进行解释：

HTTP：

超文本传输协议(Hypertext Transfer Protocol，HTTP)，是一个请求-响应协议，它指定了客户端可能发送给服务器什么样的消息以及得到服务器什么样的响应。

fiddler：

Fiddler是一个http协议调试代理工具，它能够记录并检查所有计算机和互联网之间的HTTP通讯，查看所有的数据。

图1为本申请实施例提供的页面测试方法的场景示意图，如图1所示，计算机11中可以设置有浏览器等客户端，浏览器中所显示的网页可以称为前端页面，浏览器通过网络与服务器端12进行数据通信，发送数据请求至服务器端12，由服务器端12返回接口数据至浏览器，浏览器根据返回的接口数据，进行页面渲染，最终在计算机11上展示出前端页面，供用户查阅。

示例性的，图2为本申请实施例提供的前端页面的示意图，如图2所示，前端页面21中可以包括有文本输入框，具体可以是用户名输入框和密码输入框，以及登录按钮，在开发人员完成前端页面的开发之后，测试人员可以对输入框的一些规则进行校验，例如在输入框未输入任何信息的情况下，应当提示输入不能为空，若输入框能够校验成功，则测试通过，否则，测试不通过。

在实际生活应用中，在全球广域网(World Wide Web，WEB)系统技术架构领域，普遍采用服务器端和页面端分离的实现技术，服务器端的接口开发和前端的页面开发同时并行，两者在开发完成之后，需要测试人员来进行测试，现有技术中，测试人员一般采用通过页面端进行测试，测试的方法多为黑盒测试方法，在测试人员对前端页面进行测试时，前端页面需要依赖于服务器端12返回的接口数据，即前端页面需要向服务器端12的配置接口(例如订单查询的接口)请求数据，由该配置接口返回接口数据给前端页面，这样前端页面才能够去渲染这些数据，测试人员后续才能够执行测试用例，进行测试，如果这个配置接口出现了异常，例如出现了堵塞，无法返回接口数据，此时测试人员将无法继续进行测试，导致测试任务无法及时的完成，使得测试效率下降。同时，在测试的过程中，前端页面控件会对输入或者展示的元素进行限制，页面样式的特殊情况覆盖不全面，对脚本注入类的安全问题也难以测试，造成测试覆盖率不高的问题。

针对上述问题，本申请实施例提供了一种页面测试方法、装置、计算机设备和可读存储介质，通过利用预设抓包工具抓取前端页面与服务器端之间的交互数据，在测试人员测试前端页面时，若遇到服务器端接口发生阻塞等异常情况，可以通过预设抓包工具抓取前端页面的接口数据请求，并模拟服务器端的接口返回数据，反馈至前端页面，使页面的测试流程可以继续进行，从而提高了测试效率。同时，通过预设抓包工具模拟服务器端发出的接口数据，可以进行对前端页面数据校验测试，降低出现安全或者样式类问题的概率，提高测试覆盖率

下面，通过具体实施例对本申请的技术方案进行详细说明。需要说明的是，下面这几个具体的实施例可以相互结合，对于相同或相似的概念或过程可能在某些实施例中不再赘述。

图3为本申请实施例提供的页面测试方法实施例一的流程示意图，该页面测试方法可以应用于测试设备，该测试设备中设置有预设抓包工具，示例性的，该测试设备可以是计算机。如图3所示，该页面测试方法包括如下步骤：

S301、响应于前端页面发送接口数据请求至服务器端，利用预设抓包工具，获取接口数据请求。

其中，接口数据请求用于前端页面从服务器端的目标接口请求得到接口数据。示例性的，目标接口可以是订单查询接口，前端页面通过接口数据请求，可以从该订单查询接口请求得到订单数据，前端页面可以渲染出该订单数据。

在本实施例中，测试设备中设置有预设抓包工具，还可以设置浏览器等应用软件，测试人员在对浏览器的前端页面进行测试时，可以通过前端页面发送接口请求数据至服务器端。

示例性的，预设抓包工具可以在检测到前端页面与服务器端进行数据交互时，抓取前端页面发送至服务器端的接口请求数据，以及抓取服务器端返回至前端页面的接口数据。

示例性的，预设抓包工具可以是fiddler超文本传输协议调试抓包工具。

示例性的，在前端页面发送接口数据请求至服务器端之前，可以先编辑需要测试的HTTP/HTTPS接口信息，其中，接口信息主要包括接口的输入参数和接口的输出参数。

S302、根据接口数据请求，获取接口返回数据。

其中，接口返回数据用于前端页面进行页面测试。

示例性的，若目标接口为订单查询接口，则该订单查询接口可以根据前端页面发出的订单查询请求，返回订单数据至前端页面，示例性的，接口返回数据可以是上述的订单数据。

可选的，接口返回数据可以是目标接口根据前端页面发送的接口数据请求，返回至前端页面的，也可以是测试设备中预先存储的模拟数据，用于在目标接口出现异常，无法返回接口数据时，由预设抓包工具将该预先存储的模拟数据返回至前端页面。

示例性的，在目标接口没有出现异常时，预设抓包工具可以直接从目标接口抓取接口数据，作为接口返回数据，在目标接口出现异常时，预设抓包工具可以利用之前抓取的接口数据请求，从测试设备的存储介质中获取模拟数据，作为接口返回数据。

示例性的，目标接口出现异常可以是指目标接口由于接口访问请求数过大，而出现的阻塞，或者目标接口在开发过程中存在有补丁，导致无法返回接口数据至前端页面等情况。

S303、利用预设抓包工具，将接口返回数据反馈至前端页面。

在本实施例中，预设抓包工具可以作为前端页面与服务器端之间的代理方，预设抓包工具可以抓取前端页面发送至服务器端的接口数据请求，也可以抓取服务器端返回给前端页面的接口数据，并将抓取的接口数据返回给前端页面。

本申请实施例通过使用抓包工具，抓取前端页面发送至服务器端的接口数据请求，利用抓取的接口数据请求，反馈对应的接口返回数据至前端页面，使得在服务器端出现异常时，依然能够由抓包工具模拟服务器端的接口返回数据，使得前端页面能够继续依赖抓包工具返回的接口返回数据，完成后续的测试流程，避免受服务器端的影响，提高测试效率。

示例性的，在上述实施例的基础上，在一些实施例中，上述步骤S301中“利用预设抓包工具，获取接口数据请求”，具体可以通过如下步骤实现：

获取目标接口的服务状态。

若目标接口出现异常，则利用预设抓包工具，抓取接口数据请求。

其中，服务状态用于指示目标接口是否出现异常。示例性的，目标接口的服务状态包括异常状态和非异常状态，示例性的，当目标接口存在有补丁时，该目标接口无法向前端页面返回接口数据，此时，目标接口可以判定为处于异常状态。

在本实施例中，当前端页面发送接口数据请求至服务器端时，目标接口若出现异常，则会返回错误代码至前端页面，此错误代码可以用于指示目标接口当前出现异常的原因。

本申请实施例通过获取前端页面的目标接口的服务状态，在目标接口出现异常时，能够利用预设抓包工具来抓取前端页面发送至目标接口的接口数据请求，以使得预设抓包工具能够在后续反馈接口返回数据至前端页面，避免前端页面向出现异常的目标接口发起无效请求，提高测试效率。

示例性的，在上述实施例的基础上，在一些实施例中，上述步骤S202具体可以通过如下步骤实现：

若目标接口未出现异常，则将预设抓包工具抓取的接口数据请求发送至服务器端的目标接口；

利用预设抓包工具，从服务器端的目标接口获取接口数据，作为接口返回数据。

在本实施例中，当目标接口未出现异常时，目标接口可以根据前端页面发送的接口数据请求反馈接口数据，预设抓包工具可以抓取服务器端的目标接口反馈的接口数据，作为接口返回数据，反馈给前端页面。

本申请实施例通过判定服务器端的目标接口是否出现异常，使得在目标接口未出现异常的情况下，能够正常的反馈出接口数据，并由预设抓包工具抓取，返回至前端页面，使得目标接口无论出现异常或未出现异常，都能够正常的进行测试，提高测试效率。

可选的，在上述实施例的基础上，在一些实施例中，上述步骤S202具体可以通过如下步骤实现：

若目标接口出现异常，则根据预设抓包工具抓取的接口数据请求，从预设数据库中选取与接口数据请求匹配的模拟接口数据，作为接口返回数据。

在本实施例中，预设数据库可以设置在测试设备的存储介质中，测试人员可以预先将模拟接口数据存储在预设数据库中。示例性的，模拟接口数据与接口数据请求之间存在有一一对应关系，测试设备通过该对应关系，从预设数据库中进行查找。

示例性的，若接口数据请求为前端页面向服务器端的订单查询接口请求订单数据，则在订单查询接口出现异常，无法反馈订单数据时，可以从预设数据库中选取测试人员预先存储的模拟订单数据，作为模拟接口数据。

本申请实施例通过在预设数据库中存放模拟接口数据，能够模拟目标接口返回的接口数据，使得在目标接口出现异常时，能够利用预设抓包工具将预设数据库中的模拟接口数据反馈给前端页面，使得后续的测试流程能够继续进行，避免目标接口异常的情况时无法反馈接口数据，造成后续测试无法进行，提高测试效率。

示例性的，在上述实施例的基础上，在一些实施例中，上述“获取目标接口的服务状态”，具体可以通过如下步骤实现：

在前端页面发送接口数据请求至服务器端时，获取服务器端的目标接口反馈至前端页面的反馈信息；

根据反馈信息，确定服务器端的目标接口的服务状态。

具体的，反馈信息可以是接口数据或者异常信息。示例性的，当服务器端的目标接口出现异常时，若此时前端页面发送接口数据请求至服务器端，则目标接口会反馈相应的异常信息，例如错误代码至前端页面，从而判定出服务器端的目标接口出现异常。

当服务器端的目标接口未出现异常时，若前端页面发送接口数据请求至服务器端，则目标接口会反馈接口数据至前端页面，测试设备通过校验反馈信息是接口数据或者异常信息，从而可以确定目标接口当前是否出现异常。

本申请实施例通过向服务器端的目标接口发起请求，当目标接口出现异常时，其反馈回来的反馈信息中会包含错误代码，以提示前端页面当前的目标接口出现异常，从而能够及时的通知预设抓包工具，反馈模拟接口数据至前端页面，使得前端页面能够依赖反馈的模拟接口数据，完成后续测试流程。

可选的，在上述实施例的基础上，在一些实施例中，上述步骤S202具体可以通过如下步骤实现：

根据接口数据请求，获取前端页面进行页面测试的测试内容；

根据测试内容，从预设数据库中选取对应的预设测试用例，作为接口返回数据。

具体的，通过预设抓包工具抓取接口数据请求之后，可以确定出前端页面所请求的数据，根据该数据即可以确定出前端页面进行的测试内容。

示例性的，在测试人员测试前端页面时，测试内容可以包括测试前端页面控件的样式和页面校验规则。

在本实施例中，预设测试用例中包括有期望结果和需求文档，示例性的，需求文档可以用于指示前端页面支持的字符长度为5，若传入至前端界面的字符长度为10，则期望结果为错误，前端页面应当提示报错，若传入至前端界面的字符长度为5，则期望结果为正常，前端页面应当能够正常的展示输入的字符。

示例性的，前端页面控件可以是按钮、输入区和选择框等。

本申请实施例通过抓取前端页面发送的接口数据请求，能够确定所需要进行的测试内容，并由预设抓包工具返回对应的测试用例，能够对前端页面进行不同类型的测试，提高测试覆盖率。

示例性的，在上述实施例的基础上，在一些实施例中，若测试内容包括页面控件样式测试和页面校验规则测试，则上述“根据测试内容，从预设数据库中选取对应的预设测试用例，作为接口返回数据”，具体可以通过如下步骤实现：

若测试内容为页面控件样式测试，则从预设数据库中选取预设样式测试用例，作为接口返回数据；

若测试内容为页面校验规则测试，则从预设数据库中选取预设安全测试用例，作为接口返回数据。

具体的，预设样式测试用例用于测试前端页面展示样式是否出现异常，预设安全测试用例用于测试前端页面中涉及到用户信息的模块是否能够正常工作，示例性的，预设安全测试用例可以测试用户前端页面登录成功之后，用户名和密码是否通过加密的方式给web服务器端。还可以测试用户名和密码的输入框是否禁止输入脚本。还可以测试用户在前端页面登录时，登录错误的次数限制等等。

在本实施例中，根据所需要进行的测试内容，从预设数据库中选取出对应的测试用例，返回给前端页面，以对前端页面进行测试。

本申请实施例通过反馈预设样式测试用例至前端页面，能够测试前端页面展示样式是否出现异常，通过反馈预设安全测试用例至前端页面，能够测试前端页面是否存在安全漏洞，提高测试效果，降低前端页面出现安全或者样式类问题的概率，提高测试覆盖率。

示例性的，在上述实施例的基础上，在一些实施例中，上述页面测试方法还可以包括如下步骤：

获取前端页面中页面控件的字符类型和字符长度，根据字符类型和字符长度，构造预设样式测试用例；

将预设样式测试用例存储至预设数据库中。

在本实施例中，测试人员可以输入前端页面中页面控件所支持的字符类型和字符长度至测试设备，示例性的，字符类型可以是数值类型或者字符串类型，字符长度可以为5或者10。

示例性的，预设数据库可以是测试设备中的存储介质，例如存储器等。

本申请实施例通过配置预设样式测试用例中的字符类型和字符长度，能够测试前端页面中页面控件是否有异常情况，提高测试覆盖率。

示例性的，在上述实施例的基础上，在一些实施例中，上述页面测试方法还可以包括如下步骤：

获取跨站脚本，根据跨站脚本，构造得到预设安全测试用例；

将预设安全测试用例存储至预设数据库中。

具体的，跨站脚本(Cross Site Script，XSS)指的是指攻击者在网页中嵌入客户端脚本，当用户浏览此网页时，脚本就会在用户的浏览器上执行，从而达到攻击者的目的，比如导航到恶意网站，携带木马等。

在本实施例中，测试人员可以输入XSS脚本至测试设备，构造得到安全测试用例，并存储预设数据库中，当需要进行安全测试时，通过预设抓包工具，将安全测试用例返回给前端页面，使得在前端页面的某一些输入数据的地方(例如前端页面的文本框)，能够输入这些XSS脚本，若前端页面有弹出对话框等，则说明开发人员开发的前端页面存在XSS漏洞，从而达到测试的目的。

本申请实施例通过配置跨站脚本至预设安全测试用例中，能够测试前端页面是否存在有安全漏洞，提高测试覆盖率。

示例性的，在上述实施例的基础上，在一些实施例中，上述页面测试方法还包括如下步骤：

根据接口返回数据，获取测试用例；

根据测试用例，对前端页面进行页面测试，得到测试结果。

其中，测试结果包括前端页面展示样式是否异常和/或前端页面数据校验测试结果。

示例性的，预设抓包工具反馈至前端页面的接口返回数据中可以包含测试用例，例如上述的预设样式测试用例和预设安全测试用例。

图4为本申请实施例提供的页面测试方法实施例二的流程示意图，该页面测试方法涉及客户端的前端页面、WEB服务器端和预设抓包工具，其中，客户端和预设抓包工具可以设置在计算机设备中，示例性的，在本实施例中，该预设抓包工具为fiddler超文本传输协议调试抓包工具。

示例性的，如图4所示，该页面测试方法包括如下步骤：

S401、前端页面发送接口数据请求至WEB服务器。

具体的，在WEB服务器的接口没有出现异常情况时，前端页面可以正常的发送接口数据请求给WEB服务器，请求WEB服务器返回接口数据给前端页面。

S402、判断WEB服务器接口是否出现异常。

具体的，可以通过WEB服务器接口返回的错误代码，判定WEB服务器出现异常，例如WEB服务器返回错误代码500至前端页面，则表征WEB服务接口出现异常。

S403、若WEB服务器未出现异常，则WEB服务器返回接口数据至前端页面。

S405、若WEB服务器出现异常，则利用fiddler超文本传输协议调试抓包工具抓取接口数据请求，并返回模拟接口数据至前端页面。

具体的，模拟接口数据可以是测试人员预先存储在测试设备中的，例如若接口数据请求用于请求订单查询接口的订单数据，当订单查询接口出现异常，无法返回订单数据时，则从存储设备中查询出测试人员预先存储的模拟数据，作为订单数据，反馈至前端页面。

图5为本申请实施例提供的页面测试方法实施例三的流程示意图，如图5所示，该测试方法涉及客户端的前端页面和预设抓包工具，其中，客户端和预设抓包工具可以设置在计算机设备中。示例性的，在本实施例中，该预设抓包工具为fiddler超文本传输协议调试抓包工具。

示例性的，如图5所示，该页面测试方法包括如下步骤：

S501、抓取接口数据请求。

具体的，当前端页面发送接口数据请求至服务器端时，可以由抓包工具作为代理层，抓取到前端页面发送的接口数据请求。

S502、构造测试用例。

示例性的，可以根据测试类型，构建不同类型的测试用例，例如安全测试用例和样式测试用例等。

S503、返回测试用例。

具体的，抓包工具将测试用例返回给前端页面，以使得前端页面能够进行页面测试。

综上述，本申请实施例在测试前端页面时，若遇到服务器端接口发生阻塞等异常情况，可以通过Fiddler工具抓取网络交互数据，并模拟服务器端的接口返回数据，使页面测试流程可以继续进行，从而提高了测试效率。同时，通过Fiddler工具模拟服务器端发出的接口数据，可以进行对前端页面数据校验测试，降低出现安全或者样式类问题的概率，提高测试覆盖率。

下述为本申请装置实施例，可以用于执行本申请方法实施例。对于本申请装置实施例中未披露的细节，请参照本申请方法实施例。

图6为本申请实施例提供的页面测试装置的结构示意图，该页面测试装置60包括抓取模块61、获取模块62和反馈模块63。其中，该页面测试装置60可以集成在计算机设备中，也可以独立于计算机设备并与计算机设备协同完成本申请方案。

其中，抓取模块61，用于响应于前端页面发送接口数据请求至服务器端，利用预设抓包工具，获取接口数据请求。获取模块62，用于根据接口数据请求，获取接口返回数据，接口返回数据用于前端页面进行页面测试。反馈模块63，用于利用预设抓包工具，将接口返回数据反馈至前端页面。

其中，接口数据请求用于前端页面从服务器端的目标接口请求得到接口数据。

在一些实施例中，上述抓取模块61，具体可以用于：

获取目标接口的服务状态，服务状态用于指示目标接口是否出现异常；

若目标接口出现异常，则利用预设抓包工具，抓取接口数据请求。

在一些实施例中，上述获取模块62，具体可以用于：

若目标接口未出现异常，则将预设抓包工具抓取的接口数据请求发送至服务器端的目标接口；

利用预设抓包工具，从服务器端的目标接口获取接口数据，作为接口返回数据。

可选的，在一些实施例中，上述获取模块62，具体可以用于：

若目标接口出现异常，则根据预设抓包工具抓取的接口数据请求，从预设数据库中选取与接口数据请求匹配的模拟接口数据，作为接口返回数据。

可选的，在一些实施例中，上述获取模块62，具体可以用于：

在前端页面发送接口数据请求至服务器端时，获取服务器端的目标接口反馈至前端页面的反馈信息；

根据反馈信息，确定服务器端的目标接口的服务状态。

可选的，在一些实施例中，上述获取模块62，具体可以用于：

根据接口数据请求，获取前端页面进行页面测试的测试内容；

根据测试内容，从预设数据库中选取对应的预设测试用例，作为接口返回数据。

可选的，在上述实施例的基础上，在一些实施例中，若测试内容包括页面控件样式测试和页面校验规则测试，则上述获取模块62，具体可以用于：

若测试内容为页面控件样式测试，则从预设数据库中选取预设样式测试用例，作为接口返回数据；

若测试内容为页面校验规则测试，则从预设数据库中选取预设安全测试用例，作为接口返回数据。

可选的，在上述实施例的基础上，在一些实施例中，上述获取模块62，具体可以用于：

获取前端页面中页面控件的字符类型和字符长度，根据字符类型和字符长度，构造预设样式测试用例；

将预设样式测试用例存储至预设数据库中。

可选的，在上述实施例的基础上，在一些实施例中，上述获取模块62，具体可以用于：

获取跨站脚本，根据跨站脚本，构造得到预设安全测试用例；

将预设安全测试用例存储至预设数据库中。

在一些实施例中，上述页面测试装置60还可以包括测试模块，用于：

根据接口返回数据，获取测试用例；

根据测试用例，对前端页面进行页面测试，得到测试结果，测试结果包括前端页面展示样式是否异常和/或前端页面数据校验测试结果。

示例性的，在上述实施例的基础上，在一些实施例中，上述的预设抓包工具可以是Fiddler超文本传输协议调试抓包工具。

此外，图7为本申请实施例提供的计算机设备的示意框图。如图7所示，该计算机设备70包括：至少一个处理器71和存储器72，示例性的，该计算机设备70还包括通信接口74，通信接口74、处理器71和存储器72之间通过总线73进行数据通信。

示例性的，通信接口74可以用于与其它设备进行通信。

处理器71，用于执行存储器存储的计算机执行指令，具体地，计算机执行指令可以包括程序代码。

示例性的，处理器71可能是中央处理器，或者是特定集成电路(ApplicationSpecific Integrated Circuit，ASIC)，或者是被配置成实施本发明实施例的一个或多个集成电路。电子设备包括的一个或多个处理器，可以是同一类型的处理器，如一个或多个CPU；也可以是不同类型的处理器，如一个或多个CPU以及一个或多个ASIC。

存储器72用于存放计算机执行指令。示例性的，存储器72可能包含高速RAM存储器，也可能还包括非易失性存储器，例如至少一个磁盘存储器。

本实施例还提供一种可读存储介质，可读存储介质中存储有计算机指令，当计算机设备的至少一个处理器执行该计算机指令时，计算机设备执行上述的各种实施方式提供的页面测试方法。

本实施例还提供一种计算机程序产品，该计算机程序产品包括计算机程序/指令，该计算机程序/指令存储在可读存储介质中。计算机设备的至少一个处理器可以从可读存储介质读取该计算机程序/指令，至少一个处理器执行该计算机程序/指令使得计算机设备实施上述的各种实施方式提供的页面测试方法。

本申请中，“至少一个”是指一个或者多个，“多个”是指两个或两个以上。“和/或”，描述关联对象的关联关系，表示可以存在三种关系，例如，A和/或B，可以表示：单独存在A，同时存在A和B，单独存在B的情况，其中A，B可以是单数或者复数。字符“/”一般表示前后关联对象是一种“或”的关系；在公式中，字符“/”，表示前后关联对象是一种“相除”的关系。“以下至少一项(个)”或其类似表达，是指的这些项中的任意组合，包括单项(个)或复数项(个)的任意组合。例如，a，b，或c中的至少一项(个)，可以表示：a，b，c，a-b，a-c，b-c，或a-b-c，其中，a，b，c可以是单个，也可以是多个。

可以理解的是，在本申请实施例中涉及的各种数字编号仅为描述方便进行的区分，并不用来限制本申请的实施例的范围。在本申请的实施例中，上述各过程的序号的大小并不意味着执行顺序的先后，各过程的执行顺序应以其功能和内在逻辑确定，而不应对本申请的实施例的实施过程构成任何限定。

最后应说明的是：以上各实施例仅用以说明本申请的技术方案，而非对其限制；尽管参照前述各实施例对本申请进行了详细的说明，本领域的普通技术人员应当理解：其依然可以对前述各实施例所记载的技术方案进行修改，或者对其中部分或者全部技术特征进行等同替换；而这些修改或者替换，并不使相应技术方案的本质脱离本申请各实施例技术方案的范围。

Claims (15)

1.一种页面测试方法，其特征在于，应用于测试设备，所述测试设备设置有预设抓包工具，所述方法包括：

响应于前端页面发送接口数据请求至服务器端，利用所述预设抓包工具，获取所述接口数据请求，所述接口数据请求用于所述前端页面从所述服务器端的目标接口请求得到接口数据；

根据所述接口数据请求，获取接口返回数据，所述接口返回数据用于所述前端页面进行页面测试；

利用所述预设抓包工具，将所述接口返回数据反馈至所述前端页面。

2.根据权利要求1所述的方法，其特征在于，所述利用所述预设抓包工具，抓取所述接口数据请求，包括：

获取所述目标接口的服务状态，所述服务状态用于指示所述目标接口是否出现异常；

若所述目标接口出现异常，则利用所述预设抓包工具，抓取所述接口数据请求。

3.根据权利要求2所述的方法，其特征在于，所述根据所述接口数据请求，获取接口返回数据，包括：

若所述目标接口未出现异常，则将所述预设抓包工具抓取的接口数据请求发送至所述服务器端的目标接口；

利用所述预设抓包工具，从所述服务器端的目标接口获取所述接口数据，作为所述接口返回数据。

4.根据权利要求3所述的方法，其特征在于，所述根据所述接口数据请求，获取接口返回数据，包括：

若所述目标接口出现异常，则根据所述预设抓包工具抓取的接口数据请求，从预设数据库中选取与所述接口数据请求匹配的模拟接口数据，作为所述接口返回数据。

5.根据权利要求2所述的方法，其特征在于，所述获取所述目标接口的服务状态，包括：

在前端页面发送接口数据请求至服务器端时，获取所述服务器端的目标接口反馈至所述前端页面的反馈信息；

根据所述反馈信息，确定所述服务器端的目标接口的服务状态。

6.根据权利要求1所述的方法，其特征在于，所述根据所述接口数据请求，获取接口返回数据，包括：

根据所述接口数据请求，获取所述前端页面进行页面测试的测试内容；

根据所述测试内容，从预设数据库中选取对应的预设测试用例，作为所述接口返回数据。

7.根据权利要求6所述的方法，其特征在于，所述测试内容包括页面控件样式测试和页面校验规则测试，所述根据所述测试内容，从预设数据库中选取对应的预设测试用例，作为所述接口返回数据，包括：

若所述测试内容为页面控件样式测试，则从预设数据库中选取预设样式测试用例，作为所述接口返回数据；

若所述测试内容为页面校验规则测试，则从预设数据库中选取预设安全测试用例，作为所述接口返回数据。

8.根据权利要求7所述的方法，其特征在于，所述根据所述测试内容，从预设数据库中选取对应的预设测试用例，作为所述接口返回数据之前，还包括：

获取所述前端页面中页面控件的字符类型和字符长度，根据所述字符类型和字符长度，构造所述预设样式测试用例；

将所述预设样式测试用例存储至所述预设数据库中。

9.根据权利要求7所述的方法，其特征在于，所述根据所述测试内容，从预设数据库中选取对应的预设测试用例，作为所述接口返回数据之前，还包括：

获取跨站脚本，根据所述跨站脚本，构造得到所述预设安全测试用例；

将所述预设安全测试用例存储至所述预设数据库中。

10.根据权利要求1所述的方法，其特征在于，所述利用所述预设抓包工具，将所述接口返回数据反馈至所述前端页面之后，还包括：

根据所述接口返回数据，获取测试用例；

根据所述测试用例，对所述前端页面进行页面测试，得到测试结果，所述测试结果包括前端页面展示样式是否异常和/或前端页面数据校验测试结果。

11.根据权利要求1-10任一项所述的方法，其特征在于，所述预设抓包工具为Fiddler超文本传输协议调试抓包工具。

12.一种软件测试装置，其特征在于，包括：

抓取模块，用于响应于前端页面发送接口数据请求至服务器端，利用预设抓包工具，获取所述接口数据请求，所述接口数据请求用于所述前端页面从所述服务器端的目标接口请求得到接口数据；

获取模块，用于根据所述接口数据请求，获取接口返回数据，所述接口返回数据用于所述前端页面进行页面测试；

反馈模块，用于利用所述预设抓包工具，将所述接口返回数据反馈至所述前端页面。

13.一种计算机设备，其特征在于，包括存储器和至少一个处理器；

所述存储器存储计算机执行指令；

所述至少一个处理器执行所述存储器存储的计算机执行指令，使得所述至少一个处理器执行如权利要求1-11任一项所述的方法。

14.一种可读存储介质，其特征在于，所述可读存储介质中存储有计算机指令，所述计算机指令被处理器执行时用于实现如权利要求1-11任一项所述的方法。

15.一种计算机程序产品，包括计算机程序/指令，其特征在于，该计算机程序/指令被处理器执行时实现权利要求1-11任一项所述的方法。

Images