掌桥专利:专业的专利平台
掌桥专利
首页

一种页面生成方法、页面展示方法、装置及电子设备

文献发布时间:2023-06-19 11:45:49


一种页面生成方法、页面展示方法、装置及电子设备

技术领域

本公开涉及页面设计技术领域,尤其涉及一种页面生成方法、页面展示方法、装置及电子设备。

背景技术

为了在多种情况下进行产品推广,往往需要根据市场及产品生成多种宣传页面进行展示。通常情况下,每次推广均会对应有不同的主题,且针对不同的活动、不同的主题及均需要重新构建对应的文件,以实现页面的展示。这样一来,势必需要进行多次重复的劳动。此外,在需要生成页面以同时上架多个主题时,需要在短时间内付出大量的开发、测试的人力成本。与此同时,由于每次上架推广主题的流程大致相同,这样一来,势必会造成资源的浪费。

因此,如何缩短页面生成与展示过程中的耗时,减少不必要的重复性劳动,提高灵活性、扩展性、降低成本并避免资源浪费,已成为亟待解决的问题。

发明内容

本公开提供一种页面生成方法、页面展示方法、装置及电子设备,以至少解决相关技术中存在的耗时久、存在大量重复性劳动、灵活性低、扩展性差、成本高且存在资源浪费的问题。本公开的技术方案如下:

根据本公开实施例的第一方面,提供一种页面生成方法,所述页面生成方法包括:接收页面生成请求,调用组件库,其中,所述页面生成请求包括待生成页面的第一页面标识;监控组件选取操作,并根据所述组件选取操作从所述组件库中选取所述待生成页面所需的基础组件;获取所述基础组件的属性填充数据,并将所述填充数据填充至所述基础组件中生成第一目标组件;确定所述第一目标组件的目标组件样式,并将所述第一页面标识与所述第一目标组件的组件标识进行关联存储。

根据本公开的一个实施例,所述确定所述目标组件的目标组件样式,包括:获取所述基础组件对应的默认组件样式,并按照所述默认组件样式对所述目标组件进行效果预览;响应于样式确认操作,将所述默认组件样式确定为所述目标组件样式;响应于对所述默认组件样式的修改操作,根据所述修改操作,确定所述目标组件样式。

根据本公开的一个实施例,所述获取所述基础组件对应的默认组件样式,包括:基于所述基础组件的组件标识,获取所述基础组件对应的所述默认组件样式。

根据本公开的一个实施例,所述接收页面生成请求,调用组件库之前,还包括:获取待生成组件的属性元素,并基于所述属性元素生成一个基础组件;获取每个所述基础组件的样式配置信息,并基于所述样式配置信息生成所述基础组件的默认组件样式;基于所述基础组件和所述基础组件对应的默认组件样式,生成所述基础组件的结构化数据,存储在所述组件库中。

根据本公开的一个实施例,还包括:获取所述基础组件的交互配置操作,并基于所述交互配置操作,获取所述基础组件的每个交互的配置信息,其中,所述配置信息包括交互方式以及所述交互方式对应的交互结果。

根据本公开的一个实施例,还包括:接收页面展示请求,其中,所述页面展示请求中包括目标页面的页面标识;根据所述目标页面的页面标识,查询页面标识与组件标识之间的映射关系,获取所述目标页面的第二目标组件和所述第二目标组件的目标组件样式;将所述第二目标组件和所述第二目标组件的目标组件样式发送给客户端进行展示。

本公开的实施例提供的技术方案至少带来以下有益效果:

本公开通过接收页面生成请求,调用组件库,并监控组件选取操作,根据组件选取操作从组件库中选取待生成页面所需的基础组件,然后获取基础组件的属性填充数据,并将填充数据填充至基础组件中生成第一目标组件,进而确定第一目标组件的目标组件样式,并将第一页面标识与第一目标组件的组件标识进行关联存储,以实现待生成页面的生成。由此,本公开能够基于组件化思想,提供组件库以供选择,从而提供不同组件的多种自由组合,实现针对多种应用场景的待生成页面的快速生成,缩短了页面生成过程中的耗时,提高了灵活性与扩展性,可以减少重复开发导致的资源浪费及不必要的成本支出,提高了页面生成过程中的效率,降低了耦合度。

根据本公开实施例的第二方面,提供一种页面展示方法,所述页面展示方法包括:向页面生成终端发送页面展示请求,其中,所述页面展示请求包括目标页面的页面标识;接收所述目标页面的目标组件和所述目标组件的目标组件样式;对所述目标组件按照目标组件样式进行页面渲染,生成并展示所述目标页面。

