CN111090580B

CN111090580B - 用户界面一致性检测方法、装置及可读存储介质

Info

Publication number: CN111090580B
Application number: CN201911148710.8A
Authority: CN
Inventors: 古知己; 马美玲; 钱韬
Original assignee: Guangzhou Pinwei Software Co Ltd
Current assignee: Guangzhou Pinwei Software Co Ltd
Priority date: 2019-11-21
Filing date: 2019-11-21
Publication date: 2023-04-18
Anticipated expiration: 2039-11-21
Also published as: CN111090580A

Abstract

本发明公开了一种用户界面一致性检测方法，包括以下步骤：测试终端向目标服务器发送图片请求，其中，所述目标服务器在接收到所述图片请求时，反馈所述图片请求对应的资源链接；接收所述资源链接，并根据所述资源链接获取第一图片；获取测试终端的显示界面，并根据所述显示界面确定第二图片；确定所述第一图片与所述第二图片之间的相似度，并根据所述相似度确定所述测试终端展示的用户界面与服务器中保存预设用户界面是否一致。本发明还公开了一种用户界面一致性检测装置及计算机可读存储介质，达成了提高UI一致性检测结果的准确性的效果。

Description

用户界面一致性检测方法、装置及可读存储介质

技术领域

本发明涉及用户界面测试技术领域，尤其涉及用户界面一致性检测方法、用户界面一致性检测装置及计算机可读存储介质。

背景技术

UI(User Interface，用户界面)是系统和用户之间进行交互和信息交换的媒介，它实现信息的内部形式与人类可以接受形式之间的转换。用户界面是介于用户与硬件而设计彼此之间交互沟通相关软件，目的在使得用户能够方便有效率地去操作硬件以达成双向之交互，完成所希望借助硬件完成之工作，用户界面定义广泛，包含了人机交互与图形用户接口，凡参与人类与机械的信息交流的领域都存在着用户界面。

在UI界面的输出过程中，需要保障终端实际展示的UI与系统预设的需要向用户展示的UI的一致性，因此需要对两者之间的一致性进行检测。但在传统的检测过程中，一般通过对比终端实际展示的UI与测试端保存的本地图片的相似度来确定终端实际展示的UI与系统预设的需要向用户展示的UI的一致性。在测试端保存的本地图片更新不及时的情况下，会导致测试结果错误。因此存在测试结果不准确的缺点。

发明内容

本发明的主要目的在于提供一种用户界面一致性检测方法、用户界面一致性检测装置及计算机可读存储介质，旨在达成提高UI一致性检测结果的准确性的效果。

为实现上述目的，本发明提供一种用户界面一致性检测方法，所述用户界面一致性检测方法包括以下步骤：

测试终端向目标服务器发送图片请求，其中，所述目标服务器在接收到所述图片请求时，反馈所述图片请求对应的资源链接；

接收所述资源链接，并根据所述资源链接获取第一图片；

获取测试终端的显示界面，并根据所述显示界面确定第二图片；

确定所述第一图片与所述第二图片之间的相似度，并根据所述相似度确定所述测试终端展示的用户界面与服务器中保存预设用户界面是否一致。

可选地，所述测试终端与所述目标服务器之间还设置有代理服务器，所述测试终端向目标服务器发送图片请求的步骤包括：

向所述代理服务器发送所述图片请求，其中，所述代理服务器接收所述图片请求，并将所述图片请求转发至所述目标服务器，所述目标服务器接收到所述图片请求时，向所述代理服务器反馈所述资源链接。

可选地，所述接收所述资源链接，并根据所述资源链接获取第一图片的步骤包括：

接收所述代理服务器发送的第一图片，其中，所述代理服务器先接收所述目标服务器反馈的所述资源链接，然后根据所述资源链接获取所述第一图片，并发送至所述测试终端。

可选地，所述代理服务器根据所述资源链接，基于超文本传输协议获取所述第一图片。

可选地，所述向所述代理服务器发送所述图片请求的步骤之前，还包括：

获取预设配置文件，并根据所述预设配置文件获取所述代理服务器的地址及端口号；

基于所述地址及所述端口号建立所述测试终端与所述代理服务器之间的通信连接，以供所述测试终端向所述代理服务器发送所述图片请求。

可选地，所述获取测试终端的显示界面，并根据所述显示界面确定第二图片的步骤包括：

获取所述测试终端当前显示界面的截图；

根据所述截图确定所述第二图片。

