CN117078777A - 页面检查方法、装置、设备及存储介质 - Google Patents

Abstract

本申请提供一种页面检查方法、装置、设备及存储介质，涉及人工智能、金融科技或者其他相关领域。该方法包括：对参考页面图上的颜色区域进行颜色提取，得到参考颜色信息，参考颜色信息包括至少一种参考颜色的属性信息，参考颜色的属性信息按照颜色区域的位置顺序排列；对待检查页面图上的颜色区域进行颜色提取，得到待检查颜色信息，待检查颜色信息包括至少一种待检查颜色的属性信息，待检查颜色的属性信息按照颜色区域的位置顺序排列；对参考颜色的属性信息和待检查颜色的属性信息进行比较，得到参考页面图与待检查页面图在色彩使用上的差异信息；输出参考颜色信息、待检查颜色信息和差异信息。从而，实现色彩还原自动检查，提高页面检查效率。

Description

页面检查方法、装置、设备及存储介质

技术领域

本申请涉及人工智能领域、金融科技领域或其他相关领域，尤其涉及一种页面检查方法、装置、设备及存储介质。

背景技术

应用程序、网站、网页等产品的页面，先由设计人员设计，再由开发人员基于设计人员提供的页面设计稿进行页面开发。

在开发人员实现页面开发稿后，可由开发人员、测试人员等工作人员，检查页面开发稿对页面设计稿的还原情况。

然而，上述页面检查方式的效率较低。

发明内容

本申请提供一种页面检查方法、装置、设备及存储介质，用以解决页面检查效率较低的问题。

第一方面，本申请提供一种页面检查方法，包括：

获取参考页面图和待检查页面图；

对所述参考页面图上的颜色区域进行颜色提取，得到参考颜色信息，所述参考颜色信息包括至少一种参考颜色的属性信息，在所述参考颜色信息中，所述参考颜色的属性信息按照所述颜色区域在所述参考页面图的位置顺序排列；

对所述待检查页面图上的颜色区域进行颜色提取，得到待检查颜色信息，所述待检查颜色信息包括至少一种待检查颜色的属性信息，在所述待检查颜色信息中，所述待检查颜色的属性信息按照所述颜色区域在所述待检查页面图的位置顺序排列；

对所述参考颜色的属性信息和所述待检查颜色的属性信息进行比较，得到所述参考页面图与所述待检查页面图在色彩使用上的差异信息；

输出所述参考颜色信息、所述待检查颜色信息和所述差异信息。

第二方面，本申请提供一种页面检查装置，包括：

获取模块，用于获取参考页面图和待检查页面图；

第一提取模块，用于对所述参考页面图上的颜色区域进行颜色提取，得到参考颜色信息，所述参考颜色信息包括至少一种参考颜色的属性信息，在所述参考颜色信息中，所述参考颜色的属性信息按照所述颜色区域在所述参考页面图的位置顺序排列；

第二提取模块，用于对所述待检查页面图上的颜色区域进行颜色提取，得到待检查颜色信息，所述待检查颜色信息包括至少一种待检查颜色的属性信息，在所述待检查颜色信息中，所述待检查颜色的属性信息按照所述颜色区域在所述待检查页面图的位置顺序排列；

对比模块，用于对所述参考颜色的属性信息和所述待检查颜色的属性信息进行比较，得到所述参考页面图与所述待检查页面图在色彩使用上的差异信息；

输出模块，用于输出所述参考颜色信息、所述待检查颜色信息和所述差异信息。

第三方面，本申请提供一种电子设备，包括：处理器，以及与所述处理器通信连接的存储器；所述存储器存储计算机执行指令；所述处理器执行所述存储器存储的计算机执行指令，以实现如第一方面所述的页面检查方法。

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

第五方面，本申请提供一种计算机程序产品，所述计算机程序产品包括计算机程序，所述计算机程序被处理器执行时实现如第一方面提供的页面检查方法。

本申请提供的页面检查方法、装置、设备及存储介质，获取参考页面图和待检查页面图；对参考页面图进行颜色提取，得到参考颜色信息，参考颜色信息包括至少一种参考颜色的属性信息；对待检查页面图进行颜色提取，得到待检查颜色信息，待检查颜色信息包括至少一种待检查颜色的属性信息；通过比较参考颜色的属性信息和待检查颜色的属性信息，得到待检查页面图与参考页面图在色彩使用上的差异信息。最后，输出参考颜色信息、待检查颜色信息和差异信息。一方面，用户可以通过参考颜色信息、待检查颜色信息了解参考页面图的颜色使用细节、待检查页面图的颜色使用细节以及人工比较两者的颜色使用差异，另一方面，还可以通过差异信息更为直观地知道待检查页面图相较于参考页面图在颜色上的还原情况。实现了页面颜色使用的还原情况的自动检查，提高了页面检查效率。

附图说明

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

图1为本申请实施例适用的应用场景的示例图；

图2为本申请实施例提供的一种页面检查方法的流程示意图一；

图3为本申请实施例提供的页面检查界面的示意图一；

图4为本申请实施例提供的一种页面检查方法的流程示意图二；

图5为本申请实施例提供的页面检查界面的示意图二；

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

图7为本申请实施例提供的一种电子设备的结构示意图。

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

具体实施方式

这里将详细地对示例性实施例进行说明，其示例表示在附图中。下面的描述涉及附图时，除非另有表示，不同附图中的相同数字表示相同或相似的要素。以下示例性实施例中所描述的实施方式并不代表与本申请相一致的所有实施方式。相反，它们仅是与如所附权利要求书中所详述的、本申请的一些方面相一致的装置和方法的例子。