根据本公开的一个实施例,还包括:根据所述页面标识,获取所述目标页面对应的主题描述信息;在页面渲染过程中,获取与所述主题描述信息关联的所述目标组件;将所述主题描述信息渲染至与所述关联的目标组件中进行展示。

本公开的实施例提供的技术方案至少带来以下有益效果:

本公开通过向页面生成终端发送页面展示请求,其中,页面展示请求包括目标页面的页面标识,并接收目标页面的目标组件和目标组件的目标组件样式,进而对目标组件按照目标组件样式进行页面渲染,生成并展示目标页面,以实现页面的展示。由此,本公开能够基于页面标识,实现对应的目标页面的快速展示,缩短了基于组件化思想生成的页面的展示过程中的耗时,提高了页面展示过程中的效率。

根据本公开实施例的第三方面,提供一种页面生成装置,所述页面生成装置包括:调用模块,用于接收页面生成请求,调用组件库,其中,所述页面生成请求包括待生成页面的第一页面标识;选取模块,用于监控组件选取操作,并根据所述组件选取操作从所述组件库中选取所述待生成页面所需的基础组件;填充模块,用于获取所述基础组件的属性填充数据,并将所述填充数据填充至所述基础组件中生成第一目标组件;存储模块,用于确定所述第一目标组件的目标组件样式,并将所述第一页面标识与所述第一目标组件的组件标识进行关联存储。

根据本公开的一个实施例,所述存储模块,包括:预览子模块,用于获取所述基础组件对应的默认组件样式,并按照所述默认组件样式对所述目标组件进行效果预览;第一确定子模块,用于响应于样式确认操作,将所述默认组件样式确定为所述目标组件样式;第二确定子模块,用于响应于对所述默认组件样式的修改操作,根据所述修改操作,确定所述目标组件样式。

根据本公开的一个实施例,所述存储模块,包括:第一获取子模块,用于基于所述基础组件的组件标识,获取所述基础组件对应的所述默认组件样式。

根据本公开的一个实施例,所述调用模块,还包括:第一生成子模块,用于获取待生成组件的属性元素,并基于所述属性元素生成一个基础组件;第二生成子模块,用于获取每个所述基础组件的样式配置信息,并基于所述样式配置信息生成所述基础组件的默认组件样式;存储子模块,用于基于所述基础组件和所述基础组件对应的默认组件样式,生成所述基础组件的结构化数据,存储在所述组件库中。

根据本公开的一个实施例,还包括:第一获取模块,用于获取所述基础组件的交互配置操作,并基于所述交互配置操作,获取所述基础组件的每个交互的配置信息,其中,所述配置信息包括交互方式以及所述交互方式对应的交互结果。

根据本公开的一个实施例,还包括:接收模块,用于接收页面展示请求,其中,所述页面展示请求中包括目标页面的页面标识;第二获取模块,用于根据所述目标页面的页面标识,查询页面标识与组件标识之间的映射关系,获取所述目标页面的第二目标组件和所述第二目标组件的目标组件样式;发送模块,用于将所述第二目标组件和所述第二目标组件的目标组件样式发送给客户端进行展示。

根据本公开实施例的第四方面,提供一种页面展示装置,所述页面展示装置包括:发送模块,用于向页面生成终端发送页面展示请求,其中,所述页面展示请求包括目标页面的页面标识;接收模块,用于接收所述目标页面的目标组件和所述目标组件的目标组件样式;第一展示模块,用于对所述目标组件按照目标组件样式进行页面渲染,生成并展示所述目标页面。

根据本公开的一个实施例,还包括:第一获取模块,用于根据所述页面标识,获取所述目标页面对应的主题描述信息;第二获取模块,用于在页面渲染过程中,获取与所述主题描述信息关联的所述目标组件;第二展示模块,用于将所述主题描述信息渲染至与所述关联的目标组件中进行展示。

根据本公开实施例的第五方面,提供一种电子设备,包括:处理器;用于存储所述处理器可执行指令的存储器;其中,所述处理器被配置为执行所述指令,以实现如本公开第一方面实施例提供的页面生成方法,或者实现如本公开第二方面实施例提供的页面展示方法。

根据本公开实施例的第六方面,提供一种计算机可读存储介质,当所述计算机可读存储介质中的指令由电子设备的处理器执行时,使得所述电子设备能够执行如本公开第一方面实施例提供的页面生成方法,或者执行如本公开第二方面实施例提供的页面展示方法。

