CN112463154A - 页面生成方法、装置、系统和电子设备 - Google Patents

Abstract

本发明提供了一种页面生成方法、装置、系统、电子设备和存储介质，该方法包括：客户端响应于用户的触发操作，向服务器发送页面生成请求，以使服务器根据页面生成请求，基于预设的组件数据库，生成待生成页面对应的动态组件配置信息，基于动态组件配置信息确定相应的待生成页面数据，并将动态组件配置信息和待生成页面数据发送至客户端；客户端根据接收的动态组件配置信息确定待生成页面中的各组件以及各组件对应的显示顺序；根据显示顺序和待生成页面数据，对各组件进行渲染，生成待生成页面。该页面生成方法在服务器中生成动态组件配置信息，即在服务器端根据不同的页面生成请求生成对应的动态组件配置信息，从而提高了业务平台的开发效率。

Description

页面生成方法、装置、系统和电子设备

技术领域

本发明涉及互联网技术领域，尤其涉及一种页面生成方法、装置、系统和电子设备。

背景技术

随着互联网和计算机技术的迅速发展，越来越多的业务可以在网上进行，用户可以通过互联网向业务系统提交业务请求，业务系统根据接收的业务请求进行相应的业务处理，并向用户返回业务处理结果，在此过程中，业务系统会根据用户的业务请求生成相应的业务数据，并将这些业务数据以生成页面的形式显示。在实际应用中，为了应对用户的需求变更，需要不断地根据用户的业务请求修改业务数据，进而不断修改待生成的页面。在现有技术中，如专利CN110046021B公开的页面显示方法中，根据用户的需求动态配置生成界面时，例如对页面组件进行增加、修改、删除等操作时，服务器端根据页面显示请求从预先存储的显示数据库中获取组件顺序信息和待显示页面数据并发送给客户端，客户端预先存储有所有组件，根据接收到的组件顺序信息确定待显示的组件和组件的显示顺序，进而实现了页面的动态配置。在客户端（即前端）创建组件和组件显示顺序，就需要在每次对组件进行增删改操作时，都进行一次组件的调整与显示，每次都需要重新根据用户需求进行一次业务处理，然后才能编译发布，尤其在应对不同用户、不同的业务请求时，需要分开处理不同的业务请求，需要分别将所有的业务请求都处理完后，才能编译发布，导致平台开发的效率较低。

发明内容

本发明提供了一种页面生成方法、装置、系统、电子设备和存储介质，目的在于提供一种减少开发时间，提高业务平台开发效率的方法、装置、系统、电子设备和存储介质，解决目前业务平台开发效率较低的技术问题。

第一方面，本发明提供一种页面生成方法，应用于客户端，所述方法包括：

响应于用户的触发操作，向服务器发送页面生成请求，以使所述服务器根据所述页面生成请求，基于预设的组件数据库，生成待生成页面对应的动态组件配置信息，基于所述动态组件配置信息确定相应的待生成页面数据，并将所述动态组件配置信息和所述待生成页面数据发送至所述客户端；

根据接收的所述动态组件配置信息确定待生成页面中的各组件以及各所述组件对应的显示顺序；

根据所述显示顺序和所述待生成页面数据，对各所述组件进行渲染，生成待生成页面。

在一实施例中，所述根据接收的所述动态组件配置信息确定待生成页面中的各组件以及各所述组件对应的显示顺序，可以包括：

根据接收的所述动态组件配置信息中的各组件标识，从所述预设的组件数据库中确定与所述各组件标识对应的组件；

根据所述动态组件配置信息中的各组件标识对应的排列顺序，确定各所述组件对应的显示顺序。

在一实施例中，所述根据所述显示顺序和所述待生成页面数据，对各所述组件进行渲染，生成所述待生成页面，可以包括：

根据各所述组件对应的显示顺序，确定每个所述组件对应的显示位置；

根据每个所述组件对应的显示位置和所述待生成页面数据中的每个所述组件对应的待生成数据，对每个所述组件进行渲染，生成所述待生成页面。

在一实施例中，所述根据所述动态组件配置信息中的各组件标识对应的排列顺序，确定各所述组件对应的显示顺序，可以包括：

将所述动态组件配置信息中的各组件标识对应的排列顺序，确定为各所述组件对应的纵向显示顺序，以使各所述组件在显示界面中纵向显示。

第二方面，本发明提供了一种页面生成方法，应用于服务器，所述方法包括：

接收客户端发送的页面生成请求；

根据所述页面生成请求，基于预设的组件数据库，生成待生成页面对应的动态组件配置信息；

基于所述动态组件配置信息确定相应的待生成页面数据，并将所述动态组件配置信息和所述待生成页面数据发送至所述客户端。

在一实施例中，所述根据所述页面生成请求，基于预设的组件数据库，生成待生成页面对应的动态组件配置信息，可以包括：

根据所述页面生成请求确定所述待生成页面中包括的组件信息；

基于预设的组件数据库更新所述待生成页面中包括的组件信息；

将更新后的所述待生成页面中包括的组件信息确定为所述待生成页面对应的动态组件配置信息。

