[发明专利]一种网页设计对比方法、装置、设备及可读存储介质

权利要求书

1.一种网页设计对比方法，其特征在于，包括：

接收针对根据目标网页对应的预设设计图开发完成的目标网页的网页设计对比请求，所述网页设计对比请求用于请求自动对比所述目标网页中的目标图片与所述预设设计图中的预设设计图片；根据所述网页设计对比请求，提取所述目标网页的页面源码；

根据所述页面源码渲染并获取所述目标网页上的目标图片数据，以及所述目标图片数据的目标图片属性数据；

获取所述目标网页对应的预设设计图中的预设图片数据，以及所述预设设计图的预设图片属性数据；

获取所述目标网页对应的预设设计图中的预设文本区域所在预设位置坐标和预设文本内容；

根据所述页面源码中的DOM接口，获取所述目标网页中的文本区域所在目标位置坐标；

将所述预设文本内容填充在所述目标网页中所述目标位置坐标对应的所述文本区域内；

分别计算所述目标图片数据与所述预设图片数据之间的第一相似度，以及所述目标图片属性数据与所述预设图片属性数据之间的第二相似度；

根据所述第一相似度和所述第二相似度生成网页设计对比报告。

2.根据权利要求1所述的方法，其特征在于，所述根据所述网页设计对比请求，提取所述目标网页的页面源码的步骤，包括：

根据所述网页设计对比请求，以预设浏览工具遍历所述目标网页的URL集下所有子链接；

提取所述子链接下所述目标网页的页面源码。

3.根据权利要求1所述的方法，所述网页设计对比请求包括去除页面文字显示内容，所述根据所述页面源码渲染并获取所述目标网页上的目标图片数据，以及所述目标图片数据的目标图片属性数据的步骤，包括：

根据所述页面源码中的DOM接口，获取所述目标网页的DOM元素及DOM父元素；

根据所述DOM元素获取所述目标网页的文字显示色；

根据所述DOM父元素，获取所述目标网页的文字显示背景色；

将所述文字显示色替换为所述文字显示背景色，得到去除了页面文字显示内容的第一页面源代码；

根据所述第一页面源代码，获取去除了页面文字显示内容的所述目标网页上的目标图片数据，以及所述目标图片数据的目标图片属性数据。

4.根据权利要求3所述的方法，在所述获取所述目标网页对应的预设设计图中的预设图片数据，以及所述预设设计图的预设图片属性数据的步骤之后，还包括：

响应于所述第一页面源代码中存在变更数据，而在执行根据所述第一页面源代码获取去除了页面文字显示内容的所述目标网页上的目标图片数据，以及所述目标图片数据的目标图片属性数据的操作之前，

先删除在所述第一页面源代码中与所述预设图片数据以及对应的预设图片属性数据不相关的无关图片数据以及对应的无关图片属性数据，所述变更数据包括导致所述第一页面源代码改变的数据。

5.根据权利要求1所述的方法，所述网页设计对比请求包括页面色度对比，所述分别计算所述目标图片数据与所述预设图片数据之间的第一相似度，以及所述目标图片属性数据与所述预设图片属性数据之间的第二相似度的步骤，包括：

通过二值化方法分别处理所述目标图片数据和所述预设图片数据中的色度，得到二值化目标图片数据和二值化预设图片数据；

通过预设感知哈希方法计算所述二值化目标图片数据和所述二值化预设图片数据之间的第一相似度，以及，所述目标图片属性数据与所述预设图片属性数据之间的第二相似度。

6.根据权利要求5所述的方法，其特征在于，所述根据所述第一相似度和所述第二相似度生成网页设计对比报告的步骤，包括：

如果所述第一相似度和所述第二相似度大于或等于预设阈值，则网页设计对比成功，生成第一网页设计对比报告；

如果所述第二相似度和所述第二相似度小于预设阈值，则标记最高所述相似度对应的目标网页，生成第二网页设计对比报告。