根据本公开实施例的第七方面,提供一种计算机程序产品,包括计算机程序,其特征在于,所述计算机程序被处理器执行时实现如本公开第一方面提供的页面生成方法,或者执行时实现如本公开第二方面提供的页面展示方法。

应当理解的是,以上的一般描述和后文的细节描述仅是示例性和解释性的,并不能限制本公开。

附图说明

此处的附图被并入说明书中并构成本说明书的一部分,示出了符合本公开的实施例,并与说明书一起用于解释本公开的原理,并不构成对本公开的不当限定。

图1是根据一示例性实施例示出的一种页面生成方法的流程图。

图2是根据一示例性实施例示出的一种交互界面的示意图。

图3是根据一示例性实施例示出的另一种交互界面的示意图。

图4是根据一示例性实施例示出的另一种交互界面的示意图。

图5是根据一示例性实施例示出的另一种交互界面的示意图。

图6是根据一示例性实施例示出的另一种页面生成方法的流程图。

图7是根据一示例性实施例示出的另一种交互界面的示意图。

图8是根据一示例性实施例示出的另一种交互界面的示意图。

图9是根据一示例性实施例示出的另一种交互界面的示意图。

图10是根据一示例性实施例示出的另一种页面生成方法的流程图。

图11是根据一示例性实施例示出的另一种页面生成方法的流程图。

图12是根据一示例性实施例示出的另一种交互界面的示意图。

图13是根据一示例性实施例示出的一种页面展示方法的流程图。

图14是根据一示例性实施例示出的另一种交互界面的示意图。

图15是根据一示例性实施例示出的另一种交互界面的示意图。

图16是根据一示例性实施例示出的一种页面展示方法的流程图。

图17是根据一示例性实施例示出的另一种交互界面的示意图。

图18是根据一示例性实施例示出的另一种交互界面的示意图。

图19是根据一示例性实施例示出的另一种交互界面的示意图。

图20是根据一示例性实施例示出的一种页面生成装置的框图。

图21是根据一示例性实施例示出的另一种页面生成装置的框图。

图22是根据一示例性实施例示出的另一种页面生成装置的框图。

图23是根据一示例性实施例示出的另一种页面生成装置的框图。

图24是根据一示例性实施例示出的一种页面展示装置的框图。

图25是根据一示例性实施例示出的另一种页面展示装置的框图。

图26是根据一示例性实施例示出的一种电子设备的框图。

具体实施方式

为了使本领域普通人员更好地理解本公开的技术方案,下面将结合附图,对本公开实施例中的技术方案进行清楚、完整地描述。

需要说明的是,本公开的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象,而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换,以便这里描述的本公开的实施例能够以除了在这里图示或描述的那些以外的顺序实施。以下示例性实施例中所描述的实施方式并不代表与本公开相一致的所有实施方式。相反,它们仅是与如所附权利要求书中所详述的、本公开的一些方面相一致的装置和方法的例子。

图1是根据一示例性实施例示出的一种页面生成方法的流程图。其中,需要说明的是,本公开的页面生成方法的执行主体为页面生成装置。本公开实施例的页面生成方法可以由本公开实施例的页面生成装置执行,页面生成装置具体可以为硬件设备,或者硬件设备中的软件等。其中,硬件设备例如终端设备、服务器等。

如图1所示,本实施例提出的页面生成方法,包括以下步骤:

在步骤101中,接收页面生成请求,调用组件库,其中,页面生成请求包括待生成页面的第一页面标识。

在本公开实施例中,交互界面上至少设置有页面生成请求发送控件。以运维人员进行操作为例,运维人员可以通过触发页面生成请求发送控件发送页面生成请求。举例而言,如图2所示,交互界面2-1上设置有页面生成请求发送控件2-2。此种情况下,运维人员可以通过触发页面生成请求发送控件2-2发送页面生成请求。

相应地,可以接收页面生成请求。其中,页面生成请求包括待生成页面的第一页面标识。

需要说明的是,第一页面标识可以为待生成页面的唯一标识。举例而言,接收到的针对待生成页面1的页面生成请求中,包括待生成页面1的第一页面标识1;接收到的针对待生成页面2的页面生成请求中,包括待生成页面2的第一页面标识2。

进一步地,基于页面生成请求,可以实现后台系统和前端系统的连接。由此,可以根据页面生成请求,调用组件库。

在步骤102中,监控组件选取操作,并根据组件选取操作从组件库中选取待生成页面所需的基础组件。