可选地，所述根据所述截图确定所述第二图片的步骤包括：

获取所述测试终端的尺寸信息，及用户界面的图片位置参数；

根据所述尺寸信息及所述图片位置参数确定所述第二图片在所述截图中的位置数据；

根据所述截图及所述位置数据获取所述第二图片。

可选地，所述确定所述第一图片与所述第二图片之间的相似度，并根据所述相似度确定所述测试终端展示的用户界面与服务器中保存预设用户界面是否一致的步骤包括：

通过预设图像处理算法计算所述第一图片与所述第二图片之间的相似度；

在所述相似度大于或者等于预设相似度时，判定所述测试终端展示的用户界面与服务器中保存预设用户界面一致；

在所述相似度小于预设相似度时，判定所述测试终端展示的用户界面与服务器中保存预设用户界面不一致。

此外，为实现上述目的，本发明还提供一种用户界面一致性检测装置，所述用户界面一致性检测装置包括存储器、处理器及存储在所述存储器上并可在所述处理器上运行的一致性检测程序，所述一致性检测程序被所述处理器执行时实现如上所述的用户界面一致性检测方法的步骤。

此外，为实现上述目的，本发明还提供一种计算机可读存储介质，所述计算机可读存储介质上存储有一致性检测程序，所述一致性检测程序被处理器执行时实现如上所述的用户界面一致性检测方法的步骤。

本发明实施例提出的一种用户界面一致性检测方法、用户界面一致性检测装置及计算机可读存储介质，测试终端可以向目标服务器发送图片请求，其中，所述目标服务器在接收到所述图片请求时，反馈所述图片请求对应的资源链接，然后接收所述资源链接，并根据所述资源链接获取第一图片，进而获取测试终端的显示界面，并根据所述显示界面确定第二图片，并确定所述第一图片与所述第二图片之间的相似度，以根据所述相似度确定所述测试终端展示的用户界面与服务器中保存预设用户界面是否一致。由于在检测过程中可以获取通过向目标服务器发送图片请求以获取作为对照的第一图片，因此，可以避免由于测试终端中保存的对照图片未及时更新而导致一致性测试结果错误的现象发生，从而达成了提高测试结果的准确性的效果。

附图说明

图1是本发明实施例方案涉及的硬件运行环境的终端结构示意图；

图2为本发明用户界面一致性检测方法一实施例的流程示意图。

本发明目的的实现、功能特点及优点将结合实施例，参照附图做进一步说明。

具体实施方式

应当理解，此处所描述的具体实施例仅仅用以解释本发明，并不用于限定本发明。

由于在UI界面的输出过程中，需要保障终端实际展示的UI与系统预设的需要向用户展示的UI的一致性，因此需要对两者之间的一致性进行检测。但在传统的检测过程中，一般通过对比终端实际展示的UI与测试端保存的本地图片的相似度来确定终端实际展示的UI与系统预设的需要向用户展示的UI的一致性。在测试端保存的本地图片更新不及时的情况下，会导致测试结果错误。因此存在测试结果不准确的缺点。

为解决上述缺陷，本发明个实施例提供一种用户界面一致性检测方法、用户界面一致性检测装置及计算机可读存储介质，其中，所述用户界面一致性检测方法的主要方案包括以下步骤：

接收所述资源链接，并根据所述资源链接获取第一图片；

由于在检测过程中可以获取通过向目标服务器发送图片请求以获取作为对照的第一图片，因此，可以避免由于测试终端中保存的对照图片未及时更新而导致一致性测试结果错误的现象发生，从而达成了提高测试结果的准确性的效果。

如图1所示，图1是本发明实施例方案涉及的硬件运行环境的终端结构示意图。

本发明实施例终端可以是智能手机等终端设备。

如图1所示，该终端可以包括：处理器1001，例如CPU，网络接口1004，用户接口1003，存储器1005，通信总线1002。其中，通信总线1002用于实现这些组件之间的连接通信。用户接口1003可以包括显示屏(Display)、输入单元比如键盘(Keyboard)、鼠标等，可选用户接口1003还可以包括标准的有线接口、无线接口。网络接口1004可选的可以包括标准的有线接口、无线接口(如WI-FI接口)。存储器1005可以是高速RAM存储器，也可以是稳定的存储器(non-volatile memory)，例如磁盘存储器。存储器1005可选的还可以是独立于前述处理器1001的存储装置。

