CN104572056A - 一种页面对比的方法及装置 - Google Patents

Abstract

一种页面对比的方法和装置；所述方法包括：在预定时间长度中，分别在多个时刻对第一页面进行截图，得到多个第一图片；以各所述第一图片中的任一个作为基准图片，分别将其它各第一图片与所述基准图片进行对比；根据对比结果，将存在不同的部分识别为动态变化区域。本申请能够在页面对比的过程中如何避免动态变化区域的影响。

Description

一种页面对比的方法及装置

技术领域

本发明涉及网络领域，尤其涉及一种页面对比的方法及装置。

背景技术

图片对比大量地应用在网站自动化验证过程中，如图1所示，包括以下步骤101～104。

101、在浏览器中输入需要截图的页面的URL（统一资源定位符）；

102、对于显示出的当前页面，分别在不同情况下截图。

103、对比截图所得到的各图片。

104、判断各图片之间是否存在不同，如果是存在不同，则验证失败，表明所述截图对应的网页之间具有不同点并输出不同点；如果没有存在不同，则验证通过，表明所述截图对应的网页之间相同。

步骤102中所述的在不同情况下截图，可以包括如下两种类型中的不同情况：

（1）主干分支截图对比，或者某历史版本的对比，即对当前页面进行截图，同时对浏览器中主干版本或者某历史版本中对应于该当前页面的页面也进行截图，将两张截图进行对比。其中，当前页面的版本为一种情况，而当前页面对应的主干版本或者某历史版本为另一种情况。

（2）多浏览器截图对比，指当前页面在多个不同类型的浏览器内同时打开，分别在多个浏览器中截图，然后将每张截图与所述多个浏览器中的一个基准浏览器的截图两两对比。其中，多个不同类型的浏览器对应的当前页面的版本为多种不同情况。

这两种类型的图片对比算法在面对动态变化的区域，都会出现误报情况；动态变化的区域是指网页中能够随着时间的推移页面自动变化的区域，如广告轮播区域，在不同的时刻截下来的图片会不一样，而这种不一样常常会导致图片对比算法误报。

目前的解决方法是，人手工地将动态变化的区域从对比区域或者对比的结果里拿掉。这就需要在自动化过程里插入手动排除的动作，打断了自动化过程，使得自动化的效率和效果大打折扣；同时随着前端技术的发展，动态变化的页面越来越多，可以动态变化的区域也越来越多，手动地排除这些区域需要花费大量的手工劳动。

发明内容

本申请要解决的技术问题是在页面对比的过程中如何避免动态变化区域的影响。

为了解决上述问题，本申请提供了一种页面对比的方法，包括：

在预定时间长度中，分别在多个时刻对第一页面进行截图，得到多个第一图片；

以各所述第一图片中的任一个作为基准图片，分别将其它各第一图片与所述基准图片进行对比；

根据对比结果，将存在不同的部分识别为动态变化区域。

可选地，所述根据对比结果，将存在不同的部分识别为动态变化区域的步骤包括：

根据对比结果，在所述基准图片上标出不同的像素点；

将所述基准图片中标出的像素点组成的区域识别为动态变化区域。

可选地，所述分别在多个时刻对第一页面进行截图的步骤包括：

按照均匀的时间间隔在多个不同时刻对所述第一页面进行截图。

可选地，所述的方法还包括：

在不同情况下对所述第一页面进行截图，得到多个第二图片；

分别在各第二图片中去除所识别出的动态变化区域；

对比去除动态变化区域后的各所述第二图片。

可选地，分别在多个时刻对第一页面进行截图的步骤包括：

对所述第一页面的当前版本进行截图；

或对多个浏览器中任一个浏览器或预定的基准浏览器所显示的第一页面进行截图。

本申请还提供了一种页面对比的装置，包括：

第一截图单元，用于在预定时间长度中，分别在多个时刻对第一页面进行截图，得到多个第一图片；

第一对比单元，用于以各所述第一图片中的任一个作为基准图片，分别将其它各第一图片与所述基准图片进行对比；

识别单元，用于根据对比结果，将存在不同的部分识别为动态变化区域。

可选地，所述识别单元根据对比结果，将存在不同的部分识别为动态变化区域是指：