需要说明的是,组件库中存储有预先存储有多个组件。在调用组件库后,可以通过触发交互界面上展示的多个组件控件选取不同的组件,以实现待生成页面所需的基础组件的选取。举例而言,如图3(a)所示,交互界面3-1上设置有组件控件3-2~3-11,运维人员触发了控件3-2~3-7和3-11。此种情况下,可以监控组件选取操作,并根据组件选取操作从组件库中选取如图3(b)所示的待生成页面所需的基础组件。

在步骤103中,获取基础组件的属性填充数据,并将填充数据填充至基础组件中生成第一目标组件。

其中,基础组件的属性填充数据,可以包括但不限于以下数据:文字颜色的深浅、文字链接的颜色色值、错误文案的错误内容、错误类型等。

例如,如图4所示,基础组件的属性填充数据可以为文字颜色的深浅4-1以及文字链接的颜色色值4-2。又例如,举例而言,如图5所示,基础组件的属性填充数据可以为错误内容甲5-1以及错误类型乙5-2。

进一步地,在将填充数据填充至基础组件中后,可以生成第一目标组件。

在步骤104中,确定第一目标组件的目标组件样式,并将第一页面标识与第一目标组件的组件标识进行关联存储。

需要说明的是,本公开中预先存储有第一目标组件和目标组件样式之间的映射关系,在生成第一目标组件后,可以基于映射关系,确定第一目标组件的目标组件样式。

需要说明的是,在确定第一目标组件的目标组件样式后,运维人员可以根据实际情况执行对应的操作。可选地,运维人员可以直接执行样式确认操作;可选地,运维人员可以执行修改操作,并在完成修改后执行样式确认操作。

进一步地,可以在响应于样式确认操作后,将第一页面标识与第一目标组件的组件标识进行关联存储。此种情况下,基于对应待生成页面的唯一标识的第一页面标识与第一目标组件的组件标识的关联关系,即可形成待生成页面与第一目标组件的关联关系。

本公开通过接收页面生成请求,调用组件库,并监控组件选取操作,根据组件选取操作从组件库中选取待生成页面所需的基础组件,然后获取基础组件的属性填充数据,并将填充数据填充至基础组件中生成第一目标组件,进而确定第一目标组件的目标组件样式,并将第一页面标识与第一目标组件的组件标识进行关联存储,以实现待生成页面的生成。由此,本公开能够基于组件化思想,提供组件库以供选择,从而提供不同组件的多种自由组合,实现针对多种应用场景的待生成页面的快速生成,缩短了页面生成过程中的耗时,提高了灵活性与扩展性,可以减少重复开发导致的资源浪费及不必要的成本支出,提高了页面生成过程中的效率,降低了耦合度。

需要说明的是,本公开中,在试图确定目标组件的目标组件样式时,可以响应于不同的操作,实现目标组件样式的确定。

作为一种可能的实现方式,如图6所示,在上述实施例的基础上,上述步骤中确定目标组件的目标组件样式的具体过程,包括以下步骤:

在步骤601中,获取基础组件对应的默认组件样式,并按照默认组件样式对目标组件进行效果预览。

需要说明的是,当组件有配置对应的内容后,可以通过组件预览分别查看该组件在PC(Personal Computer,个人计算机)端和移动端的展示效果。进一步地,还可以配置该组件的某条数据在PC Web(World Wide Web,全球广域网/万维网)和移动端上进行展示。

本公开实施例中,可以基于基础组件的组件标识,获取基础组件对应的默认组件样式。进一步地,可以按照默认组件样式对目标组件进行效果预览。

需要说明的是,每个基础组件均对应有唯一的组件标识。其中,组件标识,可以为键值(Key Value,又称Key值)。举例而言,针对图7中所示的多个基础组件7-1~7-7,每个组件均有对应有一个唯一的Key值。

在待生成页面上线前,以运维人员进行操作为例,运维人员可以对目标组件进行效果预览。相应地,运维人员可以根据实际需求,对如图7所示的展示效果执行相应的操作。

在步骤602中,响应于样式确认操作,将默认组件样式确定为目标组件样式。

需要说明的是,进行效果展示的交互界面上设置有包括确认、修改等功能的多个操作控件。以运维人员进行操作为例,运维人员可以通过触发不同控件,执行对应的不同操作。举例而言,如图8所示,交互界面8-1上设置有确认控件8-2和修改控件8-3。此种情况下,可以对运维人员的选取操作进行监控。若运维人员触发了确认控件8-2,说明运维人员执行了样式确认操作,则可以响应于样式确认操作,将默认组件样式确定为目标组件样式。

在步骤603中,响应于对默认组件样式的修改操作,根据修改操作,确定目标组件样式。

