CN113361525A - 基于ocr的页面生成方法、装置、计算机设备及存储介质 - Google Patents

Abstract

本发明实施例公开了一种一种基于OCR的页面生成方法、装置、计算机设备及存储介质。该方法包括在当前交互界面获取目标框架图；通过OCR对待识别图片进行识别，获取目标展示信息；根据所述目标展示信息生成对应的页面元素组件；获取组件选中指令，并根据所述组件选中指令从所述页面元素组件选中对应的目标元素组件；基于所述目标元素组件和目标框架图之间的对应关系进行渲染，得到目标网页。该方法中通过交互界面获取目标框架图，使得生成的网页并不限于服务商提供的网页模板中的样式，从而解决了现有技术中生成网页仅限于网页模板中的样式，导致生成的网页形式单一的问题，进而达到了更加多样化的效果。

Description

基于OCR的页面生成方法、装置、计算机设备及存储介质

技术领域

本发明涉及计算机技术领域，尤其涉及一种基于OCR的页面生成方法、装置、计算机设备及存储介质。

背景技术

伴随用户量的飞速成长，为了更好满足个性化需求，现有的网页模板编辑能够支持用户个性化编辑，用户可以根据个人喜好来设计，展示自己的个性。

现有的模板编辑的方式如下：

(1)首先将网页按照网页结构标签(控制布局和显示)和网页内容两部分拆分，网页结构标签主要包含网页的结构部分。确定好页面的布局，规划好各个部分内容。然后，在服务器默认的结构模板中选择合适的结构，将选择好的结构拖到需要的位置，并对选择的结构进行编辑。

(2)其次，添加数据模块，在从服务器中获取网页结构标签之后，用户可以根据需要从网站已有的数据模块中调用需要添加的内容，用户可以在属性窗口中设置数据模块属性等信息。在设置好网页的数据模块的属性信息后，还可以选择模块的标题样式等。

现有技术需要在服务器提供的模板中选择网页模板，并对选择的网页模板进行编辑以生成网页，但是，由于服务商提供的网页模板有限，用户只能依赖服务商提供的网页模板生成网页，而用户无法根据自己的需要对网页进行自定义设计和更改，从而无法满足用户的个性化需求。针对现有技术中生成网页仅限于网页模板中的样式，导致生成的网页形式单一的问题，目前尚未提出有效的解决方案。

发明内容

本发明实施例提供了一种基于OCR的页面生成方法、装置、计算机设备及存储介质，旨在解决现有技术中生成网页的形式单一，无法覆盖多种使用场景的问题。

第一方面，本发明实施例提供了一种基于OCR的页面生成方法，其包括：

在当前交互界面获取目标框架图，所述目标框架图包括初始框架图和自定义框架图；

通过OCR对待识别图片进行识别，获取目标展示信息，所述目标展示信息至少包括文字、图片及排板信息；

根据所述目标展示信息生成对应的页面元素组件，所述页面元素组件用于构建网页；

获取组件选中指令，并根据所述组件选中指令从所述页面元素组件选中对应的目标元素组件；

基于所述目标元素组件和目标框架图之间的对应关系进行渲染，得到目标网页。

第二方面，本发明实施例提供了一种基于OCR的页面生成装置，其包括：

第一获取模块，用于在当前交互界面获取目标框架图，所述目标框架图包括初始框架图和自定义框架图；

识别模块，用于通过OCR对待识别图片进行识别，获取目标目标展示信息，所述目标展示信息至少包括文字、图片及排板信息；

生成模块，用于根据所述目标展示信息生成对应的页面元素组件，所述页面元素组件用于构建网页；

第二获取模块，用于获取组件选中指令，并根据所述组件选中指令获取对应的目标元素组件；

渲染模块，用于基于所述目标元素组件和目标框架图之间的对应关系进行渲染，得到目标网页。

第三方面，本发明实施例又提供了一种计算机设备，其包括存储器、处理器及存储在所述存储器上并可在所述处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现上述第一方面所述的基于OCR的页面生成方法。

第四方面，本发明实施例还提供了一种计算机可读存储介质，其中所述计算机可读存储介质存储有计算机程序，所述计算机程序当被处理器执行时使所述处理器执行上述第一方面所述的基于OCR的页面生成方法。