需要说明的是，本申请提供的页面检查方法、装置、设备及存储介质可用于人工智能领域、金融科技领域或者其他相关领域，本申请提供的页面检查方法、装置、设备及存储介质的应用领域不作限定。

页面的制作过程包括页面设计和页面开发。设计人员提供页面设计稿，开发人员基于页面设计稿开发页面，之后进行页面设计稿的还原度的走查，在这个过程中，可由开发人员、设计人员和/或测试人员等一方或者多方人员对页面开发稿和页面设计稿进行人工比对，其中包括对页面开发稿上使用的颜色和页面设计稿上使用的颜色进行人工比对。在页面开发稿上使用的颜色的数量较多、页面开发稿上使用的颜色与页面设计稿上使用的颜色接近的情况下，人工比对的方式效率低且准确性低。所以，需要一个可以准确识别出页面开发稿上的配色是否和谐且页面开发稿上的配色是否在规范色系内的工具。

为解决上述问题，本申请提供的页面检查方法、装置、设备及存储介质，通过对参考页面图上的颜色区域进行颜色提取，得到参考颜色信息，通过对待检查页面图的颜色区域进行颜色提取，得到待检查颜色信息，以参考颜色信息作为待检查页面的色彩使用规范，比较参考颜色信息和待检查颜色信息，得到参考页面图与待检查页面图在色彩使用上的差异信息。通过输出待检查颜色信息和参考颜色信息，用户可以参照参考颜色信息，一目了然地检查待检查页面的配色是否和谐，通过输出差异信息，用户可以掌握待检查页面在色彩使用上的还原情况、色彩使用是否在规范色系内。从而，提高了页面检查的效率，提高了页面检查的准确性和可靠性。

本申请具体的应用场景为页面检查(又可以称为页面的还原度走查)场景。图1为本申请实施例适用的应用场景的示例图。如图1所示，应用场景可涉及页面检查装置101，页面检查装置101可以是服务器或者终端，图1以服务器为例。在页面检查装置101上，可对参考页面图和待检查页面图进行色彩信息的提取和比较，得到参考颜色信息、待检查颜色信息以及参考页面图与待检查页面图在色彩使用上的差异信息，输出参考颜色信息、待检查颜色信息以及参考页面图与待检查页面图在色彩使用上的差异信息。

可选地，应用场景还可包括交互装置102和/或数据库103。交互装置102与页面检查装置101之间可以相互通信，交互装置102可以为终端，用户可在交互装置102上输入参考页面和/或待检查页面，页面检查装置101可以将参考颜色信息、待检查颜色信息和差异信息发送至交互装置102上进行显示。交互装置102的使用者例如可以是开发人员，开发人员在开发完页面后，可以在交互装置102上输入页面开发稿和页面设计稿，以得到页面开发稿与页面设计稿在色彩使用上的差异信息。此外，页面检查装置101还可以从数据库103中获取参考页面图和/或待检查页面图。

其中，终端可以是个人数字处理(personal digital assistant，简称PDA)设备、具有无线通信功能的手持设备(例如智能手机、平板电脑)、计算设备(例如个人电脑(personal computer，简称PC))、可穿戴设备(例如智能手表、智能手环)以及智能家居设备(例如智能音箱、智能显示设备)等。服务器可以为独立的服务器也可以为服务器集群，可以为本地服务器也可以为云服务器。

下面以具体的实施例对本申请的技术方案以及本申请的技术方案如何解决上述技术问题进行详细说明。下面这几个具体的实施例可以相互结合，对于相同或相似的概念或过程可能在某些实施例中不再赘述。下面将结合附图，对本申请的实施例进行描述。

图2为本申请实施例提供的一种页面检查方法的流程示意图。如图2所示，页面检查方法包括如下步骤：

S201，获取参考页面图和待检查页面图。

其中，参考页面图与待检查页面图对应相同的页面，参考页面图是该页面所要达到的规范效果，待检查页面图是该页面的实际实现效果，所以参考页面图是用于待检查页面图的参考标准，用于检测待检查页面图的布局、颜色等是否规范。

可选地，参考页面图包括页面设计稿，待检查页面图包括页面开发稿。

本实施例中，参考页面图和待检查页面图的数据来源可以相同也可以不同，可从数据库中获取参考页面图和待检查页面图；或者，可获取用户输入的参考页面图和待检查页面图；或者，可从数据库获取参考页面图，获取用户输入的待检查页面图；或者，可从数据库获取待检查页面图，获取用户输入的参考页面图。

可选地，在参考页面图包括页面设计稿且待检查页面图包括页面开发稿的情况下，页面设计稿来自设计人员，页面开发稿来自开发人员，设计人员在完成页面设计后将页面设计稿交给开发人员。所以，在对页面开发稿进行检查时，可获取开发人员输入的页面设计稿和页面开发稿，以参照页面设计稿对页面开发稿进行检查。

S202，对参考页面图上的颜色区域进行颜色提取，得到参考颜色信息，参考颜色信息包括至少一种参考颜色的属性信息，在参考颜色信息中，参考颜色的属性信息按照颜色区域在参考页面图上的位置顺序排列。

其中，参考页面图上的颜色区域例如参考页面图上的页面背景、文字区域、图片区域、控件区域以及其他的设计元素区域(比如菜单栏、分隔栏)等。参考页面图上可能出现多个颜色区域，不同的颜色区域可以对应相同或者不同的颜色，一个颜色区域可以对应同一种颜色，也可以对应不同的颜色。