在一实施例中，所述基于预设的组件数据库更新所述待生成页面中包括的组件配置信息，可以包括：

从预设的组件数据库中获取与所述待生成页面中包括的组件信息的配置信息；

根据所述页面生成请求更新所述待生成页面中包括的组件配置信息，其中，所述页面生成请求包括请求更新的组件信息的组件标识。

在一实施例中，所述基于所述动态组件配置信息确定相应的待生成页面数据，并将所述动态组件配置信息和所述待生成页面数据发送至所述客户端，可以包括：

基于所述动态组件配置信息确定各组件的组件标识；

根据各所述组件的组件标识从所述预设的组件数据库中获取待生成页面数据，并将所述动态组件配置信息和所述待生成页面数据发送至所述客户端。

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

页面生成请求发送模块，用于响应于用户的触发操作，向服务器发送页面生成请求，以使所述服务器根据所述页面生成请求，基于预设的组件数据库，生成待生成页面对应的动态组件配置信息，基于所述动态组件配置信息确定相应的待生成页面数据，并将所述动态组件配置信息和所述待生成页面数据发送至客户端；

组件确定模块，用于根据接收的所述动态组件配置信息确定待生成页面中的各组件以及各所述组件对应的显示顺序；

页面生成模块，用于根据所述显示顺序和所述待生成页面数据，对各所述组件进行渲染，生成待生成页面。

第四方面，本发明还提供一种页面生成装置，所述装置包括：

页面生成请求接收模块，用于接收客户端发送的页面生成请求；

动态组件配置信息生成模块，用于根据所述页面生成请求，基于预设的组件数据库，生成待生成页面对应的动态组件配置信息；

动态组件配置信息发送模块，用于基于所述动态组件配置信息确定相应的待生成页面数据，并将所述动态组件配置信息和所述待生成页面数据发送至所述客户端。

第五方面，本发明还提供一种页面生成系统，所述系统包括：客户端和服务器；其中，所述客户端用于实现如上所述的在客户端执行的页面生成方法；所述服务器用于实现如上所述的在服务器执行的页面生成方法。

第六方面，本发明还提供一种电子设备，所述设备包括：

处理器；

存储器，存储有计算机程序，当所述计算机程序被处理器执行时，实现如上所述的任意一种页面生成方法。

第七方面，本发明还提供了一种存储指令的计算机可读存储介质，其中，当所述指令被至少一个计算装置运行时，促使所述至少一个计算装置执行如上所述的任意一种页面生成方法。

本发明的实施例的有益效果在于，提供了一种页面生成方法、装置、系统、电子设备和存储介质，该方法包括：客户端响应于用户的触发操作，向服务器发送页面生成请求，以使服务器根据页面生成请求，基于预设的组件数据库，生成待生成页面对应的动态组件配置信息，基于动态组件配置信息确定相应的待生成页面数据，并将动态组件配置信息和待生成页面数据发送至客户端；客户端根据接收的动态组件配置信息确定待生成页面中的各组件以及各组件对应的显示顺序；根据显示顺序和待生成页面数据，对各组件进行渲染，生成待生成页面。本发明的实施例提供的页面生成方法根据客户端发送的页面生成请求，在服务器中直接生成动态组件配置信息，以此确定客户端中待生成页面中的组件及组件的配置信息，并发送给客户端，即可以根据不同的页面生成请求生成相对应的动态组件配置信息，可以实现直接在客户端根据生成的动态组件配置信息进行渲染生成页面，从而提高了业务平台的开发效率。

附图说明

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

图1为本发明实施例页面生成方法的一种流程示意图；

图2为本发明实施例页面生成方法的一种流程示意图；

图3为本发明实施例页面生成装置的逻辑功能结构示意图；

图4为本发明实施例页面生成装置的逻辑功能结构示意图；

图5为本发明实施例页面生成后的界面展示效果示意图；

图6为本发明实施例页面生成后的界面展示效果示意图；

图7为本发明实施例的配置界面效果示意图；

图8为本发明实施例配置界面效果示意图；

图9为本发明实施例电子设备的结构示意图；

图10为本发明实施例计算机存储介质的结构示意图;

图11为本发明实施例页面生成系统的结构示意图。

具体实施方式

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

现在的业务处理系统越来越庞大与复杂，随着项目交付进度压力的增大，亟需提高开发平台与框架的开发效率，例如市场上的零/低代码快速开发平台，市场上也有许多开源框架。现有的开源框架与开发平台大体都是以下2种方法生成：