本发明实施例提供了一种基于OCR的页面生成方法、装置、计算机设备及存储介质。该方法包括在当前交互界面获取目标框架图；通过OCR对待识别图片进行识别，获取目标展示信息；根据所述目标展示信息生成对应的页面元素组件；获取组件选中指令，并根据所述组件选中指令从所述页面元素组件选中对应的目标元素组件；基于所述目标元素组件和目标框架图之间的对应关系进行渲染，得到目标网页。该方法中通过交互界面获取目标框架图，使得生成的网页并不限于服务商提供的网页模板中的样式，从而解决了现有技术中生成网页仅限于网页模板中的样式，导致生成的网页形式单一的问题，进而达到了更加多样化的效果。

附图说明

为了更清楚地说明本发明实施例技术方案，下面将对实施例描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1为本发明实施例提供的基于OCR的页面生成方法的流程示意图；

图2为本发明实施例提供的基于OCR的页面生成方法的另一流程示意图；

图3为本发明实施例提供的基于OCR的页面生成方法的另一流程示意图；

图4为本发明实施例提供的基于OCR的页面生成方法中步骤S150的子流程示意图；

图5为本发明实施例提供的基于OCR的页面生成方法的另一流程示意图；

图6为本发明实施例提供的基于OCR的页面生成装置的示意性框图。

具体实施方式

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

应当理解，当在本说明书和所附权利要求书中使用时，术语“包括”和“包含”指示所描述特征、整体、步骤、操作、元素和/或组件的存在，但并不排除一个或多个其它特征、整体、步骤、操作、元素、组件和/或其集合的存在或添加。

还应当理解，在此本发明说明书中所使用的术语仅仅是出于描述特定实施例的目的而并不意在限制本发明。如在本发明说明书和所附权利要求书中所使用的那样，除非上下文清楚地指明其它情况，否则单数形式的“一”、“一个”及“该”意在包括复数形式。

还应当进一步理解，在本发明说明书和所附权利要求书中使用的术语“和/或”是指相关联列出的项中的一个或多个的任何组合以及所有可能组合，并且包括这些组合。

请参阅图1所示，图1为本发明实施例提供的基于OCR的页面生成方法的流程示意图，该方法包括步骤S110～S150。

步骤S110、在当前交互界面获取目标框架图，所述目标框架图包括初始框架图和自定义框架图；

本实施例中，框架图指的是网页的框架图，网页的框架图包括网页背景、网页标题、网页的分类以及网页的检索等网页通用的信息。通过交互界面，获取用户指定的目标框架图。目标框架图可以是用户从服务器获取的初始框架图，也可以是用户自定义绘制的原形框架图。

步骤S120、通过OCR对待识别图片进行识别，获取目标展示信息，所述目标展示信息至少包括文字、图片及排板信息；

本实施例中，为了便于用户获取目标展示信息，可以通过OCR文字识别技术对待识别图片进行识别，获取待识别图片上的目标展示信息。其中，待识别图片可以是用户从互联网下载的，待识别图片的样式可以是PDF、Word文档等。目标展示信息至少包括待识别图片上的文字、图片及排版信息。

步骤S130、根据所述目标展示信息生成对应的页面元素组件，所述页面元素组件用于构建网页；

本实施例中，解析目标展示信息，得到目标展示信息中所包含的页面元素信息，基于页面元素信息生成对应的页面元素组件，并显示在交互界面中。页面元素组件可以作为网页的不同组成部分，每个页面元素组件对于网页的功能不做限制。图片的结构或组成成分都可以作为构成网页的页面元素组件，图片包括多个图层，每个图层上又可以是空白的图层，也可以是包含有文字或图像的图层。

进一步的，对于一个图片，该图片可以由多个图层构成，每个图层都可以是单独的一整幅图像，也可以是一个图层局部具有图像，还可以是一个图层仅有文字或者文字与图像的结合，甚至仅仅是个空白图层，多个图层重叠又构成一个完整的图片，那么，解析该图片得到的元素信息包括多个图层，还包括每个图层上的图像或者文字信息，解析得到的这些元素信息都可以用来构成网页。例如，图片中一个图层的图像可以作为网页背景图，另外一个图层的图像可以作为网页区域分割图，具有文字的图层上的文字可以作为网页的标题等。

如图2所示，在一实施例中，步骤S130之后，还包括：

步骤S1301：接收对所述页面元素组件进行编辑的修改指令；

步骤S1302：根据所述修改指令对所述页面元素组件进行更新，得到更新后的页面元素组件。