其中，参考颜色的属性信息按照颜色区域在参考页面图上的位置顺序排列，即参考颜色的属性信息按照参考颜色对应的颜色区域在参考页面图上的位置顺序排列，如此可以使得参考颜色信息以色卡的形式呈现，色卡包含多个顺序排列的颜色。

其中，参考颜色的属性信息，比如参考颜色的颜色类型、颜色值等。

本实施例中，可对参考页面图进行颜色检测，得到参考页面图上的颜色区域和颜色区域对应的颜色的属性信息，为了便于区分，将参考页面图上出现的颜色称为参考颜色，将从参考页面图上提取出来的颜色信息称为参考颜色信息。如此，可以提取出参考颜色信息，参考颜色信息包括至少一种参考颜色的属性信息。

S203，对待检查页面图上的颜色区域进行颜色提取，得到待检查颜色信息，待检查颜色信息包括至少一种待检查颜色的属性信息，在待检查颜色信息中，待检查颜色的属性信息按照颜色区域在待检查页面图的位置顺序排列。

其中，待检查页面图上的颜色区域例如待检查页面图上的页面背景、文字区域、图片区域、控件区域以及其他的设计元素区域(比如菜单栏、分隔栏)等。待检查页面图上可能出现多个颜色区域，不同的颜色区域可以对应相同或者不同的颜色，一个颜色区域可以对应同一种颜色，也可以对应不同的颜色。

其中，待检查颜色的属性信息按照颜色区域在待检查页面图上的位置顺序排列，即待检查颜色的属性信息按照待检查颜色对应的颜色区域在待检查页面图上的位置顺序排列，如此可以使得待检查颜色信息以色卡的形式呈现，色卡包含多个顺序排列的颜色。

其中，待检查颜色的属性信息，比如待检查颜色的颜色类型、颜色值等。

本实施例中，可对待检查页面图进行颜色检测，得到待检查页面图上的颜色区域和颜色区域对应的颜色的属性信息，为了便于区分，将待检查页面图上出现的颜色称为待检查颜色，将从待检查页面图上提取出来的颜色信息称为待检查颜色信息。如此，可以提取出待检查颜色信息，待检查颜色信息包括至少一种待检查颜色的属性信息。

S204，对参考颜色的属性信息和待检查颜色的属性信息进行比较，得到参考页面图与待检查页面图在色彩使用上的差异信息。

本实施例中，可将对应同一区域的参考颜色和待检测颜色视为同组颜色，针对每组颜色，对参考颜色的属性信息和待检查颜色的属性信息进行比较，得到每组颜色中参考颜色与待检查颜色的属性差异。基于每组颜色中参考颜色与待检查颜色的属性差异，得到参考页面图与待检查页面图在色彩使用上的差异信息。参考页面图与待检查页面图在色彩使用上的差异信息可包括每组颜色中参考颜色与待检查颜色的属性差异。

可选地，参考页面图与待检查页面图在色彩使用上的差异信息还包括参考页面图与待检查页面图在色彩使用上的总差异。可对每组颜色中参考颜色与待检查颜色的属性差异进行融合处理，例如求和、求平均、加权等融合处理方式，得到参考页面图与待检测页面图在色彩使用上的总差异。从而，除了从各个颜色的对比结果来提供参考页面图与待检测页面图在色彩使用上的细节差异，还可以对这些差异进行汇总，从整体上总结参考页面图与待检测页面的色彩使用差异，体现待检测页面的色彩使用还原情况。

S205，输出参考颜色信息、待检查颜色信息和差异信息。

本实施例中，在当前设备为服务器的情况下，服务器可将参考颜色信息、待检查颜色信息和差异信息发送至终端，由终端显示参考颜色信息、待检查颜色信息和差异信息；在当前设备为终端的情况下，当前设备可显示参考颜色信息、待检查颜色信息和差异信息。从而，便于终端处的用户直观了解到待检测页面图与参考页面图在色彩使用上的差异。

本申请实施例中，通过对参考页面图上的颜色区域和待检测页面图上的颜色区域分别进行颜色提取，得到参考颜色信息和待检查颜色信息，通过对比参考颜色信息和待检查颜色信息，确定参考页面图与待检测页面图在色彩使用上的差异信息。输出参考颜色信息、待检查颜色信息和差异信息，向用户直观反馈参考页面图上规范采用的颜色、待检查页面图上实际采用的颜色、在色彩使用方面待检查页面图对参考页面图的还原情况。从而，实现了页面色彩还原情况的自动检查，提高了页面检查效率、准确性和可靠性。

在本申请实施例应用于具备显示功能或者连接显示设备的电子设备上时，在电子设备上可显示有页面检查界面，基于此，结合图3(图3为本申请实施例提供的页面检查界面的示意图一)，提供如下实现方案：

在一种可能的实现方式中，页面检查界面上显示有第一输入控件，可响应于面向页面检查界面上第一输入控件的交互操作，获取参考页面图。

其中，第一输入控件例如可以是输入框、输入按键，用于输入参考页面图、参考页面图的标识信息和/或参考页面图的地址信息，比如，第一输入控件为图3中的“选择文件”按键，用户点击“选择文件”按键来输入参考页面图。

本实现方式中，用户通过与第一输入控件的交互操作，输入参考页面图、参考页面图的标识信息和/或参考页面图的地址信息。可响应于用户对第一输入空间的交互操作，获取用户输入的参考页面图，或者，获取参考页面图的标识信息，根据该标识信息从数据库中获取参考页面图，或者，获取参考页面图的地址信息，从该地址信息中访问并获取参考页面图。如此，提供了多种获取参考页面图的方式。