识别单元根据对比结果，在所述基准图片上标出不同的像素点；将所述基准图片中标出的像素点组成的区域识别为动态变化区域。

可选地，所述第一截图单元分别在多个时刻对第一页面进行截图是指：

第一截图单元按照均匀的时间间隔在多个不同时刻对所述第一页面进行截图。

可选地，所述的装置还包括：

第二截图单元，用于在不同情况下对所述第一页面进行截图，得到多个第二图片；

去除单元，用于在多个第二图片中分别去除所识别出的动态变化区域；

第二对比单元，用于对比去除动态变化区域后的各所述第二图片。

可选地，第一截图单元分别在多个时刻对第一页面进行截图是指：

第一截图单元对所述第一页面的当前版本进行截图，或对多个浏览器中任一个浏览器或预定的基准浏览器所显示的第一页面进行截图。

本申请的至少一个实施例能够自动发现动态变化的区域，在后续的页面对比中可以去除该区域或忽略该区域的对比结果，从而大大提高对比算法的准确度。本申请的又一个实施例按相同的时间间隔进行截图，可保证截图能反应出动态变化区域中图像的改变。当然，实施本申请的任一产品必不一定需要同时达到以上所述的所有优点。

附图说明

图1为现有技术中的图片对比算法的流程示意图；

图2为实施例一的一种页面对比的方法的流程示意图；

图3为实施例一中具体例子的流程示意图；

图4为实施例二的页面对比的装置的示意框图。

具体实施方式

下面将结合附图及实施例对本申请的技术方案进行更详细的说明。

需要说明的是，如果不冲突，本申请实施例以及实施例中的各个特征可以相互结合，均在本申请的保护范围之内。另外，虽然在流程图中示出了逻辑顺序，但是在某些情况下，可以以不同于此处的顺序执行所示出或描述的步骤。

在一个典型的配置中，进行页面对比的装置可包括多个处理器(CPU)、一个或多个输入/输出接口、网络接口和内存。

内存可能包括计算机可读介质中的非永久性存储器，随机存取存储器(RAM)和/或非易失性内存等形式，如只读存储器(ROM)或闪存(flashRAM)。内存是计算机可读介质的示例。

计算机可读介质包括永久性和非永久性、可移动和非可移动媒体可以由任何方法或技术来实现信息存储。信息可以是计算机可读指令、数据结构、程序的模块或其他数据。计算机的存储介质的例子包括，但不限于相变内存(PRAM)、静态随机存取存储器(SRAM)、动态随机存取存储器(DRAM)、其他类型的随机存取存储器(RAM)、只读存储器(ROM)、电可擦除可编程只读存储器(EEPROM)，快闪记忆体或其他内存技术、只读光盘只读存储器(CD-ROM)、数字多功能光盘(DVD)或其他光学存储、磁盒式磁带，磁带磁磁盘存储或其他磁性存储设备或任何其他非传输介质，可用于存储可以被计算设备访问的信息。按照本文中的界定，计算机可读介质不包括非暂存电脑可读媒体(transitory media)，如调制的数据信号和载波。

实施例一，一种页面对比的方法，如图2所示，包括：

S201、在预定时间长度中，分别在多个时刻对第一页面进行截图，得到多个第一图片；

S202、以各所述第一图片中的任一个作为基准图片，分别将其它各第一图片与所述基准图片进行对比；

S203、根据对比结果，将存在不同的部分识别为动态变化区域。

本实施例中，可以但不限于将第一个所述第一图片作为基准图片，当然也可以选用其它的第一图片作为基准图片。

本实施例中，所述第一页面是指待截图的当前页面；如果是进行主干分支截图对比，则步骤201中是对第一页面的当前版本进行截图；如果是进行多浏览器截图对比，则步骤201中是对多个浏览器中任一个浏览器或预定的基准浏览器所显示的第一页面进行截图。

本实施例的一种实施方式中，所述步骤S203具体可以包括：

根据对比结果，在所述基准图片上标出不同的像素点；

将所述基准图片中标出的像素点组成的区域识别为动态变化区域。

比如得到十个第一图片，假设将其中第一个所述第一图片作为基准图片，将第二个～第十个第一图片分别和基准图片对比，每次对比时如果发现存在不同的像素点，则将该像素点在所述基准图片上标出；当全部对比完成后，所述基准图片上会标出和各其余第一图片不同的像素点。