第1种，采用“图形化配置与向导生成源代码”：即通过在线拖拽配置生成前端代码，由表结构生成前端超文本标记语言(hyper text markup language，简称html）与javascript（简称js）语言，其中js是一种脚本语言，同时生成后端的逻辑代码框架，把新增、修改、删除等逻辑代码生成好，然后再修改编译发布，但如果增加、修改或删除一个字段，必须重新生成或修改代码，重新编译发布。

第2种，现有的各组件，例如表单、表格、树型、查询框等模板与组件配置是独立分开的，各自是不同的配置模板，修改一个字段配置需要修改所有的组件。

以上2种方法的开发效率较低，为了提高现有业务平台的开发效率，本发明实施例提出了一种页面生成方法，可以应用在金融业管理信息系统、银行管理系统中等，以下对本发明实施例的方案进行详细描述。

图1为本发明实施例页面生成方法的一种流程示意图。如图1所示，该页面生成方法应用于客户端，主要包括以下步骤：

步骤S101，响应于用户的触发操作，向服务器发送页面生成请求，以使该服务器根据页面生成请求，基于预设的组件数据库，生成待生成页面对应的动态组件配置信息，基于动态组件配置信息确定相应的待生成页面数据，并将动态组件配置信息和待生成页面数据发送至客户端；

当用户请求对业务开发平台进行操作处理时，会向客户端发送触发操作，例如请求对某一个组件的字段进行修改，添加某个组件的字段或者删除某个组件的字段等，其可以是但不限于用户的点击操作、滑动操作和触摸操作等，示例性地，触发操作可以是点击某个页面中的图标、链接、下拉菜单等，客户端响应于用户的触发操作，会生成页面生成请求，以根据用户触发操作进行处理，生成配置好的页面，展示给用户。其中，预设的组件数据库中可以包括表单、表格、树型、查询框、卡片、实体值对象（value object，简称VO）等组件中的任意多个或全部的组件。

该动态组件配置信息为在服务器的内存中创建的组件配置信息，在实际应用中，传统的客户端和服务端是分离的架构，客户端的html与js代码是放在web服务器上的，而逻辑处理是在服务端(例如SpringBoot Java服务器)上的，当需要添加某一字段时，其前端代码是发布在web服务器上，但web服务器上只能存放静态html与js代码，而客户端的运行必须是html与js代码，并且是动态变化的，因此在本发明实施例中的动态组件配置信息在服务器的内存中动态生成的。因此，在服务器端完成动态生成html与js代码，并通过服务器端连接预设的组件数据库，进一步读取组件的模板配置表，然后拼接字符串，生成动态的html与js代码，然后由服务器返回到客户端，并在客户端执行。

步骤S102，根据接收的动态组件配置信息确定待生成页面中的各组件以及各组件对应的显示顺序；

步骤S103，根据显示顺序和待生成页面数据，对各组件进行渲染，生成待生成页面。

本发明实施例提供了一种页面生成方法，该方法包括：客户端响应于用户的触发操作，向服务器发送页面生成请求，以使服务器根据页面生成请求，基于预设的组件数据库，生成待生成页面对应的动态组件配置信息，基于动态组件配置信息确定相应的待生成页面数据，并将动态组件配置信息和待生成页面数据发送至客户端；客户端根据接收的动态组件配置信息确定待生成页面中的各组件以及各组件对应的显示顺序；根据显示顺序和待生成页面数据，对各组件进行渲染，生成待生成页面。本发明的实施例提供的页面生成方法根据客户端发送的页面生成请求，在服务器中直接生成动态组件配置信息，以此确定客户端中待生成页面中的组件及组件的配置信息，并发送给客户端，即可以根据不同的页面生成请求生成相对应的动态组件配置信息，可以实现直接在客户端根据生成的动态组件配置信息进行渲染生成页面，从而提高了业务平台的开发效率。

在一实施例中，S102中根据接收的动态组件配置信息确定待生成页面中的各组件以及各组件对应的显示顺序，可以包括：

根据接收的动态组件配置信息中的各组件标识，从预设的组件数据库中确定与各组件标识对应的组件；

根据动态组件配置信息中的各组件标识对应的排列顺序，确定各组件对应的显示顺序。

在一实施例中，S103中根据显示顺序和待生成页面数据，对各组件进行渲染，生成待生成页面，可以包括：

根据各组件对应的显示顺序，确定每个组件对应的显示位置；

根据每个组件对应的显示位置和待生成页面数据中的每个组件对应的待生成数据，对每个组件进行渲染，生成待生成页面。

在一实施例中，根据动态组件配置信息中的各组件标识对应的排列顺序，确定各组件对应的显示顺序，可以包括：

将动态组件配置信息中的各组件标识对应的排列顺序，确定为各组件对应的纵向显示顺序，以使各组件在显示界面中纵向显示。

图2为本发明实施例页面生成方法的流程示意图。如图2所示，该页面生成方法应用于服务器，主要包括以下步骤：

步骤S201，接收客户端发送的页面生成请求；

步骤S202，根据页面生成请求，基于预设的组件数据库，生成待生成页面对应的动态组件配置信息；

步骤S203，基于动态组件配置信息确定相应的待生成页面数据，并将动态组件配置信息和待生成页面数据发送至客户端。

在一实施例中，S202根据页面生成请求，基于预设的组件数据库，生成待生成页面对应的动态组件配置信息，可以包括：

根据页面生成请求确定待生成页面中包括的组件信息；

基于预设的组件数据库更新待生成页面中包括的组件信息；

将更新后的待生成页面中包括的组件信息确定为待生成页面对应的动态组件配置信息。

在一实施例中，基于预设的组件数据库更新待生成页面中包括的组件配置信息，可以包括：

从预设的组件数据库中获取与待生成页面中包括的组件信息的配置信息；

根据页面生成请求更新待生成页面中包括的组件配置信息，其中，页面生成请求包括请求更新的组件信息的组件标识。

在一实施例中，基于所述动态组件配置信息确定相应的待生成页面数据，并将动态组件配置信息和待生成页面数据发送至客户端，可以包括：

基于动态组件配置信息确定各组件的组件标识；

根据各组件的组件标识从预设的组件数据库中获取待生成页面数据，并将动态组件配置信息和待生成页面数据发送至客户端。

基于与图1所示的页面生成方法相同的发明构思，本发明实施例还提供了一种页面生成装置，如下面实施例所述。由于该装置解决问题的原理与图1中的页面生成方法相似，因此该装置的实施可以参见图1的页面生成方法的实施，重复之处不再赘述。

其结构如图3所示，该装置30包括：页面生成请求发送模块31、组件确定模块32、页面生成模块33；其中，

页面生成请求发送模块31，用于响应于用户的触发操作，向服务器发送页面生成请求，以使服务器根据页面生成请求，基于预设的组件数据库，生成待生成页面对应的动态组件配置信息，基于动态组件配置信息确定相应的待生成页面数据，并将动态组件配置信息和待生成页面数据发送至客户端；

组件确定模块32，用于根据接收的动态组件配置信息确定待生成页面中的各组件以及各组件对应的显示顺序；

页面生成模块33，用于根据显示顺序和待生成页面数据，对各组件进行渲染，生成待生成页面。

基于与图2所示的页面生成方法相同的发明构思，本发明实施例还提供了一种页面生成装置，如下面实施例所述。由于该装置解决问题的原理与图2中页面生成方法相似，因此该装置的实施可以参见图4的页面生成方法的实施，重复之处不再赘述。

其结构如图4所示，该装置40包括：页面生成请求接收模块41、动态组件配置信息生成模块42、动态组件配置信息发送模块43；其中，

页面生成请求接收模块41，用于接收客户端发送的页面生成请求；

动态组件配置信息生成模块42，用于根据页面生成请求，基于预设的组件数据库，生成待生成页面对应的动态组件配置信息；

动态组件配置信息发送模块43，用于基于动态组件配置信息确定相应的待生成页面数据，并将动态组件配置信息和待生成页面数据发送至客户端。

下面通过一具体实施例对本发明实施例提供的页面生成方法及装置进行详细说明。

步骤1，客户端响应于用户的触发操作，向服务器发送页面生成请求；

当用户请求对业务开发平台进行操作处理时，会向客户端发送触发操作，例如请求对某一个组件的字段进行修改，添加某个组件的字段或者删除某个组件的字段等，其可以是但不限于用户的点击操作、滑动操作和触摸操作等，示例性地，触发操作可以是点击某个页面中的图标、链接、下拉菜单等，客户端响应于用户的触发操作，会生成页面生成请求，以根据用户触发操作进行处理，生成配置好的页面，展示给用户。

客户端将该页面生成请求发送给服务器，由服务器根据页面生成请求进行处理。

步骤2，服务器接收客户端发送的页面生成请求，根据页面生成请求，基于预设的组件数据库，生成待生成页面对应的动态组件配置信息，基于动态组件配置信息确定相应的待生成页面数据，并将动态组件配置信息和待生成页面数据发送至客户端；

服务器接收客户端发送的页面生成请求，并根据页面生成请求和预设的组件数据库，生成待生成页面对应的动态组件配置信息。其中，预设的组件数据库中包括表单、表格、树、查询框、卡片、实体值对象（value object，简称VO）等中的全部或任意多个组件。

示例性的，可以根据页面生成请求和预设的组件数据库包括的各组件的配置信息，生成待生成页面对应的动态组件配置信息，其中，预设的组件数据库包括的各组件的配置信息如表1所示，表1为各组件主模板的配置项和每个配置项对应的含义：

表1 各组件的配置项和每个配置项对应的含义

如表1中所示，示例性的，在进行表格配置时，配置项为是否有查询框，对应的含义为表格显示时，上面带不带查询条件框；在进行树配置时，配置项为是否自动查询，对应的含义为树创建后是否立即查询数据，针对不同组件的不同配置项及其含义在此不一一赘述，具体参照表1。

在实际应用中，各组件还可能包括子组件，用户也可以对子组件中的配置项请求修改，各子组件的配置项及其含义如下表2所示：

表2 各子组件的配置项和每个配置项对应的含义

如表2中所示，示例性的，在进行表格配置时，配置项为列表是否分组时，对应的含义为表格中是否参与分组；在进行查询配置时，配置项为查询框是否换行，对应的含义为在查询框中是否换行显示，针对不同子组件的不同配置项及其含义在此不一一赘述，具体参照表2。

表1和表2中共计105个配置项，这105个配置项可以合并在一个模板配置表与配置界面中，通过动态组件配置信息可以实现一次性的、同时将各组件或子组件中的配置项进行配置生成并发送给客户端（即前端），将上述配置项合并后，会降低配置工作量，从而提高开发效率。示例性的，该配置方法可以使得列表与卡片进行转换非常方便，比如选中表格一条记录进行修改，因为是同一个模板，所以字段一样，就能自动实现修改功能逻辑的封装，即增删改等常用操作是可以彻底封装的；树与表单数据也可以转换，比如典型的“机构树”维护，左边是树型结构，右边是表单显示，选择左边结点，刷新查询右边表单数据，如果两个是同一个模板，则数据源、表名、主键都一样，就可以封装成一个通用组件。

图5为本发明实施例的一个示例的模板主表的配置界面，从图5中可以看出，把表格/卡片/树/查询框/数据存储的表名与主键字段名，都可以合在一个配置表与配置界面上，在一个组件的模板里配置就可以实现全部字段的配置，而不是在多个地方进行配置，提高了开发效率。

图6为本发明实施例的一个示例的模板子表的配置界面，从图6中模板子表(字段)也可以看出，该字段在卡片/表格/查询框中的显示与逻辑配置，也是合并在一个配置表与配置界面上的。而“是否参与保存”配置项是第5种实体VO配置项，即在后端保存数据库时才参与计算。

在一实施例中，服务器根据页面生成请求，基于预设的组件数据库，生成待生成页面对应的动态组件配置信息，可以包括；

步骤S301，根据页面生成请求确定待生成页面中包括的组件信息；

步骤S302，基于预设的组件数据库更新待生成页面中包括的组件信息；

步骤S303，将更新后的待生成页面中包括的组件信息确定为待生成页面对应的动态组件配置信息。

服务器根据页面生成请求确定待生成页面中包括的组件信息，例如，当用户要求生成的页面中包括多个组件时，客户端响应于用户的触发操作，生成的页面生成请求中还可以包括用户的操作指令，通过页面生成请求和该操作指令进一步处理待生成页面中包括的组件信息，通过预设的组件数据库，更新与页面生成请求对应的组件信息，并且将更新后的组件信息确定为待生成页面对应的动态组件配置信息。

该动态组件配置信息为在服务器的内存中创建的组件配置信息，在实际应用中，传统的客户端和服务端是分离的架构，客户端的html与js代码是放在web服务器上的，而逻辑处理是在服务端(例如SpringBoot Java服务器)上的，当需要添加某一字段时的前端代码是发布在web服务器上，但web服务器上只能存放静态html与js代码。而客户端的运行必须是html与js代码，并且是动态变化的，因此需要在服务器的内存中动态生成的。因此，在服务器端完成动态生成html与js代码，并通过服务器端连接预设的组件数据库，进一步读取组件的模板配置表，然后拼接字符串，生成动态的html与js代码，然后由服务器返回到客户端，并在客户端执行。

具体的，服务器基于动态组件配置信息确定相应的待生成页面数据，并将动态组件配置信息和待生成页面数据发送至客户端，服务器得到动态组件配置信息以后，可以进一步确定待生成页面数据，例如表格/表单/树/查询框等，在客户端接收到创建表格/表单/树/查询框的指令时，服务端生成动态组件配置信息，即生成对应于客户端可实际执行的html与js代码，并将该html与js代码发送给客户端，即动态组件配置信息发送给客户端。需要说明的是，本发明实施例的系统也是客户端和服务端分离的架构，只是web服务器上存放的是平台的html与js代码，而并没有组件更改的js代码。

在实际应用中，通常在开发系统上创建一个功能点，需要先写源代码，随之伴有该源代码的源代码文件，示例性的，比如客户端是html代码与js代码，而服务器端是java文件，在运行源代码时，客户端的源代码文件不需要编译，服务器端的java文件需要编译成class文件实际运行。当用户的业务请求为 “人员维护”时，人员表有：工号、姓名、性别、出生日期、联系电话、简历等字段，触发操作为新增、修改、删除等，通常在客户端写一个userManager.html与userManager.js，服务器端写一个SpringBoot Controller类、SpringService类，再写一个MyBatis的实体VO类，MyBatis映射的XML文件，以及一个数据访问对象(Data Access Object，简称DAO)，总共需要写7个源代码文件。在这7个源代码文件中，可以直接实现人员表的各个字段的处理，比如在html中写上人员工号/姓名/性别/出生日期/联系电话/简历等表单字段，在js中也是直接处理这些字段。

通常的开发平台框架是将这些代码通过一个工具软件包生成，先在数据库中把“人员表”建好，然后连接数据库，取得各个字段的名称与类型，然后创建上面的7个源代码文件，即数据库中人员表有“工号/姓名/性别/出生日期/联系电话/简历”这6个字段，创建一个html文件，在html文件中的表单组件中生成这6个字段，同样在js与java代码中也生成对应的6个字段，同时生成新增、修改、删除等触发指令，也就是说，根据数据库表结构，并使用工具软件包生成源代码，只是简化了生成字段的过程，并没有提高开发效率。在用户的需求变更时，还是需要修改各个源代码文件，比如人员表中加了1个字段“学历”，则需要修改源代码，而且是要改各个组件中的源代码，然后重新编译与发布。

在本发明实施例中，在服务器接收到客户端发送的页面生成请求时，在系统实际运行时，由服务器在其内存中生成动态组件配置信息，示例性的，可以为上面所述的7个源代码文件，即源代码文件存在于服务器的内存变量中，该动态组件配置信息只在服务器接收到页面生成请求时才生成，在未接收到页面生成请求时，该动态组件配置信息并不存在，并且该动态组件配置信息生成后临时存储在服务器的内存中，并不存储在磁盘的实际文件中，而在内存中只是一个内存变量。该动态组件配置信息是随着页面生成请求动态变化的，基于预设的组件数据库中的组件配置数据，生成不同的动态组件配置信息，页面生成请求不同，则生成的动态组件配置信息也不同。示例性的，如果人员表中有5个字段，就生成5个字段的动态组件配置信息，如果人员表中有6个字段，就生成6个字段的动态组件配置信息，当接收到不同的页面生成请求，动态组件配置信息也随之变化。

本发明实施例中提供的这种在服务器内存中动态组件配置信息的方法，可以实现“在线配置、立即生效”的结果，即初始化状态也不需要创建组件中包括字段的源代码文件，在用户的需求发生变更时，比如人员表中加1个“学历”字段，可以直接在服务器中进行配置，生成动态组件配置信息，在服务器（后端）直接进行动态配置，再发送给前端，只需要进行一次配置，这会极大的节省配置时间，提高页面开发效率并且不需要在客户端生成组件配置信息，因此也就不需要每次都重新编译与发布，从而提高了平台的开发效率。

步骤3，客户端根据接收的动态组件配置信息确定待生成页面中的各组件以及各组件对应的显示顺序；

客户端接收服务器发送的动态组件配置信息，基于动态组件配置信息确定待生成页面中的各组件，例如表格/表单/树/查询框/卡片等，由于动态组件配置信息中包括了对应于用户触发操作的组件配置信息，所以在显示各组件时，会显示各组件更改后的信息。在生成显示页面后，需要根据动态组件配置信息确定各组件对应的显示顺序，例如先显示表格，再显示卡片，最后显示查询框等，各组件的显示顺序也是基于用户的触发操作确定的，可以被包括在页面生成请求中。

在一实施例中，根据接收的动态组件配置信息确定待生成页面中的各组件以及各组件对应的显示顺序，可以包括：根据接收的动态组件配置信息中的各组件标识，从预设的组件数据库中确定与各组件标识对应的组件；根据动态组件配置信息中的各组件标识对应的排列顺序，确定各组件对应的显示顺序。各组件对应的显示顺序可以是每个组件在显示页面中的排列顺序。显示顺序可以包括纵向显示顺序（如从上到下的顺序）和横向显示顺序（如从左到右的顺序）。其中，组件标识可以基于组件的功能或类型等方式预先进行设置，以便区分不同的组件。示例性地，若某个组件用于信息查询，则该组件可以作为查询框；若某个组件用于展示母公司和子公司的结构树关系，则该组件可以作为树型图。

步骤4，客户端根据显示顺序和待生成页面数据，对各组件进行渲染，生成待生成页面。

具体的，客户端根据显示顺序和服务器发送的待生成页面数据，对各组件进行渲染处理，生成页面并显示在客户端上。对于每个组件而言，根据该组件对应的待生成页面数据，在该组件对应的显示位置处进行渲染，使得该组件可以在该显示位置处显示相应的页面数据，比如该组件为表格，待生成的页面数据为表格的行数和列数，以及每个格子里的显示数据，显示位置为页面顶端，从而对在该组件进行渲染后，可以在页面顶端显示出该表格的具体内容。在对每个组件进行渲染后，可以生成待生成页面，从而在显示界面中显示该页面。由于，在服务器（即后端）直接进行动态配置，再发送给前端，只需要进行一次配置，将动态组件配置信息一次性发送给客户端（即前端），所以客户端也只需要进行一次渲染即将组件配置完毕，生成待生成页面。

在一实施例中，在服务器的内存中生成动态组件配置信息，可以在客户端将批量的页面生成请求任务进行一次处理，即在客户端接收到创建表格/表单/树等组件的请求时，可以将多次的页面生成请求暂存在客户端的缓存中，当页面生成请求任务积累到一定程度时，把所有页面生成请求任务进行打包，形成一个总任务包，在服务器接收到总任务包时，先拆解总任务包，得到各个具体的页面生成请求任务，然后采用多线程并发机制，并行去调用原来的各个组件的创建函数，得到所有结果后再合并成一个总的“动态组件配置信息”返回客户端，客户端接收到后再拆分，得到各个组件的动态组件配置信息，生成页面。服务器可以实现将多个页面生成请求接收一次，再进行处理得到最终的生成页面。

在得到生成待生成页面以后，在最终页面上，可以通过用户的点击操作，例如点击鼠标右键，点击某个表单或字段，弹出“右键功能”，可以直接进入配置界面，而不需要切换到后端管理控制台进行配置。如下面的表3所示，表3示出了右键弹出菜单及其功能说明：

表3 右键弹出菜单及其功能说明

菜单功能	说明	适用组件
			查看模板	查看前端整个模板配置信息，有的配置从数据库加载后会二次处理	表格,表单卡片,树,查询框
查看模板项	查看前端模板中某个字段的配置信息，有的配置从数据库加载后会二次处理	表格列，表单字段，查询框字段
			配置模板	直接进入配置整个模板的界面	表格,表单卡片,树,查询框
配置模板项	直接进入配置某个模板字段的界面	表格列，表单字段，查询框字段
			查看状态	查看表格查询数据的SQL，分页SQL，本次前端线程请求加载过程的监控日志	表格
查看UI数据	查看表格中某一行,卡片，查询框中的前端数据 即前端Dom中的数据转换成json	表格行记录，卡片，查询框，树结点
			查看DB数据	根据前端数据的主键值，重新查询数据库中的实际数据	表格行记录，卡片，树结点
查看SQL	查看查询框预生成的SQL	查询框

通过右键查看菜单，可以使得从运行界面直接进入到配置界面，会给用户提供非常方便的定位与分析问题的功能。

图7为表格右键效果图，可以在表头上点击右键，弹出菜单，直接进入配置界面，图8为表单卡片右键效果图，可以在表单上点击右键，弹出菜单，直接进入配置界面。

本发明实施例提供了一种页面生成方法、装置、系统、电子设备和存储介质，该方法包括：客户端响应于用户的触发操作，向服务器发送页面生成请求，以使服务器根据页面生成请求，基于预设的组件数据库，生成待生成页面对应的动态组件配置信息，基于动态组件配置信息确定相应的待生成页面数据，并将动态组件配置信息和待生成页面数据发送至客户端；客户端根据接收的动态组件配置信息确定待生成页面中的各组件以及各组件对应的显示顺序；根据显示顺序和待生成页面数据，对各组件进行渲染，生成待生成页面。本发明的实施例提供的页面生成方法根据客户端发送的页面生成请求，在服务器中直接生成动态组件配置信息，以此确定客户端中待生成页面中的组件及组件的配置信息，并发送给客户端，即可以根据不同的页面生成请求生成相对应的动态组件配置信息，可以实现直接在客户端根据生成的动态组件配置信息进行渲染生成页面，从而提高了业务平台的开发效率。

图9是根据本发明实施例提供的用于页面生成的计算机设备的示意图。如图9所示，该设备可以包括处理器901以及存储有计算机程序指令的存储器5902。

具体地，上述处理器901可以包括中央处理器（CPU），或者特定集成电路（Application Specific Integrated Circuit ，ASIC），或者可以被配置成实施本发明实施例的一个或多个集成电路。

存储器902可以包括用于数据或指令的大容量存储器。举例来说而非限制，存储器902可包括硬盘驱动器（Hard Disk Drive，HDD）、软盘驱动器、闪存、光盘、磁光盘、磁带或通用串行总线（Universal Serial Bus，USB）驱动器或者两个或更多个以上这些的组合。在合适的情况下，存储器902可包括可移除或不可移除(或固定)的介质。在特定实施例中，存储器902是非易失性固态存储器。在特定实施例中，存储器902包括只读存储器（ROM）。在合适的情况下，该ROM可以是掩模编程的ROM、可编程ROM（PROM）、可擦除PROM（EPROM）、电可擦除PROM（EEPROM）、电可改写ROM（EAROM）或闪存或者两个或更多个以上这些的组合。

处理器901通过读取并执行存储器902中存储的计算机程序指令，以实现上述实施例中的用于页面生成的方法。

在一个示例中，上述的计算机设备还可包括通信接口903和总线904。其中，如图9所示，处理器901、存储器902、通信接口903通过总线904连接并完成相互间的通信。

通信接口903，主要用于实现本发明实施例中各模块、设备、单元和/或设备之间的通信。

总线904包括硬件、软件或两者，用于将上述部件彼此耦接在一起。举例来说，总线可包括加速图形端口（AGP）或其他图形总线、增强工业标准架构（EISA）总线、前端总线（FSB）、超传输（HT）互连、工业标准架构（ISA）总线、无限带宽互连、低引脚数（LPC）总线、存储器总线、微信道架构（MCA）总线、外围组件互连（PCI）总线、PCI-Express（PCI-X）总线、串行高级技术附件（SATA）总线、视频电子标准协会局部（VLB）总线或其他合适的总线或者两个或更多个以上这些的组合。在合适的情况下，总线X10可包括一个或多个总线。尽管本发明实施例描述和示出了特定的总线，但本发明考虑任何合适的总线或互连。

该计算机设备可以执行本发明实施例中的用于页面生成的方法，从而实现结合图1和图2描述的用于页面生成方法及装置。

此外，参照图1所描述的用于页面生成方法可通过记录在计算机可读存储介质上的程序（或指令）来实现。例如，如图10所示，根据本发明的示例性实施例，可提供存储指令的计算机可读存储介质1001，其中，当所述指令被至少一个计算装置运行时，促使所述至少一个计算装置执行用于页面生成的方法。

上述计算机可读存储介质1001中的计算机程序可在诸如客户端、主机、代理装置、服务器等计算机设备中部署的环境中运行，应注意，计算机程序还可用于执行除了上述步骤以外的附加步骤或者在执行上述步骤时执行更为具体的处理，这些附加步骤和进一步处理的内容已经在参照图1进行相关方法的描述过程中提及，因此这里为了避免重复将不再进行赘述。

本发明实施例还提供了一种页面生成系统，如图11所示，包括：客户端120和服务器140；服务器140通过网络与客户端120进行连接，其中，客户端120用于实现如图1中的页面生成方法，包括但不限于手机、笔记本电脑、台式电脑等；服务器140用于实现如图2中的页面生成方法，可以由一台或多台服务器组成。

本发明是参照根据本发明实施例的方法、设备（系统）、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。

这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。

这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上，使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。

本发明中应用了具体实施例对本发明的原理及实施方式进行了阐述，以上实施例的说明只是用于帮助理解本发明的方法及其核心思想；同时，对于本领域的一般技术人员，依据本发明的思想，在具体实施方式及应用范围上均会有改变之处，综上所述，本说明书内容不应理解为对本发明的限制。

Claims (10)

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

响应于用户的触发操作，向服务器发送页面生成请求，以使所述服务器根据所述页面生成请求，基于预设的组件数据库，生成待生成页面对应的动态组件配置信息，基于所述动态组件配置信息确定相应的待生成页面数据，并将所述动态组件配置信息和所述待生成页面数据发送至所述客户端；

根据接收的所述动态组件配置信息确定待生成页面中的各组件以及各所述组件对应的显示顺序；

根据所述显示顺序和所述待生成页面数据，对各所述组件进行渲染，生成待生成页面。

2.根据权利要求1所述的方法，其特征在于，所述根据接收的所述动态组件配置信息确定待生成页面中的各组件以及各所述组件对应的显示顺序，包括：

根据接收的所述动态组件配置信息中的各组件标识，从所述预设的组件数据库中确定与所述各组件标识对应的组件；

根据所述动态组件配置信息中的各组件标识对应的排列顺序，确定各所述组件对应的显示顺序。

3.根据权利要求1所述的方法，其特征在于，所述根据所述显示顺序和所述待生成页面数据，对各所述组件进行渲染，生成待生成页面，包括：

根据各所述组件对应的显示顺序，确定每个所述组件对应的显示位置；

根据每个所述组件对应的显示位置和所述待生成页面数据中的每个所述组件对应的待生成数据，对每个所述组件进行渲染，生成所述待生成页面。

4.根据权利要求2所述的方法，其特征在于，所述根据所述动态组件配置信息中的各组件标识对应的排列顺序，确定各所述组件对应的显示顺序，包括：

将所述动态组件配置信息中的各组件标识对应的排列顺序，确定为各所述组件对应的纵向显示顺序，以使各所述组件在显示界面中纵向显示。

5.一种页面生成方法，其特征在于，应用于服务器，所述方法包括：

接收客户端发送的页面生成请求；

根据所述页面生成请求，基于预设的组件数据库，生成待生成页面对应的动态组件配置信息；

基于所述动态组件配置信息确定相应的待生成页面数据，并将所述动态组件配置信息和所述待生成页面数据发送至所述客户端。

6.根据权利要求5所述的方法，其特征在于，所述根据所述页面生成请求，基于预设的组件数据库，生成待生成页面对应的动态组件配置信息，包括：

根据所述页面生成请求确定所述待生成页面中包括的组件信息；

基于预设的组件数据库更新所述待生成页面中包括的组件配置信息；

将更新后的所述待生成页面中包括的组件配置信息确定为所述待生成页面对应的动态组件配置信息。

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

页面生成请求发送模块，用于响应于用户的触发操作，向服务器发送页面生成请求，以使所述服务器根据所述页面生成请求，基于预设的组件数据库，生成待生成页面对应的动态组件配置信息，基于所述动态组件配置信息确定相应的待生成页面数据，并将所述动态组件配置信息和所述待生成页面数据发送至客户端；

组件确定模块，用于根据接收的所述动态组件配置信息确定待生成页面中的各组件以及各所述组件对应的显示顺序；

页面生成模块，用于根据所述显示顺序和所述待生成页面数据，对各所述组件进行渲染，生成待生成页面。

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

页面生成请求接收模块，用于接收客户端发送的页面生成请求；

动态组件配置信息生成模块，用于根据所述页面生成请求，基于预设的组件数据库，生成待生成页面对应的动态组件配置信息；

动态组件配置信息发送模块，用于基于所述动态组件配置信息确定相应的待生成页面数据，并将所述动态组件配置信息和所述待生成页面数据发送至所述客户端。

9.一种页面生成系统，其特征在于，所述系统包括：客户端和服务器；其中，所述客户端用于实现如权利要求1-4中任一所述的页面生成方法；所述服务器用于实现如权利要求5-6任一所述的页面生成方法。

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

处理器；

存储器，存储有计算机程序，当所述计算机程序被处理器执行时，实现如权利要求1-6中的任一项所述的页面生成方法。

Images