可选地，在获取参考页面图后，如图3所示，可在页面检查界面上显示参考页面图，便于用户查看是否参考页面图是否上传错误，提高用户体验。

在一种可能的实现方式中，页面检查界面上显示有第二输入空间，可响应于面向页面检查界面上第二输入控件的交互操作，获取待检查页面图。

其中，第二输入控件与第一输入控件为不同的交互控件，例如可以是输入框、输入按键，用于输入待检查页面图、待检查图的标识信息和/或待检查页面的地址信息。待检查页面的地址信息可以是待检查页面的页面地址。比如，图3中显示有目标地址的输入框，该输入框即第二输入控件，用于输入待检查页面的页面地址。

本实现方式中，用户通过与第二输入控件的交互操作，输入待检查页面图、待检查页面图的标识信息和/或待检查页面的地址信息。可响应于用户对第二输入空间的交互操作，获取用户输入的待检查页面图，或者，获取待检查页面图的标识信息，根据该标识信息从数据库中获取待检查页面图，或者，获取待检查页面的地址信息，从该地址信息中访问待检查页面，对待检查页面进行截图，得到待检查页面图。

可选地，在获取待检查页面图后，可在页面检查界面上显示待检查页面图，便于用户查看是否待检查页面图是否上传错误，提高用户体验。

在一种可能的实现方式中，在页面检查界面上显示有颜色提取控件，可响应于面向颜色提取控件的交互操作(例如点击操作、长按操作)，对参考页面图上的颜色区域进行颜色提取，得到参考颜色信息，对待检查页面图上的颜色区域进行颜色提取，得到待检测颜色信息。如此，用户可以根据自身需求来控制颜色提取时机，提高用户体验。

其中，颜色提取控件例如图3中的“提取色系”按键。

在一种可能的实现方式中，在页面检查界面上显示有预警添加控件，例如图3中的“添加预警”按键，可响应于面向预警添加控件的交互操作，将待检查页面图对应的页面添加为监控页面，在待检查页面图对应的页面为监控页面的情况下，如果待检测页面图与参考页面图之间的差异信息满足预警条件，则输出提示信息，该提示信息用于提示参考页面图和待检测页面存在异常，这里的存在异常表示两者的差异较大。

图4为本申请实施例提供的一种页面检查方法的流程示意图二。如图4所示，页面检查方法包括如下步骤：

S401，获取参考页面图和待检查页面图。

S402，对参考页面图上的颜色区域进行颜色提取，得到参考颜色信息，参考颜色信息包括至少一种参考颜色的属性信息，在参考颜色信息中，参考颜色的属性信息按照颜色区域在参考页面图的位置顺序排列。

S403，对待检查页面图上的颜色区域进行颜色提取，得到待检查颜色信息，待检查颜色信息包括至少一种待检查颜色的属性信息，在待检查颜色信息中，待检查颜色的属性信息按照颜色区域在待检查页面图的位置顺序排列。

其中，S401～S403的实现原理和技术效果可参照前述实施例，不再赘述。

S404，对参考页面图和待检查页面图进行相似度比较，得到页面相似度。

本实施例中，可以采用图像匹配算法或者图像相似度识别算法，对参考页面图和待检查页面图进行相似度比较，得到参考页面图与待检测页面图的相似度，即页面相似度。

可选地，通过将参考页面图上的像素点与待检测页面图上的像素点进行一一比较，得到页面相似度，以通过像素点的一一比较提高页面相似度的准确性。

在一种可能的实现方式中，S404包括：按照像素位置的对应关系，将参考页面图上的各个像素点与待检查页面图上的各个像素点进行一一比较，得到参考页面图与待检查页面图之间的相似像素点数量；基于参考页面图和待检查页面图，确定像素点总数；基于相似像素点数量相较于像素点总数的占比，确定页面相似度。

本实现方式中，将参考页面上的像素点与待检查页面上对应位置处的像素点进行比较，具体的，将参考页面上的第一个像素点与待检查页面上的第一个像素点进行比较，将参考页面上的第二个像素点与待检查页面上的第二个像素点进行比较，依此类推。如果参考页面上的像素点的像素值与待检查页面上相应位置处的像素点的像素值一致，或者，如果参考页面上的像素点的像素值与待检查页面上相应位置处的像素点的像素值之间的差值小于或等于阈值，则可认为该两个像素点为相似像素点。如此，可以确定参考页面图与待检查页面图之间的相似像素点数量，相似像素点数量是指相似像素点成对的数量，比如，参考页面上的n个像素点与待检查页面上的n个像素点为相似像素点，则相似像素点数量为n。考虑到参考页面图和待检测页面图可能图像大小不同，可选择参考页面图和待检测页面图中的其中一个页面图上像素点数量作为像素点总数。之后，可计算相似像素点数量与像素点总数的比值，得到相似像素点数量相较于像素点总数的占比，可确定页面相似度为该占比，也可以在该占比上乘以相应系数，得到页面相似度。

进一步地，在基于参考页面图和待检查页面图，确定像素点总数的过程中，可比较参考页面图与待检查页面图的图像大小，如果参考页面图的尺寸大于或者等于待检测页面图的尺寸，则确定像素点总数为参考页面图上的像素点数量，否则确定像素点总数为待检测页面图上的像素点数量。从而，通过选取尺寸较大的页面图上的像素点数量作为像素点总数，更准确地评估参考页面图与待检查页面图的相似度。

