CN112464132A - 页面生成、配置方法及装置 - Google Patents

Abstract

本申请公开了页面生成、配置方法及装置，在页面配置阶段，通过页面配置方法生成并发布具有特定结构的页面配置数据，只需要简单的参数配置即可实现对新增页面的配置，通过修改页面配置数据即可实现对已有页面的升级配置，操作简单，节约终端资源，提高配置效率。在页面显示阶段，通过页面生成方法获取并解析页面配置数据，根据解析结果显示页面，从而实现新增页面和升级页面的落地。

Description

页面生成、配置方法及装置

技术领域

本申请涉及页面开发技术领域，尤其涉及一种页面生成、配置方法及装置。

背景技术

网页是构成网站的基本元素，是承载各种网站应用的平台。用户可以通过各式各样的网页获取信息，方便用户的娱乐、学习和生活。

现有页面更新升级及新增场景的迭代过程中，前端需要通过多次数据请求从后端获取页面数据及业务数据，并依赖DOM(Document Object Model，文档对象模型)树完成页面的生成与展示。

然而，频繁的迭代会让项目越来越冗余，耦合性越来越高，并且，由于DOM树的数据描述为child之间嵌套，导致每次操作和调整都涉及多次深度递归查询，复杂度高，同时，过多的网络请求使程序更易报错。

发明内容

本申请提供一种页面生成、配置方法及装置，仅需配置即可完成页面升级和新增页面的实现，且能简化操作。

第一方面，本申请提供一种页面生成方法，所述方法包括：

从服务端获取目标显示页面对应的业务数据和页面配置数据，所述目标显示页面包括至少一个栅格；

根据预置解析规则，从所述页面配置数据中解析出每个栅格的栅格布局参数、每个栅格对应的栅格元素，以及各栅格元素与业务数据的关联关系；

根据所述栅格布局参数渲染所述目标显示页面的页面布局，并将栅格元素及与栅格元素关联的业务数据加载到对应的栅格中。

进一步，所述页面配置数据包括每个栅格对应的栅格配置数据和每个元素对应的元素配置数据；其中，每个栅格的栅格布局参数从对应的栅格配置数据中解析得到，所述栅格布局参数包括栅格标识、空间分割列数和分割比；每个栅格对应的栅格元素根据对应元素配置数据包含的栅格标识确定，每个栅格元素与业务数据的关联关系根据对应元素配置数据包含的业务数据关联信息确定。

进一步，所述栅格包括至少一个一级栅格，至少一个所述一级栅格包括多个二级栅格；每个栅格的级别根据对应栅格配置数据中包含的级别标识确定。

进一步，所述栅格配置数据还包括栅格描述信息和栅格样式；所述方法还包括：根据所述栅格描述信息和栅格样式渲染所述页面布局。

进一步，所述栅格元素为组件，所述将栅格元素及与栅格元素关联的业务数据加载到对应的栅格中，包括：将所述组件加载到对应的栅格中，将所述关联的业务数据填充到所述组件中。

第二方面，本申请还提供一种页面配置方法，所述方法包括：

获取目标页面对应的各项配置参数，每项配置参数对应一个配置项目，所述配置项目包括栅格配置项目和元素配置项目；

根据各项相对应的配置项目和配置参数生成页面配置数据，所述页面配置数据用于描述所述目标页面中各栅格的栅格布局、各栅格对应的栅格元素以及各栅格元素关联的业务数据；

发布所述页面配置数据。

进一步，所述页面配置数据包括根据各栅格配置项目及对应的配置参数生成的栅格配置数据，和根据各元素配置项目及对应的配置参数生成的元素配置数据，所述栅格配置数据用于描述栅格的栅格布局，所述元素配置数据用于描述元素对应的栅格和元素关联的业务数据。

进一步，发布所述页面配置数据之前，所述方法还包括：响应于终端发送的页面预览请求，根据所述页面配置数据生成预览页面数据；将所述预览页面数据返回给终端，以在终端显示预览页面。

进一步，所述方法还包括：获取修改后的页面配置数据；

根据修改后的页面配置数据更新对应的已发布的页面配置数据。

第三方面，本申请还提供一种页面生成装置，所述装置包括：

数据获取模块，用于从服务端获取目标显示页面对应的业务数据和页面配置数据，所述目标显示页面包括至少一个栅格；

页面渲染模块，用于根据预置解析规则，从所述页面配置数据中解析出每个栅格的栅格布局参数、每个栅格对应的栅格元素，以及各栅格元素与业务数据的关联关系；根据所述栅格布局参数渲染所述目标显示页面的页面布局；