本实施方式中，所述基准图片中标出的像素点组成的区域即所标出的像素点的合集在所述第一页面中所代表的区域。

在其它实施方式中，也可以是根据对比结果直接标出不同的区域，标出的区域就作为所述动态变化区域。

本实施例的一种实施方式中，分别在多个时刻对第一页面进行截图的步骤具体可以包括：

按照均匀的时间间隔在多个不同时刻对所述第一页面进行截图。

所述预定时间长度及截图的时间间隔可以根据动态变化区域通常的变化频率进行设定，比如动态轮播的图片播放间隙平均时间为10秒，一般是不超过3张，默认不超过5组动态照片，那么可以将预定时间长度设定为1分钟，按5秒的时间间隔匀速截图，共截取第一图片20张。

在其它实施方式中，也可以不采用均匀截图的方式，而是在任意的不同时刻进行截图，保证所截图的各时刻不过于集中即可。

本实施例的一种实施方式中，所述方法还可以包括：

204、在不同情况下对所述第一页面进行截图，得到多个第二图片；

205、分别在各第二图片中去除所识别出的动态变化区域；

206、对比去除动态变化区域后的各所述第二图片。

所述第一图片是在同一个情况下的不同时刻对所述第一页面的截图，而所述第二图片则是在不同情况下对所述第一页面的截图；步骤204所述的在不同情况下对所述第一页面进行截图，包括对第一页面的各个不同版本的截图，比如进行主干分支截图对比，则所述第二图片是对第一页面的当前版本和多个历史版本的截图；再比如进行多浏览器截图对比，则所述第二图片是对多个浏览器所显示的第一页面的截图，不同浏览器所显示的所述第一页面可看成是第一页面的多个不同版本。步骤204可以在步骤201～203之前或之后进行，也可以和步骤201～203并行进行。

本实施方式中，去除所识别出的动态变化区域可以但不限于是指忽略或删除属于动态变化区域的像素点，这样在步骤205中的对比结果将不会受到动态变化区域的影响。在其它实施方式中，也可以是对第二图片对比后，从中剔除属于所述动态变化区域的对比结果。

下面用一个具体的例子来说明本实施例，该例子是对多个情况下的第一页面进行对比，如图3所示，包括步骤301～308。

301、在浏览器中输入需要截图的第一页面的URL；

302、对于显示出的第一页面，分别在不同情况下截图，得到多个第二图片；比如对第一页面的当前版本和多个历史版本分别截图，或是对多个浏览器所显示的第一页面分别截图。

303、在一个预定时间段内，在同一个情况下的不同时刻对所述第一页面截图，得到多个第一图片。

304、将多个第一图片中的第一个或任一个作为基准图片，分别将所述基准图片和其它第一图片进行对比。

305、根据对比结果识别出动态变化的区域。

步骤303～305和302的前后顺序不限，也可以并行进行。

306、在得到的各第二图片中去除动态变化区域。

307、对比去除动态变化区域后的各第二图片。

308、根据对比结果判断是否存在不同，如果任意两个第二图片之间存在不同，则验证失败，输出第二图片中不同的区域（比如但不限于以像素点的位置表示）；如果各第二图片之间没有存在不同，则验证通过。其中，验证失败是指第一页面对应的各版本之间存在不同；验证通过是指第一页面对应的各版本之间相同。

实施例二、一种页面对比的装置，如图4所示，包括：

第一截图单元41，用于在预定时间长度中，分别在多个时刻对第一页面进行截图，得到多个第一图片；

第一对比单元42，用于以各所述第一图片中的任一个作为基准图片，分别将其它各第一图片与所述基准图片进行对比；

识别单元43，用于根据对比结果，将存在不同的部分识别为动态变化区域。

本实施例的一种实施方式中，所述识别单元43根据对比结果，将存在不同的部分识别为动态变化区域具体可以是指：

识别单元43根据对比结果，在所述基准图片上标出不同的像素点；将所述基准图片中标出的像素点组成的区域识别为动态变化区域。

本实施例的一种实施方式中，所述第一截图单元41分别在多个时刻对第一页面进行截图具体可以是指：