进一步地，像素点的像素值可以是像素点在颜色通道上的取值，比如，像素点的RGB值，即像素点在红、绿、蓝三个颜色通道的取值。从而，从色彩上去评估参考页面图与待检查页面图的相似度，提高相似度的准确性。

可选地，对参考页面图进行特征提取，得到参考页面图对应的提取特征，对待检查页面图进行特征提取，得到待检查页面图对应的提取特征，通过将参考页面图对应的提取特征与待检查页面图对应的提取特征进行匹配，得到页面相似度。从而，考虑到页面图可能经过了缩放、变形、旋转等处理，导致每个像素点可能都无法匹配上，无法准确得到页面相似度，所以通过特征提取和特征匹配的方式，来提高页面相似度的准确性。

在一种可能的实现方式中，S404包括：对参考页面图进行特征提取，得到参考页面图的第一特征点信息；对待检查页面图进行特征提取，得到待检查页面图的第二特征点信息；通过对第一特征点信息和第二特征点信息进行匹配，得到参考页面图与待检查页面图之间的相似特征点数量；基于第一特征点信息和第二特征点信息，确定特征点总数；基于相似特征点数量相较于特征点总数的占比，确定页面相似度。

本实施例中，可通过特征提取算法对参考页面图进行特征提取，得到参考页面图的第一特征信息，第一特征信息可以包括第一特征点(即参考页面图上的特征点，为了便于区分，将其称为第一特征点)的位置信息和特征描述内容(比如特征值)；可通过特征提取算法对待检查页面图进行特征提取，得到待检查页面图的第二特征信息，第二特征信息可以包括第二特征点(即待检查页面上的特征点，为了便于区分，将其称为第二特征点)的位置信息和特征描述内容(比如特征值)。对第一特征点信息和第二特征点信息进行匹配，得到参考页面图与待检查页面图之间的相似特征点数量，其中，可以根据位置对应关系，将第一特征点的特征描述内容与位置对应的第二特征点的特征描述内容进行匹配，如果第一特征点的特征描述内容与第二特征点的特征描述内容一致，或者两者的特征差值小于阈值，则确定第一特征点与第二特征点为相似特征点，如此可以得到相似特征点数量。在第一特征点的数量和第二特征点的数量中，确定特征点总数；通过计算相似特征点数量与特征点总数的比值，得到相似特征点相较于特征点总数的占比，可确定页面相似度为该占比，也可以确定页面相似度为该占比与预设系数的乘积。

可选地，特征提取算法可采用尺度不变特征转换(scale invariant featuretransform，SIFT)算法，SIFI算法是基于计算机视觉的特征提取算法，可以用于在不受图像形变、旋转等影响的情况下找到图像上的关键点信息，该关键点信息被称为特征描述子。可通过SIFI算法对参考页面图进行特征提取，得到参考页面图的第一特征描述子；可通过SIFI算法对参考页面图进行特征提取，得到参考页面图的第二特征描述子；通过对第一特征描述子和第二特征描述子进行匹配，得到参考页面图与待检查页面图之间的相似特征点数量。从而，利用SIFT算法提高页面相似度的准确性。

可选地，在对通过对第一特征点信息和第二特征点信息进行匹配，得到参考页面图与待检查页面图之间的相似特征点数量的过程中，如果参考页面图的尺寸大于或者等于待检查页面图的尺寸，则相似特征点数量可以为参考页面图中的特征点包含待检查页面图中的特征点的数量；如果待检测页面的尺寸大于参考页面图的尺寸，则相似特征点数量可以为待检查页面图中的特征点包含参考页面图中的特征点的数量。

考虑到图像尺寸不一致的情况下，如果尺寸较小的图的特征点均包含在尺寸较大的图的特征点中，容易判断出尺寸较小的图与尺寸较大的图的相似度为100％，而实际相似度可能不是完全相似，为解决该问题，提高相似度判断的准确性，在对第一特征点信息和第二特征点信息进行匹配，得到参考页面图与待检查页面图之间的相似特征点数量的过程中，可通过邻近距离比值法(nearest neighbor distance ratio，NNDR)对第一特征点信息和第二特征点信息进行匹配，得到参考页面图与待检查页面图之间的相似特征点数量，以通过NNDR提高相似度判断的准确性。

S405，页面相似度是否大于或者等于相似度阈值。

其中，可预先配置相似度阈值。

如果页面相似度大于或者等于相似度阈值，则执行S407，否则执行S406。

S406，输出提示信息，提示信息用于提示参考页面图和待检查页面图存在异常。

其中，S406为可选步骤。

本实施例中，如果页面相似度小于相似度阈值，则说明参考页面图与待检查页面图之间的差异较大，可输出提示信息，提示参考页面图和待检查页面图存在异常，用户看到该提示信息后，可以检查下参考页面图、待检查页面图是否上传错误，或者待检查页面图的实现效果与参考页面图是否相差太大。

其中，在执行S406后，可执行S407，也可以结束页面检测，以避免页面输入错误而在页面对比上浪费资源，图4以执行S406之后结束页面检测为例。

S407，对参考颜色的属性信息和待检查颜色的属性信息进行比较，得到参考页面图与待检查页面图在色彩使用上的差异信息。

S408，输出参考颜色信息、待检查颜色信息和差异信息。

其中，S407和S408的实现原理和技术效果可参照前述实施例，不再赘述。