组件加载模块，用于将栅格元素及与栅格元素关联的业务数据加载到对应的栅格中。

进一步，所述页面配置数据包括每个栅格对应的栅格配置数据和每个元素对应的元素配置数据；

其中，每个栅格的栅格布局参数从对应的栅格配置数据中解析得到，所述栅格布局参数包括栅格标识、空间分割列数和分割比；每个栅格对应的栅格元素根据对应元素配置数据包含的栅格标识确定，每个栅格元素与业务数据的关联关系根据对应元素配置数据包含的业务数据关联信息确定。

进一步，所述栅格包括至少一个一级栅格，至少一个所述一级栅格包括多个二级栅格；每个栅格的级别根据对应栅格配置数据中包含的级别标识确定。

进一步，所述栅格配置数据还包括栅格描述信息和栅格样式；所述页面渲染模块具体用于根据所述栅格描述信息和栅格样式渲染所述页面布局。

进一步，所述栅格元素为组件，所述组件加载模块具体用于将所述组件加载到对应的栅格中，将所述关联的业务数据填充到所述组件中。

第四方面，本申请还提供一种页面配置装置，所述装置包括：

数据配置模块，用于获取目标页面对应的各项配置参数，每项配置参数对应一个配置项目，所述配置项目包括栅格配置项目和元素配置项目；

数据生成模块，用于根据各项相对应的配置项目和配置参数生成页面配置数据，所述页面配置数据用于描述所述目标页面中各栅格的栅格布局、各栅格对应的栅格元素以及各栅格元素关联的业务数据；

数据发布模块，用于发布所述页面配置数据。

进一步，所述页面配置数据包括根据各栅格配置项目及对应的配置参数生成的栅格配置数据，和根据各元素配置项目及对应的配置参数生成的元素配置数据，所述栅格配置数据用于描述栅格的栅格布局，所述元素配置数据用于描述元素对应的栅格和元素关联的业务数据。

进一步，所述装置还包括：

页面预览模块，用于响应于终端发送的页面预览请求，根据所述页面配置数据生成预览页面数据；将所述预览页面数据返回给终端，以在终端显示预览页面。

进一步，所述装置还包括：

数据修改模块，用于获取修改后的页面配置数据；

所述数据发布模块，还用于根据修改后的页面配置数据更新对应的已发布的页面配置数据。第五方面，本申请还提供一种电子设备，包括：

存储器，用于存储程序指令；

处理器，用于调用并执行所述存储器中的程序指令，以实现第一方面所述的页面生成方法。

第六方面，本申请还提供一种电子设备，包括：

存储器，用于存储程序指令；

处理器，用于调用并执行所述存储器中的程序指令，以实现第二方面所述的页面配置方法。

第七方面，本申请还提供一种存储介质，所述存储介质中存储有计算机程序，当页面生成装置的至少一个处理器执行所述计算机程序时，页面生成装置执行页面生成方法。

第八方面，本申请还提供一种存储介质，所述存储介质中存储有计算机程序，当页面配置装置的至少一个处理器执行所述计算机程序时，页面配置装置执行页面配置方法。

由以上技术方案可知，本申请提供一种页面生成、配置方法及装置，在页面配置阶段，通过页面配置方法生成并发布具有特定结构的页面配置数据，只需要简单的参数配置即可实现对新增页面的配置，通过修改页面配置数据即可实现对已有页面的升级配置，操作简单，节约终端资源，提高配置效率。在页面显示阶段，通过页面生成方法获取并解析页面配置数据，根据解析结果显示页面，从而实现新增页面和升级页面的落地。

附图说明

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

图1为本申请实施例提供的一种场景示意图；

图2为本申请实施例提供的一种页面配置方法流程图；

图3为本申请实施例提供的一种页面生成方法流程图；

图4为本申请实施例提供的一种页面配置装置框图；

图5为本申请实施例提供的一种页面生成装置框图；

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

具体实施方式

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

本申请提供的页面生成方法和页面配置方法，可以应用于图1所示场景中。如图1所示，终端101与服务器102可通过网络进行通信。其中，终端101可以是手机、计算机、平板电脑、各类信息传感设备等具有信息显示功能、数据收发功能以及数据处理功能的终端设备。作为示例，终端101可以包括处理器、存储器和通信接口，其中，处理器、存储器和通信接口耦合，存储器中存储有程序指令，处理器可调用存储器中的程序指令，使终端可以执行相关的方法。例如，向服务器102发送各类请求、消息等等。服务器102可以为服务器或服务器构成的集群(可带有旁挂设备)、云服务提供的虚拟机、计算机等具有图像渲染、编码、数据采集、数据处理功能的设备。作为示例，服务器102可以包括：至少一个处理器、至少一个存储器和至少一个接口单元，其中，处理器、存储器和通信接口耦合，存储器中存储有程序指令，处理器可调用存储器中的程序指令，使服务器执行相关的方法，例如，向终端101返回各类数据和消息等等。