第一截图单元41按照均匀的时间间隔在多个不同时刻对所述第一页面进行截图。

本实施例的一种实施方式中，所述装置还可以包括：

第二截图单元44，用于在不同情况下对所述第一页面进行截图，得到多个第二图片；

去除单元45，用于在多个第二图片中分别去除所识别出的动态变化区域；

第二对比单元46，用于对比去除动态变化区域后的各所述第二图片。

本实施例的一种实施方式中，第一截图单元41分别在多个时刻对第一页面进行截图具体可以是指：

第一截图单元41对所述第一页面的当前版本进行截图，或对多个浏览器中任一个浏览器或预定的基准浏览器所显示的第一页面进行截图。

本领域普通技术人员可以理解上述方法中的全部或部分步骤可通过程序来指令相关硬件完成，所述程序可以存储于计算机可读存储介质中，如只读存储器、磁盘或光盘等。可选地，上述实施例的全部或部分步骤也可以使用一个或多个集成电路来实现。相应地，上述实施例中的各模块/单元可以采用硬件的形式实现，也可以采用软件功能模块的形式实现。本申请不限制于任何特定形式的硬件和软件的结合。

当然，本申请还可有其他多种实施例，在不背离本申请精神及其实质的情况下，熟悉本领域的技术人员当可根据本申请作出各种相应的改变和变形，但这些相应的改变和变形都应属于本申请的权利要求的保护范围。

Claims (10)

1.一种页面对比的方法，包括：

在预定时间长度中，分别在多个时刻对第一页面进行截图，得到多个第一图片；

以各所述第一图片中的任一个作为基准图片，分别将其它各第一图片与所述基准图片进行对比；

根据对比结果，将存在不同的部分识别为动态变化区域。

2.如权利要求1所述的方法，其特征在于，所述根据对比结果，将存在不同的部分识别为动态变化区域的步骤包括：

根据对比结果，在所述基准图片上标出不同的像素点；

将所述基准图片中标出的像素点组成的区域识别为动态变化区域。

3.如权利要求1所述的方法，其特征在于，所述分别在多个时刻对第一页面进行截图的步骤包括：

按照均匀的时间间隔在多个不同时刻对所述第一页面进行截图。

4.如权利要求1所述的方法，其特征在于，还包括：

在不同情况下对所述第一页面进行截图，得到多个第二图片；

分别在各第二图片中去除所识别出的动态变化区域；

对比去除动态变化区域后的各所述第二图片。

5.如权利要求1所述的方法，其特征在于，分别在多个时刻对第一页面进行截图的步骤包括：

对所述第一页面的当前版本进行截图；

或对多个浏览器中任一个浏览器或预定的基准浏览器所显示的第一页面进行截图。

6.一种页面对比的装置，其特征在于，包括：

第一截图单元，用于在预定时间长度中，分别在多个时刻对第一页面进行截图，得到多个第一图片；

第一对比单元，用于以各所述第一图片中的任一个作为基准图片，分别将其它各第一图片与所述基准图片进行对比；

识别单元，用于根据对比结果，将存在不同的部分识别为动态变化区域。

7.如权利要求6所述的装置，其特征在于，所述识别单元根据对比结果，将存在不同的部分识别为动态变化区域是指：

识别单元根据对比结果，在所述基准图片上标出不同的像素点；将所述基准图片中标出的像素点组成的区域识别为动态变化区域。

8.如权利要求6所述的装置，其特征在于，所述第一截图单元分别在多个时刻对第一页面进行截图是指：

第一截图单元按照均匀的时间间隔在多个不同时刻对所述第一页面进行截图。

9.如权利要求6所述的装置，其特征在于，还包括：

第二截图单元，用于在不同情况下对所述第一页面进行截图，得到多个第二图片；

去除单元，用于在多个第二图片中分别去除所识别出的动态变化区域；

第二对比单元，用于对比去除动态变化区域后的各所述第二图片。

10.如权利要求6所述的装置，其特征在于，第一截图单元分别在多个时刻对第一页面进行截图是指：

第一截图单元对所述第一页面的当前版本进行截图，或对多个浏览器中任一个浏览器或预定的基准浏览器所显示的第一页面进行截图。