本实施例中，当检测到对页面元素组件的修改指令时，确定目标修改组件，并组件编辑界面；接收用户在组件编辑界面输入的修改内容；当接收到编辑退出指令时，将修改内容进行保存并显示于页面元素组件中。对页面元素组件进行编辑，可以针对单独的一个页面元素组件，也可以是同时对多个页面元素组件进行编辑。对页面元素组件进行编辑时，可以针对页面元素组件的内容、颜色、字体和设计效果等进行编辑。

例如，对于页面元素组件“标题”的样式进行编辑，可以更改标题的文字样式由中文改成英文等，也可以更改文字的大小、颜色等。此外，还可以对图层上的图片进行编辑，例如替换、修改及剪切等，还可以编辑内容与图层之间的设计效果等。

如图3所示，在一实施例中，步骤S130之后，还包括：

步骤S1303、对所述第一元素组件和所述第二元素组件进行关联，得到所述第一元素组件和第二元素组件之间的关联信息；

步骤S1304、按照所述关联信息显示所述第一元素组件和所述第二元素组件。

本实施例中，解析图片得到的页面元素组件不仅与框架信息相对应，不同的页面元素组件之间也具有关联关系，能够通过不同页面元素组件之间的关联关系显示不同的展示效果，从而使得生成的网页形式更加丰富。因此，目标展示信息生成多个页面元素组件之后，至少存在第一元素组件和第二元素组件，对第一元素组件和第二元素组件进行关联，得到第一元素组件和第二元素组件之间的关联信息，按照关联信息显示第一元素组件和第二元素组件。

例如，存在三个重叠设置的图层，重叠部分未显示，每个图层可以用来展示一张图像，通过切换图层可以实现图像的轮换展示，每个图像都可以作为一个页面元素组件。若图层1上设有标识块1，图层2上设有标识块2，图层3上设有标识块3，每个标识块也可以作为一个页面元素组件，在对图层上的图像进行展示时，可以用标识块来区分当前图像为第几张图，以及当前展示的图像共有几张。如果将图像与标识块解析为一个页面元素组件，那么，在需要更改标识块样式而不更改图像时，需要重新制作图层，制作带有新标识块的图像，而在需要更改图层上显示的图像而不更改标识块样式时，需要制作带有标识块的新图像，这样使得修改过程较繁琐，增加了编辑的工作量。但是，如果将图像与标识块解析为不同的元素信息，那么，可以仅修改标识块或者仅修改图像。但是，为了显示标识块与图像之间的关系，可以将两者关联起来，按照关联关系显示标识块和图像，这样，不仅能够准确显示元素信息之间的关系，还能便于对元素信息进行编辑，减少了编辑的工作量，从而提高了生成网页的效率。

步骤S140、获取组件选中指令，并根据所述组件选中指令从所述页面元素组件选中对应的目标元素组件；

本实施例中，在当前交互界面中监测是否存在组件选中指令，若存在组件选中指令，则根据组件选中指令从所有页面元素组件中选中对应的目标元素组件。组件选中指令可以通过用户在交互界面中，通过触控或鼠标等方式触发，触发方式可以是单击或双击交互界面中的页面元素组件进行选中。

步骤S150、基于所述目标元素组件和目标框架图之间的对应关系进行渲染，得到目标网页。

本实施例中，网页的框架图仅仅勾画了网页的骨架，而页面元素组件仅仅是网页的表现，为了能够构成一个完整的网页，根据目标框架图与目标元素组件之间的对应关系进行渲染，得到完整的网页。

如图4所示，在一实施例中，步骤S150包括：

步骤S151、获取所述目标元素组件的第一标识信息；

步骤S152、获取所述目标框架图的第二标识信息；

步骤S153、根据所述第一标识信息和第二标识信息构建所述目标元素组件和目标框架图的网页描述信息；

步骤S154、根据所述网页描述信息对所述目标元素组件和目标框架图进行渲染，得到所述目标网页。

本实施例中，从目标元素组件中提取第一标识信息，提取的第一标识信息包括网页的背景图片、标题样式、内容颜色、字体字号等，还包括目标元素组件的显示位置、显示方式等。从目标框架图中提取第二标识信息，第二标识信息每个目标元素组件对应目标框架图中的哪个部分(即位置)。根据第一标识信息和第二标识信息构建目标元素组件和目标框架图的网页描述信息。网页描述信息指明了每个目标元素组件在目标框架图中的位置、显示方式，基于网页描述信息及渲染引擎对目标元素组件和目标框架图进行渲染，得到目标网页。

如图5所示，在一实施例中，在步骤S150之后，还包括：