本申请实施例涉及的页面可以业务数据审核场景中的审核页面。其中，业务数据可以是用户发布在业务平台上的帖子数据、交易数据、用户提交的个人信息数据等等。在审核场景中，审核页面作为待审核业务数据的载体，显示给用户，以供用户审核。

图2为本申请提供的一种页面配置方法流程图，该方法可以应用如图1所示的服务器102，如图2所示，该方法可以包括：

S201，获取目标页面对应的各项配置参数，每项配置参数对应一个配置项目，所述配置项目包括栅格配置项目和元素配置项目。

本申请实施例中，目标页面的页面布局是符合平铺规则的栅格布局。

在一种可能的实现方式中，终端用户通过操作终端登录页面配置平台。页面配置平台通过终端显示可视化的配置页面，该配置页面为用户提供用于配置页面的交互入口。在配置页面中显示有至少一个用于对目标页面进行配置的配置项目，配置项目包括栅格配置项目和元素配置项目。应当理解，栅格配置项目用于对目标页面的栅格布局进行配置，元素配置项目用于对目标页面中的元素进行配置。

在配置页面中，用户可以根据各个配置项目的指示，输入与各个配置项目对应的配置参数，并在完成输入后，提交输入的各项配置参数。终端接收到用户输入的各项配置参数后，将各配置项目和对应的配置参数发送给服务器。

在一些实施例中，每个栅格配置项目待输入的配置参数可以包括栅格的唯一性标识、空间分割列数和分割比。其中，空间分割列数和分割比作为栅格布局参数，用于描述栅格的基本空间布局。每个元素配置项目待输入的配置参数可以包括元素的唯一性标识、与该元素对应的栅格的唯一性标识，以及用于关联业务数据的业务数据关联信息。这样，便可在页面配置阶段，将各个元素与栅格关联起来，从而完成各元素的位置配置，以在显示页面时，可以将元素显示在与其关联的栅格中。

需要说明的是，业务数据关联信息可以为与该元素关联的业务字段的字段名称，根据该字段名称可以匹配到业务数据字段，进而在显示页面时，可将与该字段名称匹配的业务数据填充到元素中。

在一些实施例中，为实现栅格之间的嵌套，栅格配置项目待输入的配置参数还可以包括栅格的级别标识，从而通过栅格的级别标识表征栅格的级别及不同级别栅格之间的所属关系。在一个例子中，可以将最高级别的栅格称为一级栅格，将最低级别的栅格称为末级栅格。一级栅格可以包括多个二级栅格，该二级栅格可以是末级栅格，也可以不是末级栅格，如三级栅格。末级栅格不再包括更低级别的栅格，每个末级栅格至少归属于一个一级栅格，还可以同时归属于多个级别较高的栅格，如同时隶属于一个二级栅格，和该二级栅格隶属的一级栅格。

在一些实施例中，页面元素可以是组件，通过组件可以为目标页面注册相应的点击方案。

S202，根据各项相对应的配置项目和配置参数生成页面配置数据，所述页面配置数据用于描述所述目标页面中各栅格的栅格布局、各栅格对应的栅格元素以及各栅格元素关联的业务数据。

本申请实施例中，根据各项相对应的配置项目和配置参数生成页面配置数据，是指将各个配置项目和对应的配置参数以特定结构封装成页面配置数据。

在一些实施例中，具有特定结构的页面配置数据可以包括至少一个栅格配置数据和至少一个元素配置数据，其中，每个栅格配置数据都是根据每个栅格对应的各栅格配置项目及对应的配置参数生成的，每个元素配置数据都是根据每个元素对应的各元素配置项目及对应的配置参数生成的。

一个栅格配置数据具体可以为一个栅格配置字段，栅格配置字段的字段名称可以为“layout”，栅格配置字段的字段值可以由多个字段组成，其中，各个字段用于分别用于写入各个栅格配置项目及对应的配置参数。具体的，每个字段的字段名称可以为一个栅格配置项目的项目名称，字段值可以为该栅格配置项目对应的配置参数。