本申请实施例中，先进行参考页面图与待检测页面图的相似度比较，在相似度大于相似度阈值的情况下，再对参考页面图和待检测页面图进行色彩使用上的对比，得到参考页面图与待检查页面图在色彩使用上的差异信息。从而，通过多环节的对比，提高页面检查的准确性和可靠性，也可以在一定程度上节省资源。

在一些实施例中，参考颜色的属性信息包括参考颜色的颜色值和参考颜色的透明度，待检查颜色的属性信息包括待检查颜色的颜色值和待检查颜色的透明度，参考页面图与待检查页面图之间的差异信息包括待检查颜色与参考颜色之间的颜色值误差和待检查颜色与参考颜色之间的透明度误差。基于此，对参考颜色的属性信息和待检查颜色的属性信息进行比较，得到参考页面图与待检查页面图在色彩使用上的差异信息，可包括：将待检查颜色的颜色值与参考颜色的颜色值进行比较，得到待检查颜色与参考颜色之间的颜色值误差；将待检查颜色的透明度与参考颜色的透明度进行比较，得到待检查颜色与参考颜色之间的透明度误差。从而，从颜色值、透明度两方面衡量参考页面图与待检查页面图在色彩使用上的差异，提高色彩使用比较的准确性。

可选地，确定待检查颜色与参考颜色之间的颜色值误差为待检查颜色的颜色值与参考颜色的颜色值之间的差值；可确定待检查颜色与参考颜色之间的透明度误差为待检查颜色的透明度与参考颜色的透明度之间的差值。

又可选地，计算待检查颜色的颜色值与参考颜色的颜色值之间的差值，计算该差值与参考颜色的颜色值的比值，确定待检查颜色与参考颜色之间的颜色值误差为该比值，该比值反映了待检测颜色相较于参考颜色的偏差程度；计算待检查颜色的透明度与参考颜色的透明度之间的差值，计算该差值与参考颜色的透明度的比值，确定待检查颜色与参考颜色之间的透明度误差为该比值，该比值反映了待检测颜色相较于参考颜色的偏差程度。从而，通过偏差程度更直观地反映待检测颜色对参考颜色的还原情况、接近情况。

在一些实施例中，参考页面图与待检查页面图之间的差异信息还包括如下至少一种：待检查页面图与参考页面图之间的总色值差和待检查页面图相较于参考页面图的色彩偏离度。可根据待检查颜色的颜色值与参考颜色的颜色值之间的差值，确定总色值差；和/或，对颜色值误差和透明度误差进行融合，得到色彩偏离度。从而，通过总色差值和色彩偏离度，反映待检查页面图与参考页面图在整体上的差异情况。

本实施例中，可按照颜色区域的位置对应关系，计算待检查颜色的颜色值与参考颜色的颜色值之间的差值。具体的，计算第一区域对应的待检查颜色的颜色值与第二区域对应的参考颜色的颜色值之间的差值，第一区域为参考页面图上的颜色区域，第二区域为待检查页面图上的颜色区域，第一区域在参考页面图上的图像位置与第二区域在待检查页面图上的图像位置相同。从而，按照位置对应关系提高颜色值差值的准确性。如此，在颜色区域为多个的情况下，可以计算出多个差值，基于该多个差值，确定总色差值。在计算色彩偏离度时，可以通过对颜色值误差和透明度误差进行加权求和的方式，计算得到色彩偏离度，还可以对颜色值误差和透明度误差求平均的方式，计算得到色彩偏离度。

在一种可能的实现方式中，考虑到待检查颜色可为多种，参考颜色也可为多种，在按照颜色区域的位置对应关系，计算待检查颜色的颜色值与参考颜色的颜色值之间的差值之后，可对待检查颜色的颜色值与参考颜色的颜色值之间的差值进行求和，得到总色值差。

在又一种可能的实现方式中，在计算待检查颜色的颜色值与参考颜色的颜色值之间的差值之后，如果差值为多个，则可以判断多个差值中大于阈值的差值数量，确定总色值差为该差值数量，从而，统计与参考颜色之间的偏差较大的待检查颜色的数量，便于用户通过总色值差了解具体有多少个颜色发生较大的偏差。

图5为本申请实施例提供的页面检查界面的示意图二，图5中的部分显示内容与图3一致，与图3一致的显示内容在此不进行赘述。如图5所示，可响应于用户点击“提取色系”按键，显示参考页面图与待检查页面图的对比结果。在对比结果中，可以显示：参考页面图；待检测页面图；参考页面图对应的提取色板(即前述实施例中的参考颜色信息)，在该提取色板中，多个参考颜色的属性信息按顺序排列，参考颜色的属性信息包括参考颜色对应的十六进制颜色码(hex格式)和透明度；待检查页面图对应的提取色板(即前述实施例中的待检查颜色信息)，在该提取色板中，多个待检查颜色的属性信息按顺序排列，待检查颜色的属性信息包括待检查颜色对应的十六进制颜色码(hex格式)和透明度；结果分析，在结果分析中显示了与参考颜色不一致的待检查颜色、该待检查颜色对应的参考颜色以及该待检查颜色与该参考颜色之间的差异信息，差异信息包括了色值误差(即前述实施例中的颜色值误差，通过百分比进行表示)、透明度误差、色值差(即前述实施例中的总色值差)、偏离度(即前述实施例中的色彩偏离度)。此外，还显示有参考页面图与待检查页面图之间的对比耗时。

图6为本申请实施例提供的页面检查装置的结构示意图。如图6所示，本实施例提供的页面检查装置600，包括：

获取模块601，用于获取参考页面图和待检查页面图；