本领域技术人员可以理解，图1中示出的终端结构并不构成对终端的限定，可以包括比图示更多或更少的部件，或者组合某些部件，或者不同的部件布置。

如图1所示，作为一种计算机存储介质的存储器1005中可以包括操作系统、网络通信模块、用户接口模块以及一致性检测程序。

在图1所示的终端中，网络接口1004主要用于连接后台服务器，与后台服务器进行数据通信；处理器1001可以用于调用存储器1005中存储的一致性检测程序，并执行以下操作：

接收所述资源链接，并根据所述资源链接获取第一图片；

进一步地，处理器1001可以调用存储器1005中存储的一致性检测程序，还执行以下操作：

获取所述测试终端当前显示界面的截图；

根据所述截图确定所述第二图片。

根据所述截图及所述位置数据获取所述第二图片。

参照图2，在本发明用户界面一致性检测方法的一实施例中，所述用户界面一致性检测方法包括以下步骤：

步骤S10、测试终端向目标服务器发送图片请求，其中，所述目标服务器在接收到所述图片请求时，反馈所述图片请求对应的资源链接；

步骤S20、接收所述资源链接，并根据所述资源链接获取第一图片；

步骤S30、获取测试终端的显示界面，并根据所述显示界面确定第二图片；

步骤S40、确定所述第一图片与所述第二图片之间的相似度，并根据所述相似度确定所述测试终端展示的用户界面与服务器中保存预设用户界面是否一致。

在本实施例中，所述用户界面一致性检测方法适用于检测需要根据服务器中保存的UI数据确定终端显示内容的应用的UI一致性检测。例如，手机、平板电脑等终端可以安装有唯品会APP(Application，应用程序)、淘宝APP和/或京东APP等APP。而如唯品会APP(Application，应用程序)、淘宝APP和/或京东APP等需要显示商品信息。在APP显示商品信息时，需要获取目标服务器中保存的商品图片等来形成对应的终端UI界面。因此，当APP在服务端涉及的UI界面生成的代码发生改变，或者终端安装的APP对应的UI界面生成代码发生改变时，可能由于代码问题，会导致终端与服务器端对应的UI界面不一致。即终端显示的商品图片与服务器端需要终端显示的图片不一致的现象发生。

为避免服务器端预设的UI界面与终端实际显示的UI界面不一致的现象发生，可以在APP版本或者服务器代码版本发行前，先检测当前版本的UI一致性。在检测到终端展示的用户界面与服务器中保存预设用户界面一致时，发行当前版本APP或服务器代码版本，否则，对当前版本APP或服务器代码版本进行修正，以达到UI一致的目的。

在进行用户界面一致性检测时，测试终端可以先登录对应的待检测APP。例如，当待检测APP为唯品会APP时，应用终端可以先安装唯品会APP，然后通过合法的唯品会APP登录账号进行登录操作。

可以理解的是，所述测试终端还设置有通信装置，通过所述通信装置可以与目标服务器之间建立通信连接。使得测试终端在登录待测试APP后，可以基于所述待测试APP向目标服务器发送图片请求。其中，待测试终端在发送所述图片请求时，可以基于HTTP(超文本传输协议)向目标服务器发送所述图片请求。

当目标服务器接收到所述图片请求时，可以根据所述图片请求确定所述图片请求对应的商品图片的资源链接，然后将所述资源链接反馈至所述测试终端。

所述测试终端在发送所述图片请求后，可以接收目标服务器反馈的资源信息。其中，所述资源信息可以是基于超文本传输协议的图片链接。当测试终端接收到所述资源信息后，可以基于超文本传输协议，根据所述图片链接获取所述图片链接对应的商品图片。当获取到所述商品图片时，将所述商品图片作为所述第一图片。

进一步地，当所述测试终端获取到所述第一图片后，可以获取测试终端当前的显示界面。例如，可以对当前显示界面进行截屏操作，得到显示界面的截图。当得到显示界面的截图后，根据所述截图确定第二图片。

具体地，可先获取所述待测试APP中的UI的图片显示位置参数，以及所述测试终端的显示器的尺寸信息，然后根据所述位置参数及所述尺寸信息确定所述第二图片在所述测试终端上显示时，其对应的显示位置。根据所述显示位置，可以确定所述第二图片相对于所述截图的位置数据。将所述位置数据及所述截图作为预设图片获取程序的输入参数，使得所述预设图片获取程序可以根据所述输入参数获取所述第二图片。其中，所述预设图片获取程序可以是测试终端调用的预设图片处理程序。所述预设图片处理程序可以根据基础参数，确定所述截图中的目标区域，并将所述截图中的目标区域截取，作为所述第二图片。