具体的，栅格配置字段的字段值可以包括，用于写入栅格的唯一性标识的字段“id:[]”、用于写入栅格的级别标识的字段“parentId:[]”、用于写入栅格的空间分割列数的字段“column:[]”、用于写入栅格的空间分割比的字段“mix:[]”。

除此之外，栅格配置字段的字段值还可以包括用于写入栅格的样式的字段“style:[]”。还可以包括扩展字段“options:[]”，在拓展字段中可以写入栅格详细描述信息。

一个元素配置数据具体可以为一个元素配置字段，元素配置字段的字段名称可以为“element”，元素配置字段的字段值可以由多个字段组成，其中，各个字段分别用于写入各个元素配置项目及对应的配置参数。每个字段的字段名称可以为一个元素配置项目的项目名称，字段值可以为该元素配置项目对应的配置参数。

具体的，元素配置字段的字段值可以包括，用于写入元素的唯一性标识的字段“id:[]”、用于写入与元素关联的栅格的唯一性标识的字段“parentId:[]”、用于写入业务数据关联信息的字段“data:[]”。

除此之外，元素配置字段的字段值还可以包括用于写入元素顺序标识的字段“sort:[]”、用于写入元素名称的字段“type:[]”以及扩展字段“options:[]”中的一项或者多项。

一种示例性的页面配置数据的结构如下：

S203，发布所述页面配置数据。

应当理解，在服务器上，页面配置数据与页面标识对应保存。这样，终端可以根据页面标识向服务器请求对应的页面配置数据，服务器可以根据页面标识查找到对应的页面配置数据，以返回给终端。

在一些实施例中，页面配置平台为用户提供页面预览功能。例如，在配置页面提供预览按钮，该预览按钮在用户提交输入的各项配置参数后进入激活状态。用户可以通过操作激活的预览按钮触发页面预览功能。终端接收到用户对预览按钮的操作后，向服务器发送页面预览请求，页面预览请求携带指定标识，该指定标识与指定页面配置数据对应。服务器响应于接收到终端发送的页面预览请求，根据请求中携带的指定标识查询对应的页面配置数据，并根据查询到的页面配置数据生成预览页面数据，将预览页面数据发送给终端。终端接收到预览页面数据，根据预览页面数据显示预览页面。应当理解，预览页面数据与页面配置数据的区别在于，预览页面数据包括虚拟业务数据，该虚拟页面数据用于代替真实的业务数据填充在预览页面中。

这样，基于预览页面，用户可以查看配置的目标页面是否符合要求，为修改配置提供依据。

在一些实施例中，用户可以基于配置平台对已发布的页面配置数据进行修改，从而修改对页面的配置，实现页面更新和升级的场景。具体的，终端接收到输入的修改后的页面配置数据后，将修改后的页面配置数据发送给服务器，服务器获取到修改后的页面配置数据后，根据修改后的页面配置数据更新对应的已发布的页面配置数据。

由以上实施例可知，本申请实施例提供一种页面配置方法，包括：获取目标页面对应的各项配置参数，每项配置参数对应一个配置项目，所述配置项目包括栅格配置项目和元素配置项目；根据各项相对应的配置项目和配置参数生成页面配置数据，所述页面配置数据用于描述所述目标页面中各栅格的栅格布局、各栅格对应的栅格元素以及各栅格元素关联的业务数据；发布所述页面配置数据。本申请提供的页面配置方法，基于页面配置平台提供的可视化配置页面，只需要简单的参数配置即可实现新增页面的场景，通过修改页面配置数据即可完成页面更新及升级，操作简单，节约终端资源，提高配置效率。

图3为本申请提供的一种页面生成方法流程图，该方法可以应用如图1所示的终端101，如图3所示，该方法可以包括：

S301，从服务端获取目标显示页面对应的业务数据和页面配置数据，所述目标显示页面包括至少一个栅格。

本申请实施例中，目标显示页面的页面布局是符合平铺规则的栅格布局。

应当理解，终端向服务端请求中的页面配置数据即服务器通过S201-203发布的页面配置数据。

在一种可能的实现方式中，终端用户可以通过操作终端101，控制终端101生成页面请求，并将生成的页面请求发送给服务器102。例如，终端用户通过终端上安装的浏览器访问某个网站的页面，此时，终端响应于用户输入的访问操作，生成页面请求。该页面请求至少包括页面标识。服务器102接收到终端发送的页面请求后，根据页面请求中的页面标识查找对应的页面配置数据和业务数据，将页面配置数据和业务数据返回给终端102。