第一提取模块602，用于对参考页面图上的颜色区域进行颜色提取，得到参考颜色信息，参考颜色信息包括至少一种参考颜色的属性信息，在参考颜色信息中，参考颜色的属性信息按照颜色区域在参考页面图的位置顺序排列；

第二提取模块603，用于对待检查页面图上的颜色区域进行颜色提取，得到待检查颜色信息，待检查颜色信息包括至少一种待检查颜色的属性信息，在待检查颜色信息中，待检查颜色的属性信息按照颜色区域在待检查页面图的位置顺序排列；

对比模块604，用于对参考颜色的属性信息和待检查颜色的属性信息进行比较，得到参考页面图与待检查页面图在色彩使用上的差异信息；

输出模块605，用于输出参考颜色信息、待检查颜色信息和差异信息。

在一些实施例中，对比模块604具体用于：对参考页面图和待检查页面图进行相似度比较，得到页面相似度；如果页面相似度大于或者等于相似度阈值，则对参考颜色的属性信息和待检查颜色的属性信息进行比较，得到差异信息。

在一些实施例中，对比模块604具体用于：按照像素位置的对应关系，将参考页面图上的各个像素点与待检查页面图上的各个像素点进行一一比较，得到参考页面图与待检查页面图之间的相似像素点数量；基于参考页面图和待检查页面图，确定像素点总数；基于相似像素点数量相较于像素点总数的占比，确定页面相似度。

在一些实施例中，对比模块604具体用于：对参考页面图进行特征提取，得到参考页面图的第一特征点信息；对待检查页面图进行特征提取，得到待检查页面图的第二特征点信息；通过对第一特征点信息和第二特征点信息进行匹配，得到参考页面图与待检查页面图之间的相似特征点数量；基于第一特征点信息和第二特征点信息，确定特征点总数；基于相似特征点数量相较于特征点总数的占比，确定页面相似度。

在一些实施例中，输出模块605还用于：如果页面相似度小于相似度阈值，则输出提示信息，提示信息用于提示参考页面图和待检查页面存在异常。

在一些实施例中，参考颜色的属性信息包括参考颜色的颜色值和参考颜色的透明度，待检查颜色的属性信息包括待检查颜色的颜色值和待检查颜色的透明度，差异信息包括待检查颜色与参考颜色之间的颜色值误差和待检查颜色与参考颜色之间的透明度误差，对比模块604具体用于：将待检查颜色的颜色值与参考颜色的颜色值进行比较，得到待检查颜色与参考颜色之间的颜色值误差；将待检查颜色的透明度与参考颜色的透明度进行比较，得到待检查颜色与参考颜色之间的透明度误差。

在一些实施例中，差异信息还包括如下至少一种：待检查页面图与参考页面图之间的总色值差和待检查页面图相较于参考页面图的色彩偏离度，页面检查装置还包括融合模块(图中未示出)，用于：根据待检查颜色的颜色值与参考颜色的颜色值之间的差值，确定总色值差，和/或，对颜色值误差和透明度误差进行融合，得到色彩偏离度。

图7为本申请实施例提供的一种电子设备的结构示意图。如图7所示，该电子设备700可以包括：至少一个处理器701和存储器702。图7示出的是以一个处理器为例的电子设备。

存储器702，用于存放处理器701的程序。具体地，程序可以包括程序代码，程序代码包括计算机操作指令。

存储器702可能包含高速RAM存储器，也可能还包括非易失性存储器(non-volatile memory)，例如至少一个磁盘存储器。

处理器701配置为用于执行存储器702存储的计算机程序，以实现以上各方法实施例中页面检查方法中的各步骤。

其中，处理器701可能是一个中央处理器(central processing unit，简称为CPU)，或者是特定集成电路(application specific integrated circuit，简称为ASIC)，或者是被配置成实施本申请实施例的一个或多个集成电路。

可选地，存储器702既可以是独立的，也可以跟处理器701集成在一起。当存储器702是独立于处理器701之外的器件时，电子设备700，还可以包括：总线703，用于连接处理器701以及存储器702。总线可以是工业标准体系结构(industry standard architecture，简称为ISA)总线、外部设备互连(peripheral component，PCI)总线或扩展工业标准体系结构(extended industry standard architecture，EISA)总线等。总线可以分为地址总线、数据总线、控制总线等，但并不表示仅有一根总线或一种类型的总线。

可选的，在具体实现上，如果存储器702和处理器701集成在一块芯片上实现，则存储器702和处理器701可以通过内部界面完成通信。

本申请还提供了一种计算机可读存储介质，该计算机可读存储介质可以包括：U盘、移动硬盘、只读存储器(read-only memory，ROM)、随机存取存储器(random accessmemory，RAM)、磁盘或者光盘等各种可以存储程序代码的介质，具体的，该计算机可读存储介质中存储有计算机执行指令，当电子设备的至少一个处理器执行该计算机执行指令时，电子设备执行上述的各种实施方式提供的页面检查方法的各个步骤。

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

本领域技术人员在考虑说明书及实践这里公开的发明后，将容易想到本申请的其它实施方案。本申请旨在涵盖本申请的任何变型、用途或者适应性变化，这些变型、用途或者适应性变化遵循本申请的一般性原理并包括本申请未公开的本技术领域中的公知常识或惯用技术手段。说明书和实施例仅被视为示例性的，本申请的真正范围和精神由下面的权利要求书指出。

应当理解的是，本申请并不局限于上面已经描述并在附图中示出的精确结构，并且可以在不脱离其范围进行各种修改和改变。本申请的范围仅由所附的权利要求书来限制。