需要说明的是,本公开中,以运维人员进行操作为例,运维人员可以通过对默认组件样式的修改操作,任意更换组件样式,以调整组件样式布局。举例而言,如图9(a)所示,交互界面9-1上设置有确认控件9-2和修改控件9-3。此种情况下,可以对运维人员的选取操作进行监控。若运维人员触发了修改控件9-3,说明运维人员执行了对默认组件样式的修改操作,则可以响应于对默认组件样式的修改操作,根据修改操作,确定目标组件样式为如图9(b)所示。

本公开通过获取基础组件对应的默认组件样式,并按照默认组件样式对目标组件进行效果预览,然后可选地,可以响应于样式确认操作,将默认组件样式确定为目标组件样式;可选地,可以响应于对默认组件样式的修改操作,根据修改操作,确定目标组件样式。由此,本公开能够在待生成页面上线前,使得运维人员能够基于预览效果,对目标组件进行审核,并在确认目标组件满足要求后确定目标组件样式,确保了目标组件样式能够符合实际需求,进一步提高了页面生成过程中的适应性及可靠性。

需要说明的是,本公开中,在接收页面生成请求,调用组件库之前,可以预先生成基础组件的结构化数据,存储在组件库中。

作为一种可能的实现方式,如图10所示,具体包括以下步骤:

在步骤001中,获取待生成组件的属性元素,并基于属性元素生成一个基础组件。

其中,属性元素,可以包括但不限于以下元素:组件名称、组件编码、组件分类、状态、列表设置等。举例而言,可以获取到以下待生成组件的属性元素:组件名称为title,组件编码为title code,状态为可用且可兼容PC和H5(Hyper Text Markup Language,简称HTML 5.0,超文本5.0)。

需要说明的是,针对复合组件,可能会包含多个组件列表,此种情况下,可以定义列表数据条数限制。举例而言,可以定义列表数据条数的最小值为4,最大值为10。

进一步,在获取到待生成组件的属性元素后,可以基于属性元素生成一个基础组件。

在步骤1002中,获取每个基础组件的样式配置信息,并基于样式配置信息生成基础组件的默认组件样式。

其中,样式配置信息,可以包括但不限于以下信息:样式名称、样式支持端、PC端样式编码、移动端样式编码、状态等。

进一步,在获取到获取每个基础组件的样式配置信息后,可以基于样式配置信息生成基础组件的默认组件样式。

在步骤1003中,基于基础组件和基础组件对应的默认组件样式,生成基础组件的结构化数据,存储在组件库中。

本公开实施例中,在获取到基础组件对应的默认组件样式后,可以基于基础组件和基础组件对应的默认组件样式,生成能够在搜索结果中进行良好展示的基础组件的结构化数据(Structured Data),存储在组件库中。

进一步地,以运维人员进行操作为例,运维人员可以执行基础组件的交互配置操作,以对显示样式进行灵活配置。

其中,基础组件的交互配置操作,可以包括但不限于以下操作:页面滚动,鼠标滑动、鼠标悬浮、鼠标点击等。

可选地,可以获取基础组件的交互配置操作,并基于交互配置操作,获取基础组件的每个交互的配置信息,其中,配置信息包括交互方式以及交互方式对应的交互结果。

本公开通过获取待生成组件的属性元素,并基于属性元素生成一个基础组件,并获取每个基础组件的样式配置信息,并基于样式配置信息生成基础组件的默认组件样式,进而基于基础组件和基础组件对应的默认组件样式,生成基础组件的结构化数据,存储在组件库中。由此,本公开能够通过制定针对基础组件的组件化及组件化样式标准,生成基础组件的结构化数据,存储在组件库中,从而为待生成页面的业务逻辑实现组件化建立基础。进一步地,通过获取基础组件的交互配置操作,并基于交互配置操作,获取基础组件的每个交互的配置信息,提供了灵活地配置组件的交互方式,进一步提高了页面生成过程中的适应性及灵活性。

需要说明的是,本公开中,运维人员可以通过客户端等前端发送页面展示请求,相应地,可以基于页面展示请求,将目标组件样式于客户端进行展示。

作为一种可能的实现方式,如图11所示,具体包括以下步骤:

在步骤1101中,接收页面展示请求,其中,页面展示请求中包括目标页面的页面标识。

需要说明的是,客户端等页面展示终端上的交互界面上至少设置有页面展示请求发送控件。

以运维人员进行操作为例,可以通过触发页面展示请求控件发送页面展示请求。相应地,可以接收页面展示请求。举例而言,如图12所示,交互界面12-1上设置有页面展示请求发送控件12-2。此种情况下,运维人员可以通过触发页面展示请求发送控件12-2发送页面展示请求。