在一些实施例中，终端101可以将页面请求分别发送给第一服务器和第二服务器，以向第一服务器请求页面配置数据，向第二服务器请求业务数据。

在本申请实施例中，页面配置数据具有特定结构。需要说明的是，页面配置数据的具体结构可以参见图2所示实施例中的例子，此处不予赘述。

S302，根据预置解析规则，从所述页面配置数据中解析出每个栅格的栅格布局参数、每个栅格对应的栅格元素，以及各栅格元素与业务数据的关联关系。

应当理解，预置解析规则是与页面配置数据的特定结构相适配的规则，从而根据该解析规则可以解析页面配置数据。

在一些实施例中，页面配置数据包括每个栅格对应的栅格配置数据和每个元素对应的元素配置数据。

其中，一个栅格配置数据具体可以为一个栅格配置字段，栅格配置字段的字段名称可以为“layout”，栅格配置字段的字段值可以由多个字段组成，其中，各个字段用于分别用于写入各个栅格配置项目及对应的配置参数。具体的，每个字段的字段名称可以为一个栅格配置项目的项目名称，字段值可以为该栅格配置项目对应的配置参数。

具体的，栅格配置字段的字段值可以包括，用于写入栅格的唯一性标识的字段“id:[]”、用于写入栅格的级别标识的字段“parentId:[]”、用于写入栅格的空间分割列数的字段“column:[]”、用于写入栅格的空间分割比的字段“mix:[]”。

除此之外，栅格配置字段的字段值还可以包括用于写入栅格的样式的字段“style:[]”。还可以包括扩展字段“options:[]”，在拓展字段中可以写入栅格详细描述信息。

一个元素配置数据具体可以为一个元素配置字段，元素配置字段的字段名称可以为“element”，元素配置字段的字段值可以由多个字段组成，其中，各个字段分别用于写入各个元素配置项目及对应的配置参数。每个字段的字段名称可以为一个元素配置项目的项目名称，字段值可以为该元素配置项目对应的配置参数。

具体的，元素配置字段的字段值可以包括，用于写入元素的唯一性标识的字段“id:[]”、用于写入与元素关联的栅格的唯一性标识的字段“parentId:[]”、用于写入业务数据关联信息的字段“data:[]”。

除此之外，元素配置字段的字段值还可以包括用于写入元素顺序标识的字段“sort:[]”、用于写入元素名称的字段“type:[]”以及扩展字段“options:[]”中的一项或者多项。

基于此，每个栅格的栅格布局参数可以从对应的栅格配置数据中解析得到。例如，解析“layout”对应的字段值中的字段“id:[]”，可以得到栅格的唯一性标识，解析字段“column:[]”可以得到栅格的空间分割列数，解析字段“mix:[]”可以得到栅格的空间分割比。每个栅格对应的栅格元素可以根据对应元素配置数据包含的栅格标识确定，每个栅格元素与业务数据的关联关系可以根据对应元素配置数据包含的业务数据关联信息确定。例如，解析“element”对应的字段值中的字段“id:[]”，可以得到元素的唯一性标识，解析字段“parentId:[]”可以得到关联栅格的唯一性标识，解析“data:[]”可以得到关联的业务数据。

在一些实施例中，为实现栅格之间的嵌套，每个栅格对应的栅格配置数据中还包括栅格的级别标识，该级别标识用于表征该栅格的级别及与其他栅格的的所属关系。在一个例子中，可以将最高级别的栅格称为一级栅格，将最低级别的栅格称为末级栅格。一级栅格可以包括多个二级栅格，该二级栅格可以是末级栅格，也可以不是末级栅格，如三级栅格。末级栅格不包括更低级别的栅格，每个末级栅格至少归属于一个一级栅格，还可以同时归属于多个级别较高的栅格，如同时隶属于一个二级栅格，和该二级栅格隶属的一级栅格。

在一些实施例中，构成目标显示页面的栅格包括至少一个一级栅格，所有一级栅格中至少一个一级栅格包括多个二级栅格。

在一些实施例中，每个栅格配置数据中还包括用于写入栅格的级别标识的字段“parentId:[]”，通过解析该字段，可以得到栅格的级别。除此之外，在栅格不是一级栅格时，还可以根据栅格的级别标识确定该栅格隶属的上一级栅格，从而将各个下级栅格嵌套在其隶属的上级栅格中进行布局。

S303，根据所述栅格布局参数渲染所述目标显示页面的页面布局，并将栅格元素及与栅格元素关联的业务数据加载到对应的栅格中。