当获取到所述第一图片和所述第二图片后，测试终端可以根据预设的图像处理算法，计算所述第一图片和第二图片之间的相似度。例如，可以根据平均哈希算法计算第一图片与第二图片之间的相似度，其中，根据平均哈希算法计算图片之间的相似度的步骤包括：

先缩小尺寸，即将图像缩小到8*8的尺寸，总共64个像素。这一步的作用是去除图像的细节，只保留结构/明暗等基本信息，摒弃不同尺寸/比例带来的图像差异；然后简化色彩，即将缩小后的图像，转为64级灰度，即所有像素点总共只有64种颜色，进而计算平均值，即计算所有64个像素的灰度平均值；比较像素的灰度，即将每个像素的灰度，与平均值进行比较，大于或等于平均值记为1，小于平均值记为0；最后计算哈希值，即将上一步的比较结果，组合在一起，就构成了一个64位的整数，这就是这张图像的指纹。组合的次序并不重要，只要保证所有图像都采用同样次序，得到指纹以后，就可以对比不同的图像，看看64位中有多少位是不一样的。在理论上，这等同于“汉明距离”(Hamming distance，在信息论中，两个等长字符串之间的汉明距离是两个字符串对应位置的不同字符的个数)。然后将所述不同的数据位数作为所述图片的相似度，在所述相似度大于或者等于预设相似度时，判定所述测试终端展示的用户界面与服务器中保存预设用户界面一致；在所述相似度小于预设相似度时，判定所述测试终端展示的用户界面与服务器中保存预设用户界面不一致。

示例性地，所述预设相似度可以设置为5，即当不相同的数据位数不超过5，判定所述测试终端展示的用户界面与服务器中保存预设用户界面一致，否则，判定所述测试终端展示的用户界面与服务器中保存预设用户界面不一致。

可以理解的是，本实施例不对计算第一图片与第二图片之间的相似的具体算法进行限定，上述计算第一图片与第二图片的之间的相似度的算法仅用于解释本发明。在本法明的其它实施例中，也可以调用第三方程序用以计算第一图片与第二图片之间的相似度，或者调用其它API接口，以通过第三方代码计算所述第一图片与第二图片之间的相似度。因此，当计算相似度的方式不同时，所述预设相似度也不相同。即所述预设相似度是可以根据具体实施例，由开发人员自定义设定的预设数值。

在本实施例公开的技术方案中，测试终端可以向目标服务器发送图片请求，其中，所述目标服务器在接收到所述图片请求时，反馈所述图片请求对应的资源链接，然后接收所述资源链接，并根据所述资源链接获取第一图片，进而获取测试终端的显示界面，并根据所述显示界面确定第二图片，并确定所述第一图片与所述第二图片之间的相似度，以根据所述相似度确定所述测试终端展示的用户界面与服务器中保存预设用户界面是否一致。由于在检测过程中可以获取通过向目标服务器发送图片请求以获取作为对照的第一图片，因此，可以避免由于测试终端中保存的对照图片未及时更新而导致一致性测试结果错误的现象发生，从而达成了提高测试结果的准确性的效果。

基于上述实施例，在本发明的另一实施例中，所述测试终端与所述目标服务器之间还设置有代理服务器。

在本实施例中，代理服务器(Proxy Server)的功能是代理网络用户去取得网络信息。形象地说，它是网络信息的中转站，是个人网络和Internet服务商之间的中间代理机构，负责转发合法的网络信息，对转发进行控制和登记。因此，在测试终端与目标服务器之间设置代理服务器可以提高数据的安全性、缓存数据、进行内容过滤、访问控制管理等功能。

因此，所述测试终端可以先获取预设配置文件，其中，所述预设配置文件是可以根据测试人员自定义更新和设置的文件。所述预设配置文件包括用于测试UI一致性的代理服务器的地址和端口号。因此，测试终端获取到所述预设配置文件后，可以根据所述预设配置文件获取所述地址和所述端口号。然后基于所述地址和所述端口号建立与代理服务器建立通信连接。使得测试终端可以向代理服务器发送所述图片请求。当所述代理服务器接收到所述测试请求后，可以将所述测试请求转发至目标服务器。使得目标服务器接收到代理服务器转发的图片请求时，向代理服务器反馈所述资源信息。进而，代理服务器可以接收所述资源信息，然后基于所述资源信息进行图片请求，以获取所述资源信息对应的第一图片。并在获取到所述第一图片后，将所述第一图片发送至所述测试终端。其中，所述代理服务器根据所述资源数据，基于HTTP协议进行图片请求，以获取所述第一图片。所述请求示例如下：