在步骤1102中,根据目标页面的页面标识,查询页面标识与组件标识之间的映射关系,获取目标页面的第二目标组件和第二目标组件的目标组件样式。

需要说明的是,运维人员可以根据实际需求请求展示任一目标页面。可选地,可以在接收页面展示请求后,可以从中获取待展示的目标页面的页面标识。

针对待生成页面,可以从接收页面展示请求中获取目标页面的页面标识。进一步地,可以根据目标页面的页面标识,查询页面标识与组件标识之间的映射关系,获取目标页面的第二目标组件和第二目标组件的目标组件样式

在步骤1103中,将第二目标组件和第二目标组件的目标组件样式发送给客户端进行展示。

本公开实施例中,在获取到第二目标组件和第二目标组件的目标组件样式后,可以将第二目标组件和第二目标组件的目标组件样式发送给客户端。相应地,客户端可以接收第二目标组件和第二目标组件的目标组件样式,并基于第二目标组件和第二目标组件的目标组件样式进行页面渲染后于交互界面上进行展示。

本公开通过接收页面展示请求,并根据第一页面标识,查询页面标识与组件标识之间的映射关系,获取目标页面的第二目标组件和第二目标组件的目标组件样式,进而将第二目标组件和第二目标组件的目标组件样式发送给客户端进行展示。由此,本公开能够基于预先设定的页面标识与组件标识之间的映射关系,实现第二目标组件和第二目标组件的目标组件样式的快速获取,进而使得由页面生成至页面展示的过程耗时能够极大缩短。

图13是根据一示例性实施例示出的一种页面展示方法的流程图。其中,需要说明的是,本公开的页面展示方法的执行主体为页面展示装置。本公开实施例的页面展示方法可以由本公开实施例的页面展示装置执行,页面展示装置具体可以为硬件设备,或者硬件设备中的软件等。其中,硬件设备例如终端设备、服务器等。

如图13所示,本实施例提出的页面展示方法,包括以下步骤:

在步骤1301中,向页面生成终端发送页面展示请求,其中,页面展示请求包括目标页面的页面标识。

需要说明的是,客户端等页面展示终端上的交互界面上至少设置有页面展示请求发送控件。

以运维人员进行操作为例,可以通过触发页面展示请求控件,向页面生成终端发送页面展示请求。

相应地,页面生成终端可以接收页面展示请求。

需要说明的是,目标页面的页面标识可以为目标页面的唯一标识。

在步骤1302中,接收目标页面的目标组件和目标组件的目标组件样式。

本公开实施例中,在页面生成终端接收到页面展示请求后,可以根据目标页面的页面标识,查询页面标识与组件标识之间的映射关系,获取目标页面的第二目标组件和第二目标组件的目标组件样式。进一步地,页面生成终端可以将第二目标组件和第二目标组件的目标组件样式发送给客户端。

相应地,客户端可以接收目标页面的目标组件和目标组件的目标组件样式。

在步骤1303中,对目标组件按照目标组件样式进行页面渲染,生成并展示目标页面。

本公开实施例中,在接收到第二目标组件和第二目标组件的目标组件样式后,客户端可以对样式和数据进行渲染,以生成并展示目标页面。举例而言,如图14所示,在接收到第二目标组件和第二目标组件的目标组件样式后,客户端可以对样式和数据进行渲染,以生成并展示目标页面14-1。

本公开通过向页面生成终端发送页面展示请求,其中,页面展示请求包括目标页面的页面标识,并接收目标页面的目标组件和目标组件的目标组件样式,进而对目标组件按照目标组件样式进行页面渲染,生成并展示目标页面,以实现页面的展示。由此,本公开能够基于页面标识,实现对应的目标页面的快速展示,缩短了基于组件化思想生成的页面的展示过程中的耗时,提高了页面展示过程中的效率。

需要说明的是,本公开中,客户端可以基于目标页面,于交互界面上展示目标页面对应的主题描述信息。

作为一种可能的实现方式,如图15所示,具体包括以下步骤:

在步骤1501中,根据页面标识,获取目标页面对应的主题描述信息。

其中,目标页面对应的主题描述信息,可以包括但不限于以下信息:主题名称、描述、链接地址等。

需要说明的是,本公开中对于获取主题描述信息的具体方式不作限定,可以根据实际情况进行选取。

作为一种可能的实现方式,可以获取运维人员在创建目标页面前输入的文字信息。此种情况下,可以直接根据用户输入的文字信息获取目标页面对应的主题描述信息。