在一些实施例中，栅格元素为组件。S303具体实现时，通过栅格渲染器，根据各栅格的栅格布局参数渲染目标显示页面的页面布局；通过组件加载器将各组件元素加载到对应的栅格中，并将与各组件元素关联的业务数据填充到组件中。

在一些实施例中，每个栅格配置数据还包括栅格描述信息和栅格样式。其中，可以通过解析栅格配置数据中的扩展字段“options:[]”，得到栅格描述信息，解析字段“type:[]”，得到栅格样式。基于此，本申请提供的页面生成方法还包括：根据所述栅格描述信息和栅格样式渲染所述页面布局。

基于图2所示的页面配置方法和发布的页面配置数据，本申请实施例提供一种对应的页面生成方法，该方法首先从服务端获取目标显示页面对应的业务数据和页面配置数据；然后根据预置解析规则，从页面配置数据中解析出每个栅格的栅格布局参数、每个栅格对应的栅格元素，以及各栅格元素与业务数据的关联关系；最后根据栅格布局参数渲染目标显示页面的页面布局，并将栅格元素及与栅格元素关联的业务数据加载到对应的栅格中。本申请方法基于特定结构的页面配置数据，通过栅格渲染器和组件加载器即可完成目标显示页面的显示，其中，只需要简单的参数配置即可实现对各类新增页面的场景，通过修改页面配置数据即可升级各类页面，操作简单，节约终端资源，提高配置效率。

根据上述实施例提供的页面配置方法，本申请实施例还提供一种页面配置装置，如图4所示，该装置可以包括：数据配置模块401，用于获取目标页面对应的各项配置参数，每项配置参数对应一个配置项目，所述配置项目包括栅格配置项目和元素配置项目；数据生成模块402，用于根据各项相对应的配置项目和配置参数生成页面配置数据，所述页面配置数据用于描述所述目标页面中各栅格的栅格布局、各栅格对应的栅格元素以及各栅格元素关联的业务数据；数据发布模块403，用于发布所述页面配置数据。

在一些实施例中，页面配置数据包括根据各栅格配置项目及对应的配置参数生成的栅格配置数据，和根据各元素配置项目及对应的配置参数生成的元素配置数据，所述栅格配置数据用于描述栅格的栅格布局，所述元素配置数据用于描述元素对应的栅格和元素关联的业务数据。

在一些实施例中，页面配置装置还包括：页面预览模块，用于响应于终端发送的页面预览请求，根据所述页面配置数据生成预览页面数据；将所述预览页面数据返回给终端，以在终端显示预览页面。

在一些实施例中，页面配置装置还包括：数据修改模块，用于获取修改后的页面配置数据；所述数据发布模块，还用于根据修改后的页面配置数据更新对应的已发布的页面配置数据。

根据上述实施例提供的页面生成方法，本申请实施例还提供一种页面生成装置，如图5所示，该装置可以包括：数据获取模块501，用于从服务端获取目标显示页面对应的业务数据和页面配置数据，所述目标显示页面包括至少一个栅格；页面渲染模块502，用于根据预置解析规则，从所述页面配置数据中解析出每个栅格的栅格布局参数、每个栅格对应的栅格元素，以及各栅格元素与业务数据的关联关系；根据所述栅格布局参数渲染所述目标显示页面的页面布局；组件加载模块503，用于将栅格元素及与栅格元素关联的业务数据加载到对应的栅格中。

在一些实施例中，所述页面配置数据包括每个栅格对应的栅格配置数据和每个元素对应的元素配置数据；其中，每个栅格的栅格布局参数从对应的栅格配置数据中解析得到，所述栅格布局参数包括栅格标识、空间分割列数和分割比；每个栅格对应的栅格元素根据对应元素配置数据包含的栅格标识确定，每个栅格元素与业务数据的关联关系根据对应元素配置数据包含的业务数据关联信息确定。

在一些实施例中，所述栅格包括至少一个一级栅格，至少一个所述一级栅格包括多个二级栅格；每个栅格的级别根据对应栅格配置数据中包含的级别标识确定。

在一些实施例中，所述栅格配置数据还包括栅格描述信息和栅格样式；所述方法还包括：根据所述栅格描述信息和栅格样式渲染所述页面布局。

在一些实施例中，所述栅格元素为组件，所述组件加载模块，具体用于将所述组件加载到对应的栅格中，将所述关联的业务数据填充到所述组件中。

图6为本申请实施例提供的电子设备的硬件结构示意图。如图6所示，该电子设备，可以包括：存储器601，用于存储程序指令；处理器602，用于调用并执行所述存储器中的程序指令。