Claims (10)

1.一种页面检查方法，其特征在于，包括：

获取参考页面图和待检查页面图；

对所述参考页面图上的颜色区域进行颜色提取，得到参考颜色信息，所述参考颜色信息包括至少一种参考颜色的属性信息，在所述参考颜色信息中，所述参考颜色的属性信息按照所述颜色区域在所述参考页面图的位置顺序排列；

对所述待检查页面图上的颜色区域进行颜色提取，得到待检查颜色信息，所述待检查颜色信息包括至少一种待检查颜色的属性信息，在所述待检查颜色信息中，所述待检查颜色的属性信息按照所述颜色区域在所述待检查页面图的位置顺序排列；

对所述参考颜色的属性信息和所述待检查颜色的属性信息进行比较，得到所述参考页面图与所述待检查页面图在色彩使用上的差异信息；

输出所述参考颜色信息、所述待检查颜色信息和所述差异信息。

2.根据权利要求1所述的页面检查方法，其特征在于，所述对所述参考颜色的属性信息和所述待检查颜色的属性信息进行比较，得到所述参考页面图与所述待检查页面图在色彩使用上的差异信息，包括：

对所述参考页面图和所述待检查页面图进行相似度比较，得到页面相似度；

如果所述页面相似度大于或者等于相似度阈值，则对所述参考颜色的属性信息和所述待检查颜色的属性信息进行比较，得到所述差异信息。

3.根据权利要求2所述的页面检查方法，其特征在于，所述对所述参考页面图和所述待检查页面图进行相似度比较，得到页面相似度，包括：

按照像素位置的对应关系，将所述参考页面图上的各个像素点与所述待检查页面图上的各个像素点进行一一比较，得到所述参考页面图与所述待检查页面图之间的相似像素点数量；

基于所述参考页面图和所述待检查页面图，确定像素点总数；

基于所述相似像素点数量相较于所述像素点总数的占比，确定所述页面相似度。

4.根据权利要求2所述的页面检查方法，其特征在于，所述对所述参考页面图和所述待检查页面图进行相似度比较，得到页面相似度，包括：

对所述参考页面图进行特征提取，得到所述参考页面图的第一特征点信息；

对所述待检查页面图进行特征提取，得到所述待检查页面图的第二特征点信息；

通过对所述第一特征点信息和所述第二特征点信息进行匹配，得到所述参考页面图与所述待检查页面图之间的相似特征点数量；

基于所述第一特征点信息和所述第二特征点信息，确定特征点总数；

基于所述相似特征点数量相较于所述特征点总数的占比，确定所述页面相似度。

5.根据权利要求2所述的页面检查方法，其特征在于，所述对所述参考页面图和所述待检查页面图进行相似度比较，得到页面相似度之后，还包括：

如果所述页面相似度小于所述相似度阈值，则输出提示信息，所述提示信息用于提示所述参考页面图和所述待检查页面存在异常。

6.根据权利要求1至5中任一项所述的页面检查方法，其特征在于，所述参考颜色的属性信息包括所述参考颜色的颜色值和所述参考颜色的透明度，所述待检查颜色的属性信息包括所述待检查颜色的颜色值和所述待检查颜色的透明度，所述差异信息包括所述待检查颜色与所述参考颜色之间的颜色值误差和所述待检查颜色与所述参考颜色之间的透明度误差，所述对所述参考颜色的属性信息和所述待检查颜色的属性信息进行比较，得到所述参考页面图与所述待检查页面图在色彩使用上的差异信息，包括：

将所述待检查颜色的颜色值与所述参考颜色的颜色值进行比较，得到所述待检查颜色与所述参考颜色之间的颜色值误差；

将所述待检查颜色的透明度与所述参考颜色的透明度进行比较，得到所述待检查颜色与所述参考颜色之间的透明度误差。

7.根据权利要求6所述的页面检查方法，其特征在于，所述差异信息还包括如下至少一种：所述待检查页面图与所述参考页面图之间的总色值差和所述待检查页面图相较于所述参考页面图的色彩偏离度，所述页面检查方法还包括：

根据所述待检查颜色的颜色值与所述参考颜色的颜色值之间的差值，确定所述总色值差，和/或，对所述颜色值误差和所述透明度误差进行融合，得到所述色彩偏离度。

8.一种页面检查装置，其特征在于，包括：

获取模块，用于获取参考页面图和待检查页面图；

第一提取模块，用于对所述参考页面图上的颜色区域进行颜色提取，得到参考颜色信息，所述参考颜色信息包括至少一种参考颜色的属性信息，在所述参考颜色信息中，所述参考颜色的属性信息按照所述颜色区域在所述参考页面图的位置顺序排列；

第二提取模块，用于对所述待检查页面图上的颜色区域进行颜色提取，得到待检查颜色信息，所述待检查颜色信息包括至少一种待检查颜色的属性信息，在所述待检查颜色信息中，所述待检查颜色的属性信息按照所述颜色区域在所述待检查页面图的位置顺序排列；

对比模块，用于对所述参考颜色的属性信息和所述待检查颜色的属性信息进行比较，得到所述参考页面图与所述待检查页面图在色彩使用上的差异信息；

输出模块，用于输出所述参考颜色信息、所述待检查颜色信息和所述差异信息。

9.一种电子设备，其特征在于，包括：处理器，以及与所述处理器通信连接的存储器；

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

所述处理器执行所述存储器存储的计算机执行指令，以实现如权利要求1至7中任一项所述的页面检查方法。

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