作为另一种可能的实现方式,可以获取运维人员在创建目标页面前输入的图片信息,其中,图片中至少包括主题描述信息。此种情况下,可以基于OCR(Optical CharacterRecognition,光学字符识别)技术,获取用户输入的图片信息中的文字信息,并根据获取到的文字信息获取目标页面对应的主题描述信息。

在步骤1502中,在页面渲染过程中,获取与主题描述信息关联的目标组件。

本公开实施例中,预先设置有主题描述信息与目标组件之间的映射关系。举例而言,主题名称对应组件1;描述对应组件2;链接地址对应组件3。

在步骤1503中,将主题描述信息渲染至与关联的目标组件中进行展示。举例而言,如图16所示,针对主题描述信息中的主题名称16-1为“限时秒杀”,描述16-2为“精选榜单云产品,每周一场优惠秒杀,助力云上业务飞速增长”。此种情况下,可以将主题名称16-1与描述16-2渲染至与关联的目标组件中进行展示。

本公开通过根据页面标识,获取目标页面对应的主题描述信息,并在页面渲染过程中,获取与主题描述信息关联的目标组件,进而将主题描述信息渲染至与关联的目标组件中进行展示。由此,本公开能够基于目标页面对应的主题描述信息,通过对样式和信息的渲染,实现页面的快速展示。

需要说明的是,本公开提出的页面生成方法及页面展示方法,可以基于组件化概念,实现针对多种推广活动的页面的快速、低成本的页面生成及展示。

针对图17所示的限时秒杀活动以及图18所示的首购优惠活动,尽管页面所展示的内容与布局不仅相同,但是页面的生成和展示过程确实大致相同的。

其中,页面生成终端,即数据管理系统,简称后台系统,进行主题描述信息填充以及目标组件样式的设置;页面展示终端,即运维人员等用户可以查看的系统,简称前端系统,可以根据后台系统填写的该条活动的主题描述信息及样式设置值,填充和设计好活动页面的样式及布局。

可选地,后台系统,可以实现组件的选择并于每个组件中填写对应的数据。进一步地,前端系统,可以根据当前活动页的ID(Identity Document),即页面标识,确定是哪个活动(即为限时秒杀活动或者首购优惠活动),并展示对应活动的名称、描述、链接地址等主题描述信息。进一步地,前端系统,可以根据活动中每个组件的唯一key值,判断对应的组件,然后根据组件设置交互和默认样式,并且根据当前活动当前组件取得后台系统设置的数据,进行样式和数据的渲染,再加上页面滚动、鼠标滑动、鼠标悬浮等默认交互,即可生成并展示目标页面。

需要说明的是,相关技术中,通常采用针对每个新推出的活动需要重新构建对应的HTML+CSS(Cascading Style Sheets,层叠样式表)+JS(Java Script)的文件。这样一来,搭建一个新的活动页面,势必导致重复性工作高,需要测试人员多次介入,极大耗费人力成本的问题。

由此,基于本公开提出的页面生成方法及页面展示方法,能够实现针对同一个组件,基础的交互和基础的样式只需要开发一遍,数据由运维人员进行填写,样式设置则根据UI(User Interface,用户界面)设计稿进行填写,以快速、低成本地生成多种风格迥异的活动页面,降低了耦合度,降低了组件信息或者参数之间的依赖程度。

图19~23是根据一示例性实施例示出的一种页面生成装置框图。

如图19所示,页面生成装置1000,该装置1000包括调用模块110、选取模块120、填充模块130和存储模块140。其中,

调用模块110,用于接收页面生成请求,调用组件库,其中,所述页面生成请求包括待生成页面的第一页面标识;

选取模块120,用于监控组件选取操作,并根据所述组件选取操作从所述组件库中选取所述待生成页面所需的基础组件;

填充模块130,用于获取所述基础组件的属性填充数据,并将所述填充数据填充至所述基础组件中生成第一目标组件;

存储模块140,用于确定所述第一目标组件的目标组件样式,并将所述第一页面标识与所述第一目标组件的组件标识进行关联存储。

在本公开的实施例中,如图20所示,图19中的存储模块140,包括:

预览子模块141,用于获取所述基础组件对应的默认组件样式,并按照所述默认组件样式对所述目标组件进行效果预览;

第一确定子模块142,用于响应于样式确认操作,将所述默认组件样式确定为所述目标组件样式;

第二确定子模块143,用于响应于对所述默认组件样式的修改操作,根据所述修改操作,确定所述目标组件样式。

在本公开的实施例中,如图21所示,图19中的存储模块140,包括:第一获取子模块144,用于基于所述基础组件的组件标识,获取所述基础组件对应的所述默认组件样式。