在一些实施例中，处理器602中存储与页面配置方法对应的程序指令，以实现页面配置方法。

在另一些实施例中，处理器602中存储与页面生成方法对应的程序指令，以实现页面生成方法。

本实施例中，处理器和存储器可通过总线或其他方式连接。处理器可以是通用处理器，例如中央处理器、数字信号处理器、专用集成电路，或者被配置成实施本发明实施例的一个或多个集成电路。存储器可以包括易失性存储器，例如随机存取存储器；存储器也可以包括非易失性存储器，例如只读存储器、快闪存储器、硬盘或固态硬盘。

具体实现中，本发明还提供一种计算机存储介质，其中，该计算机存储介质可存储有计算程序，当页面配置装置的至少一个处理器执行所述计算机程序时，页面配置装置执行本申请页面配置方法的各实施例中的部分或全部步骤。所述的存储介质可为磁碟、光盘、只读存储记忆体(英文：read-only memory，简称：ROM)或随机存储记忆体(英文：randomaccess memory，简称：RAM)等。

本发明还提供一种计算机存储介质，其中，该计算机存储介质可存储有计算程序，当页面生成装置的至少一个处理器执行所述计算机程序时，页面生成装置执行本申请页面生成方法的各实施例中的部分或全部步骤。所述的存储介质可为磁碟、光盘、只读存储记忆体(英文：read-only memory，简称：ROM)或随机存储记忆体(英文：random access memory，简称：RAM)等。

本领域的技术人员可以清楚地了解到本发明实施例中的技术可借助软件加必需的通用硬件平台的方式来实现。基于这样的理解，本发明实施例中的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品可以存储在存储介质中，如ROM/RAM、磁碟、光盘等，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行本发明各个实施例或者实施例的某些部分所述的方法。

本说明书中各个实施例之间相同相似的部分互相参见即可。尤其，对于装置实施例而言，由于其基本相似于方法实施例，所以描述的比较简单，相关之处参见方法实施例中的说明即可。

以上所述的本发明实施方式并不构成对本发明保护范围的限定。

Claims (22)

1.一种页面生成方法，其特征在于，所述方法包括：

从服务端获取目标显示页面对应的业务数据和页面配置数据，所述目标显示页面包括至少一个栅格；

根据预置解析规则，从所述页面配置数据中解析出每个栅格的栅格布局参数、每个栅格对应的栅格元素，以及各栅格元素与业务数据的关联关系；

根据所述栅格布局参数渲染所述目标显示页面的页面布局，并将栅格元素及与栅格元素关联的业务数据加载到对应的栅格中。

2.根据权利要求1所述的方法，其特征在于，所述页面配置数据包括每个栅格对应的栅格配置数据和每个元素对应的元素配置数据；

其中，每个栅格的栅格布局参数从对应的栅格配置数据中解析得到，所述栅格布局参数包括栅格标识、空间分割列数和分割比；每个栅格对应的栅格元素根据对应元素配置数据包含的栅格标识确定，每个栅格元素与业务数据的关联关系根据对应元素配置数据包含的业务数据关联信息确定。

3.根据权利要求2所述的方法，其特征在于，所述栅格包括至少一个一级栅格，至少一个所述一级栅格包括多个二级栅格；每个栅格的级别根据对应栅格配置数据中包含的级别标识确定。

4.根据权利要求2或3所述的方法，其特征在于，所述栅格配置数据还包括栅格描述信息和栅格样式；所述方法还包括：根据所述栅格描述信息和栅格样式渲染所述页面布局。

5.根据权利要求1所述的方法，其特征在于，所述栅格元素为组件，所述将栅格元素及与栅格元素关联的业务数据加载到对应的栅格中，包括：将所述组件加载到对应的栅格中，将所述关联的业务数据填充到所述组件中。

6.一种页面配置方法，其特征在于，所述方法包括：

获取目标页面对应的各项配置参数，每项配置参数对应一个配置项目，所述配置项目包括栅格配置项目和元素配置项目；

根据各项相对应的配置项目和配置参数生成页面配置数据，所述页面配置数据用于描述所述目标页面中各栅格的栅格布局、各栅格对应的栅格元素以及各栅格元素关联的业务数据；

发布所述页面配置数据。

7.根据权利要求6所述的方法，其特征在于，所述页面配置数据包括根据各栅格配置项目及对应的配置参数生成的栅格配置数据，和根据各元素配置项目及对应的配置参数生成的元素配置数据，所述栅格配置数据用于描述栅格的栅格布局，所述元素配置数据用于描述元素对应的栅格和元素关联的业务数据。