步骤S1501、根据所述目标网页获取所述目标元素组件和目标框架图之间的关联关系；

步骤S1502、根据所述关联关系生成目标网页的网页模板并保存。

本实施例中，为了方便其他用户重复生成相同的网页，或分享给其他人。可以根据目标网页获取目标元素组件和目标框架图之间的关联关系，基于关联关系生成目标网页的网页模板并保存。保存位置可以是云服务器，或通过邮件、短信等分享给不同用户。

该方法中通过交互界面获取目标框架图，使得生成的网页并不限于服务商提供的网页模板中的样式，从而解决了现有技术中生成网页仅限于网页模板中的样式，导致生成的网页形式单一的问题，进而达到了更加多样化的效果。

本发明实施例还提供一种基于OCR的页面生成装置，该基于OCR的页面生成装置用于执行前述基于OCR的页面生成方法的任一实施例。具体地，请参阅图6，图6是本发明实施例提供的基于OCR的页面生成装置的示意性框图。该基于OCR的页面生成装置100可以配置于服务器中。

如图6所示，基于OCR的页面生成装置100包括获取模块110、分类模块120、角点筛选模块130、种子点选取模块140、判断模块150、计算模块160。

第一获取模块110，用于在当前交互界面获取目标框架图，所述目标框架图包括初始框架图和自定义框架图；

识别模块120，用于通过OCR对待识别图片进行识别，获取目标目标展示信息，所述目标展示信息至少包括文字、图片及排板信息；

生成模块130，用于根据所述目标展示信息生成对应的页面元素组件，所述页面元素组件用于构建网页；

第二获取模块140，用于获取组件选中指令，并根据所述组件选中指令获取对应的目标元素组件；

渲染模块150，用于基于所述目标元素组件和目标框架图之间的对应关系进行渲染，得到目标网页。

在一实施例中，所述页面生成装置还包括：

接收模块，用于接收对所述页面元素组件进行编辑的修改指令；以及

更新模块，用于根据所述修改指令对所述页面元素组件进行更新，得到更新后的页面元素组件。

在一实施例中，所述渲染模块150包括：

第一获取单元，用于获取所述目标元素组件的第一标识信息；

第二获取单元，用于获取所述目标框架图的第二标识信息；

构建单元，用于根据所述第一标识信息和第二标识信息构建所述目标元素组件和目标框架图的网页描述信息；

渲染单元，用于根据所述网页描述信息对所述目标元素组件和目标框架图进行渲染，得到目标网页。

本发明实施例还提供一种计算机设备，包括存储器、处理器及存储在所述存储器上并可在所述处理器上运行的计算机程序，其中，所述处理器执行所述计算机程序时实现如上所述的基于OCR的页面生成方法。

在本发明的另一实施例中提供计算机可读存储介质。该计算机可读存储介质可以为非易失性的计算机可读存储介质。该计算机可读存储介质存储有计算机程序，所述计算机程序当被处理器执行时使所述处理器执行如上所述的基于基于OCR的页面生成方法。

所属领域的技术人员可以清楚地了解到，为了描述的方便和简洁，上述描述的设备、装置和单元的具体工作过程，可以参考前述方法实施例中的对应过程，在此不再赘述。本领域普通技术人员可以意识到，结合本文中所公开的实施例描述的各示例的单元及算法步骤，能够以电子硬件、计算机软件或者二者的结合来实现，为了清楚地说明硬件和软件的可互换性，在上述说明中已经按照功能一般性地描述了各示例的组成及步骤。这些功能究竟以硬件还是软件方式来执行取决于技术方案的特定应用和设计约束条件。专业技术人员可以对每个特定的应用来使用不同方法来实现所描述的功能，但是这种实现不应认为超出本发明的范围。

在本发明所提供的几个实施例中，应该理解到，所揭露的设备、装置和方法，可以通过其它的方式实现。例如，以上所描述的装置实施例仅仅是示意性的，例如，所述单元的划分，仅仅为逻辑功能划分，实际实现时可以有另外的划分方式，也可以将具有相同功能的单元集合成一个单元，例如多个单元或组件可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。另外，所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口、装置或单元的间接耦合或通信连接，也可以是电的，机械的或其它的形式连接。

所述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本发明实施例方案的目的。

另外，在本发明各个实施例中的各功能单元可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以是两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现，也可以采用软件功能单元的形式实现。