在本公开的实施例中,如图22所示,图19中的调用模块110,还包括:

第一生成子模块111,用于获取待生成组件的属性元素,并基于所述属性元素生成一个基础组件;

第二生成子模块112,用于获取每个所述基础组件的样式配置信息,并基于所述样式配置信息生成所述基础组件的默认组件样式;

存储子模块113,用于基于所述基础组件和所述基础组件对应的默认组件样式,生成所述基础组件的结构化数据,存储在所述组件库中。

在本公开的实施例中,如图23所示,页面生成装置1000,还包括:第一获取模块150,用于获取所述基础组件的交互配置操作,并基于所述交互配置操作,获取所述基础组件的每个交互的配置信息,其中,所述配置信息包括交互方式以及所述交互方式对应的交互结果。

在本公开的实施例中,如图23所示,页面生成装置1000,还包括:

接收模块160,用于接收页面展示请求,其中,所述页面展示请求中包括目标页面的页面标识;

第二获取模块170,用于根据所述目标页面的页面标识,查询页面标识与组件标识之间的映射关系,获取所述目标页面的第二目标组件和所述第二目标组件的目标组件样式;

发送模块180,用于将所述第二目标组件和所述第二目标组件的目标组件样式发送给客户端进行展示。

本公开通过接收页面生成请求,调用组件库,并监控组件选取操作,根据组件选取操作从组件库中选取待生成页面所需的基础组件,然后获取基础组件的属性填充数据,并将填充数据填充至基础组件中生成第一目标组件,进而确定第一目标组件的目标组件样式,并将第一页面标识与第一目标组件的组件标识进行关联存储,以实现待生成页面的生成。由此,本公开能够基于组件化思想,提供组件库以供选择,从而提供不同组件的多种自由组合,实现针对多种应用场景的待生成页面的快速生成,缩短了页面生成过程中的耗时,提高了灵活性与扩展性,可以减少重复开发导致的资源浪费及不必要的成本支出,提高了页面生成过程中的效率,降低了耦合度。

图24~25是根据一示例性实施例示出的一种页面展示装置框图。

如图24所示,页面展示装置2000,该装置2000包括发送模块210、接收模块220和第一展示模块230。其中,

发送模块210,用于向页面生成终端发送页面展示请求,其中,所述页面展示请求包括目标页面的页面标识;

接收模块220,用于接收所述目标页面的目标组件和所述目标组件的目标组件样式;

第一展示模块230,用于对所述目标组件按照目标组件样式进行页面渲染,生成并展示所述目标页面。

在本公开的实施例中,如图25所示,页面展示装置2000,还包括:

第一获取模块240,用于根据所述页面标识,获取所述目标页面对应的主题描述信息;

第二获取模块250,用于在页面渲染过程中,获取与所述主题描述信息关联的所述目标组件;

第二展示模块260,用于将所述主题描述信息渲染至与所述关联的目标组件中进行展示。

本公开通过接收页面展示请求,并根据第一页面标识,查询页面标识与组件标识之间的映射关系,获取目标页面的第二目标组件和第二目标组件的目标组件样式,进而将第二目标组件和第二目标组件的目标组件样式发送给客户端进行展示。由此,本公开能够基于预先设定的页面标识与组件标识之间的映射关系,实现第二目标组件和第二目标组件的目标组件样式的快速获取,进而使得由页面生成至页面展示的过程耗时能够极大缩短。

为了实现上述实施例,本公开还提供了一种电子设备,如图26所示,所述电子设备8000包括:处理器801;用于存储所述处理器801可执行指令的一个或多个存储器802;其中,所述处理器801被配置为执行上述实施例所述的页面生成方法或者页面展示方法。处理器801和存储器802通过通信总线连接。

为了实现上述实施例,本公开还提供了一种计算机可读存储介质,当计算机可读存储介质中的指令由电子设备8000的处理器801执行时,使得电子设备8000能够执行以完成上述实施例所述的页面生成方法或者页面展示方法。可选地,存储介质可以是非临时性计算机可读存储介质,例如,所述非临时性计算机可读存储介质可以是ROM、随机存取存储器(RAM)、CD-ROM、磁带、软盘和光数据存储设备等。

为了实现上述实施例,本公开还提供一种计算机程序产品,包括计算机程序,其特征在于,所述计算机程序被处理器执行时实现上述实施例所述的页面生成方法或者页面展示方法。

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

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

相关技术
  • 一种页面生成方法、页面展示方法、装置及电子设备
  • 页面标签对应的页面信息的展示方法、装置、电子设备
技术分类

06120113047974