8.根据权利要求6或者7所述的方法，其特征在于，发布所述页面配置数据之前，所述方法还包括：

响应于终端发送的页面预览请求，根据所述页面配置数据生成预览页面数据；

将所述预览页面数据返回给终端，以在终端显示预览页面。

9.根据权利要求6或者7所述的方法，其特征在于，所述方法还包括：

获取修改后的页面配置数据；

根据修改后的页面配置数据更新对应的已发布的页面配置数据。

10.一种页面生成装置，其特征在于，所述装置包括：

数据获取模块，用于从服务端获取目标显示页面对应的业务数据和页面配置数据，所述目标显示页面包括至少一个栅格；

页面渲染模块，用于根据预置解析规则，从所述页面配置数据中解析出每个栅格的栅格布局参数、每个栅格对应的栅格元素，以及各栅格元素与业务数据的关联关系；根据所述栅格布局参数渲染所述目标显示页面的页面布局；

组件加载模块，用于将栅格元素及与栅格元素关联的业务数据加载到对应的栅格中。

11.根据权利要求10所述的装置，其特征在于，所述页面配置数据包括每个栅格对应的栅格配置数据和每个元素对应的元素配置数据；

其中，每个栅格的栅格布局参数从对应的栅格配置数据中解析得到，所述栅格布局参数包括栅格标识、空间分割列数和分割比；每个栅格对应的栅格元素根据对应元素配置数据包含的栅格标识确定，每个栅格元素与业务数据的关联关系根据对应元素配置数据包含的业务数据关联信息确定。

12.根据权利要求11所述的装置，其特征在于，所述栅格包括至少一个一级栅格，至少一个所述一级栅格包括多个二级栅格；每个栅格的级别根据对应栅格配置数据中包含的级别标识确定。

13.根据权利要求11或者12所述的装置，其特征在于，所述栅格配置数据还包括栅格描述信息和栅格样式；所述页面渲染模块，具体用于根据所述栅格描述信息和栅格样式渲染所述页面布局。

14.根据权利要求10所述的装置，其特征在于，所述栅格元素为组件，所述组件加载模块，具体用于将所述组件加载到对应的栅格中，将所述关联的业务数据填充到所述组件中。

15.一种页面配置装置，其特征在于，所述装置包括：

数据配置模块，用于获取目标页面对应的各项配置参数，每项配置参数对应一个配置项目，所述配置项目包括栅格配置项目和元素配置项目；

数据生成模块，用于根据各项相对应的配置项目和配置参数生成页面配置数据，所述页面配置数据用于描述所述目标页面中各栅格的栅格布局、各栅格对应的栅格元素以及各栅格元素关联的业务数据；

数据发布模块，用于发布所述页面配置数据。

16.根据权利要求15所述的装置，其特征在于，所述页面配置数据包括根据各栅格配置项目及对应的配置参数生成的栅格配置数据，和根据各元素配置项目及对应的配置参数生成的元素配置数据，所述栅格配置数据用于描述栅格的栅格布局，所述元素配置数据用于描述元素对应的栅格和元素关联的业务数据。

17.根据权利要求15或者16所述的装置，其特征在于，所述装置还包括：

页面预览模块，用于响应于终端发送的页面预览请求，根据所述页面配置数据生成预览页面数据；将所述预览页面数据返回给终端，以在终端显示预览页面。

18.根据权利要求15或者16所述的装置，其特征在于，所述装置还包括：

数据修改模块，用于获取修改后的页面配置数据；

所述数据发布模块，还用于根据修改后的页面配置数据更新对应的已发布的页面配置数据。

19.一种电子设备，其特征在于，包括：

存储器，用于存储程序指令；

处理器，用于调用并执行所述存储器中的程序指令，以实现权利要求1-5任一项所述的页面生成方法。

20.一种电子设备，其特征在于，包括：

存储器，用于存储程序指令；

处理器，用于调用并执行所述存储器中的程序指令，以实现权利要求6-9任一项所述的页面配置方法。

21.一种存储介质，其特征在于，所述存储介质中存储有计算机程序，当页面生成装置的至少一个处理器执行所述计算机程序时，页面生成装置执行权利要求1-5任一项所述的页面生成方法。

22.一种存储介质，其特征在于，所述存储介质中存储有计算机程序，当页面配置装置的至少一个处理器执行所述计算机程序时，页面配置装置执行权利要求6-9任一项所述的页面配置方法。

Images