GET/upload/brandcool/0/a037bc63ce97439c856683aad791c7d9/10026985/primarytest2.png！85.webp HTTP/1.1

在本实施例公开的技术方案中，测试终端设置有代理服务器，可以通过代理服务器向目标服务器转发图片请求，并通过代理服务器根据目标服务器反馈的资源数据抓取第一图片，并将第一图片发送至测试终端。由于可以通过代理服务器获取第一图片，从而达成了降低所述测试终端的数据处理量的效果。

此外，本发明实施例还提出一种用户界面一致性检测装置，所述用户界面一致性检测装置包括存储器、处理器及存储在所述存储器上并可在所述处理器上运行的一致性检测程序，所述一致性检测程序被所述处理器执行时实现如上各个实施例所述的用户界面一致性检测方法的步骤。

此外，本发明实施例还提出一种计算机可读存储介质，所述计算机可读存储介质上存储有一致性检测程序，所述一致性检测程序被处理器执行时实现如上各个实施例所述的用户界面一致性检测方法的步骤。

需要说明的是，在本文中，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者系统不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者系统所固有的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括该要素的过程、方法、物品或者系统中还存在另外的相同要素。

上述本发明实施例序号仅仅为了描述，不代表实施例的优劣。

通过以上的实施方式的描述，本领域的技术人员可以清楚地了解到上述实施例方法可借助软件加必需的通用硬件平台的方式来实现，当然也可以通过硬件，但很多情况下前者是更佳的实施方式。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品存储在如上所述的一个存储介质(如ROM/RAM、磁碟、光盘)中，包括若干指令用以使得一台终端设备(可以是智能手机等)执行本发明各个实施例所述的方法。

以上仅为本发明的优选实施例，并非因此限制本发明的专利范围，凡是利用本发明说明书及附图内容所作的等效结构或等效流程变换，或直接或间接运用在其他相关的技术领域，均同理包括在本发明的专利保护范围内。

Claims

1.一种用户界面一致性检测方法，其特征在于，所述用户界面一致性检测方法包括以下步骤：

向代理服务器发送图片请求，其中，所述代理服务器接收所述图片请求，并将所述图片请求转发至目标服务器，所述目标服务器接收到所述图片请求时，向所述代理服务器反馈资源链接；

接收所述代理服务器发送的第一图片，其中，所述代理服务器先接收所述目标服务器反馈的所述资源链接，然后根据所述资源链接获取所述第一图片，并发送至测试终端；

获取所述测试终端的显示界面，并根据所述显示界面确定第二图片；

确定所述第一图片与所述第二图片之间的相似度，并根据所述相似度确定所述测试终端展示的用户界面与服务器中保存预设用户界面是否一致；

所述获取所述测试终端的显示界面，并根据所述显示界面确定第二图片的步骤包括：

获取所述测试终端当前显示界面的截图；

将所述所述截图及所述位置数据作为预设图片获取程序的输入参数，以使所述预设图片获取程序根据所述输入参数获取所述第二图片，其中，所述第二图片为所述截图的目标区域。

2.如权利要求1所述的用户界面一致性检测方法，其特征在于，所述代理服务器根据所述资源链接，基于超文本传输协议获取所述第一图片。

3.如权利要求1所述的用户界面一致性检测方法，其特征在于，所述向代理服务器发送所述图片请求的步骤之前，还包括：

4.如权利要求1所述的用户界面一致性检测方法，其特征在于，所述确定所述第一图片与所述第二图片之间的相似度，并根据所述相似度确定所述测试终端展示的用户界面与服务器中保存预设用户界面是否一致的步骤包括：

5.一种用户界面一致性检测装置，其特征在于，所述用户界面一致性检测装置包括：存储器、处理器及存储在所述存储器上并可在所述处理器上运行的一致性检测程序，所述一致性检测程序被所述处理器执行时实现如权利要求1至4中任一项所述的用户界面一致性检测方法的步骤。

6.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质上存储有一致性检测程序，所述一致性检测程序被处理器执行时实现如权利要求1至4中任一项所述的用户界面一致性检测方法的步骤。