所述集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在一个存储介质中。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分，或者该技术方案的全部或部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质中，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行本发明各个实施例所述方法的全部或部分步骤。而前述的存储介质包括：U盘、移动硬盘、只读存储器(ROM，Read-Only Memory)、磁碟或者光盘等各种可以存储程序代码的介质。

以上所述，仅为本发明的具体实施方式，但本发明的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本发明揭露的技术范围内，可轻易想到各种等效的修改或替换，这些修改或替换都应涵盖在本发明的保护范围之内。因此，本发明的保护范围应以权利要求的保护范围为准。

Claims (10)

1.一种基于OCR的页面生成方法，其特征在于，包括：

在当前交互界面获取目标框架图，所述目标框架图包括初始框架图和自定义框架图；

通过OCR对待识别图片进行识别，获取目标展示信息，所述目标展示信息至少包括文字、图片及排板信息；

根据所述目标展示信息生成对应的页面元素组件，所述页面元素组件用于构建网页；

获取组件选中指令，并根据所述组件选中指令从所述页面元素组件选中对应的目标元素组件；

基于所述目标元素组件和目标框架图之间的对应关系进行渲染，得到目标网页。

2.根据权利要求1所述的基于OCR的页面生成方法，其特征在于，在所述根据所述目标展示信息生成对应的页面元素组件之后，还包括：

接收对所述页面元素组件进行编辑的修改指令；

根据所述修改指令对所述页面元素组件进行更新，得到更新后的页面元素组件。

3.根据权利要求1所述的基于OCR的页面生成方法，其特征在于，所述页面元素组件包括第一元素组件和第二元素组件，在所述根据所述目标展示信息生成对应的页面元素组件之后，还包括：

对所述第一元素组件和所述第二元素组件进行关联，得到所述第一元素组件和第二元素组件之间的关联信息；

按照所述关联信息显示所述第一元素组件和所述第二元素组件。

4.根据权利要求1所述的基于OCR的页面生成方法，其特征在于，所述基于所述目标元素组件和目标框架图之间的对应关系进行渲染，得到目标网页，包括：

获取所述目标元素组件的第一标识信息；

获取所述目标框架图的第二标识信息；

根据所述第一标识信息和第二标识信息构建所述目标元素组件和目标框架图的网页描述信息；

根据所述网页描述信息对所述目标元素组件和目标框架图进行渲染，得到所述目标网页。

5.根据权利要求1所述的基于OCR的页面生成方法，其特征在于，在所述基于所述目标元素组件和目标框架图之间的对应关系进行渲染，得到目标网页之后，还包括：

根据所述目标网页获取所述目标元素组件和目标框架图之间的关联关系；

根据所述关联关系生成目标网页的网页模板并保存。

6.一种基于OCR的页面生成装置，其特征在于，包括：

第一获取模块，用于在当前交互界面获取目标框架图，所述目标框架图包括初始框架图和自定义框架图；

识别模块，用于通过OCR对待识别图片进行识别，获取目标目标展示信息，所述目标展示信息至少包括文字、图片及排板信息；

生成模块，用于根据所述目标展示信息生成对应的页面元素组件，所述页面元素组件用于构建网页；

第二获取模块，用于获取组件选中指令，并根据所述组件选中指令获取对应的目标元素组件；

渲染模块，用于基于所述目标元素组件和目标框架图之间的对应关系进行渲染，得到目标网页。

7.根据权利要求6所述的基于OCR的页面生成装置，其特征在于，所述页面生成装置还包括：

接收模块，用于接收对所述页面元素组件进行编辑的修改指令；以及

更新模块，用于根据所述修改指令对所述页面元素组件进行更新，得到更新后的页面元素组件。

8.根据权利要求6所述的基于OCR的页面生成装置，其特征在于，所述渲染模块包括：

第一获取单元，用于获取所述目标元素组件的第一标识信息；

第二获取单元，用于获取所述目标框架图的第二标识信息；

构建单元，用于根据所述第一标识信息和第二标识信息构建所述目标元素组件和目标框架图的网页描述信息；

渲染单元，用于根据所述网页描述信息对所述目标元素组件和目标框架图进行渲染，得到目标网页。

9.一种计算机设备，包括存储器、处理器及存储在所述存储器上并可在所述处理器上运行的计算机程序，其特征在于，所述处理器执行所述计算机程序时实现如权利要求1至5中任一项所述的基于OCR的页面生成方法。

10.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质存储有计算机程序，所述计算机程序当被处理器执行时使所述处理器执行如权利要求1至5任一项所述的基于OCR的页面生成方法。

Images