CN111045655B - 一种页面渲染的方法、装置、渲染服务器和存储介质 - Google Patents

Abstract

本发明实施例公开了一种页面渲染的方法、装置、渲染服务器和存储介质。其中，该方法包括：根据配置平台上面向待渲染页面选择的组件标识，从组件库中加载对应的目标组件；根据配置平台上对目标组件的配置声明，为目标组件配置对应的页面渲染属性，以生成待渲染页面的页面项目实例；如果接收到待渲染页面的访问请求，则在待渲染页面中运行页面项目实例，以渲染该待渲染页面。本发明实施例提供的技术方案，无需多端针对每一待渲染页面的渲染要求均进行组件配置的协同处理和重新开发定制相应的组件，提高了已有组件的利用率，且实现配置平台上已有组件的多样化定制，同时通过配置平台上已有组件的加载和渲染配置，提高了页面渲染的灵活性。

Description

一种页面渲染的方法、装置、渲染服务器和存储介质

技术领域

本发明实施例涉及互联网页面显示技术领域，尤其涉及一种页面渲染的方法、装置、渲染服务器和存储介质。

背景技术

目前，在互联网中访问某一互联网页面时，通常会在该互联网页面中渲染对应的页面项目来实现页面的多样化显示，该页面项目中集成了具备各类显示功能的组件，而越来越多的前端工程师会采用组件化或模块化的方式来开发互联网页面对应的页面项目。

现有技术中针对每一互联网页面的多样化显示需求会分别为各个互联网页面开发对应的页面项目，此时在开发每一页面项目时，如图1所示，首先需要设计端分析页面的多样化显示需求设计出包含相应组件的页面初稿，由产品运营端配置页面初稿中各个组件之间的业务执行逻辑，并由开发端将组件逻辑配置后的页面初稿转化为相应的页面业务代码，进一步由设计端判断页面业务代码执行后的页面效果是否符合设计要求，由开发端根据符合要求的页面业务代码生成对应的页面项目并由测试端进行项目测试，保证页面项目的准确性。

此时，对于每一互联网页面下的页面项目，均需要多端分析该互联网页面的多样化显示需求进行组件配置的协同处理，使得协作流程较为复杂，而且对于每一互联网页面下页面项目的开发，都会重新设计定制该页面项目下需要的各个组件，极大降低了已有组件的利用率。

发明内容

本发明实施例提供了一种页面渲染的方法、装置、渲染服务器和存储介质，实现配置平台上已有组件的多样化定制，提高页面渲染的灵活性。

第一方面，本发明实施例提供了一种页面渲染的方法，该方法包括：

根据配置平台上面向待渲染页面选择的组件标识，从组件库中加载对应的目标组件；

根据所述配置平台上对所述目标组件的配置声明，为所述目标组件配置对应的页面渲染属性，以生成所述待渲染页面的页面项目实例；

如果接收到所述待渲染页面的访问请求，则在所述待渲染页面中运行所述页面项目实例，以渲染所述待渲染页面。

第二方面，本发明实施例提供了一种页面渲染的装置，该装置包括：

组件加载模块，用于根据配置平台上面向待渲染页面选择的组件标识，从组件库中加载对应的目标组件；

页面项目生成模块，用于根据所述配置平台上对所述目标组件的配置声明，为所述目标组件配置对应的页面渲染属性，以生成所述待渲染页面的页面项目实例；

页面渲染模块，用于如果接收到所述待渲染页面的访问请求，则在所述待渲染页面中运行所述页面项目实例，以渲染所述待渲染页面。

第三方面，本发明实施例提供了一种渲染服务器，该渲染服务器包括：

一个或多个处理器；

存储装置，用于存储一个或多个程序；

当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现本发明任意实施例所述的页面渲染的方法。

第四方面，本发明实施例提供了一种页面渲染系统，该系统包括：本发明第三方面中所述的渲染服务器以及与所述渲染服务器通信连接的线上服务器；

所述线上服务器在接收到待渲染页面的访问请求时，按照所述访问请求中携带的项目标识，从所述渲染服务器在所述待渲染页面指定的配置数据库中加载对应页面项目实例中各所述目标组件的静态资源地址，并在所述待渲染页面中渲染各所述目标组件的静态配置属性和页面渲染属性；或者，

所述线上服务器在接收到所述待渲染页面在对应页面项目实例下的访问请求时，按照对应页面项目实例的线上发布路径在所述待渲染页面中渲染各所述目标组件的静态配置属性和页面渲染属性。

第五方面，本发明实施例提供了一种计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时实现本发明任意实施例所述的页面渲染的方法。

本发明实施例提供的一种页面渲染的方法、装置、渲染服务器和存储介质，在配置平台的组件库中预先注册多种可配置组件，面向任一待渲染页面，均可以根据配置平台上选择的组件标识，从组件库中加载对应的目标组件，并为各目标组件配置对应的页面渲染属性，从而生成该待渲染页面的页面项目实例，此时不同待渲染页面可以加载相同的目标组件而配置不同的页面渲染属性，实现不同的页面渲染效果，无需多端针对每一待渲染页面的渲染要求均进行组件配置的协同处理和重新开发定制相应的组件，提高了已有组件的利用率，且实现配置平台上已有组件的多样化定制，同时通过配置平台上已有组件的加载和渲染配置，提高了页面渲染的灵活性。

附图说明

通过阅读参照以下附图所作的对非限制性实施例所作的详细描述，本发明的其它特征、目的和优点将会变得更明显：

图1为现有技术中页面项目生成过程的原理示意图；

图2A为本发明实施例一提供的一种页面渲染的方法的流程图；

图2B为本发明实施例一提供的页面渲染过程的原理示意图；

图3A为本发明实施例二提供的一种页面渲染的方法的流程图；

图3B为本发明实施例二提供的页面渲染过程的原理示意图；

图4A为本发明实施例三提供的页面渲染的方法的流程图；

图4B为本发明实施例三提供的页面渲染过程的原理示意图；

图5A为本发明实施例四提供的页面渲染的方法的流程图；

图5B为本发明实施例四提供的页面渲染过程的原理示意图；

图6为本发明实施例五提供的一种页面渲染系统的原理示意图；

图7为本发明实施例六提供的一种页面渲染的装置的结构示意图；

图8为本发明实施例七提供的一种渲染服务器的结构示意图。

具体实施方式

下面结合附图和实施例对本发明作进一步的详细说明。可以理解的是，此处所描述的具体实施例仅仅用于解释本发明，而非对本发明的限定。另外还需要说明的是，为了便于描述，附图中仅示出了与本发明相关的部分而非全部结构。此外，在不冲突的情况下，本发明中的实施例及实施例中的特征可以相互组合。

实施例一

图2A为本发明实施例一提供的一种页面渲染的方法的流程图，本实施例可适用于任一种创建网页页面的页面项目并进行渲染的情况中。本实施例提供的一种页面渲染的方法可以由本发明实施例提供的页面渲染的装置来执行，该装置可以通过软件和/或硬件的方式来实现，并集成在执行本方法的渲染服务器中，该渲染服务器可以是配置平台对应的后台服务端。

具体的，参考图2A，该方法可以包括如下步骤：

S110，根据配置平台上面向待渲染页面选择的组件标识，从组件库中加载对应的目标组件。

具体的，在互联网中访问某一互联网页面时，通常会在该互联网页面中渲染对应的页面项目来实现页面的多样化显示，而针对每一互联网页面，均需要根据该互联网页面的渲染要求重新定制并开发对应的组件，此时在大量相似的页面渲染业务中已有组件的利用率较低，因此为了提高已有组件的利用率，避免已有组件在不同页面渲染下的重复定制，本实施例可以预先设置对应的配置平台，用于采用一种约定的协议规范对已有组件进行统一归纳，此时设计端可以在设计出各类功能下的组件后，在集成设计规范上生成相应的组件设计视觉稿输出到该配置平台上，由该配置平台对该视觉稿中的各项组件进行抽离，并由产品运营端设定各项组件的默认配置属性，进而通过读取已开发组件的默认配置属性将各已开发组件对应注册到该配置平台上，本实施例中的默认配置属性可以包括已有组件的组件名称、组件版本号、组件类型、组件缩略图、描述信息、可配置属性说明文件以及静态资源地址等，使得该配置平台的组件库中存储有各项功能下的已有组件，便于配置平台后续在不同页面渲染下对已有组件的重复利用，使得设计端不再关注当前页面渲染的要求，转而关注各个组件的设计规范和可配置元素，产品运营端不再关注视觉稿细节而投入更多精力到组件配置属性的统筹规范下，例如开发出一个可配置的抽奖组件注册到配置平台后，在不同页面渲染下的每一页面活动中均可以在该配置平台中使用预先注册的该抽奖组件，无需针对每一页面活动重新开发定制该抽奖组件，保证配置平台中已有组件的利用率。此时，本实施例中的待渲染页面可以是指互联网中需要展示各类相应活动样式的网页。

在本实施例中，针对任一待渲染页面下的页面项目的创建，工作人员均可以通过登录预先设置的配置平台，在该配置平台的平台界面中根据该待渲染页面的各项渲染要求来拉取对应功能下的目标组件，如图2B所示，渲染服务器可以根据工作人员在配置平台中面向某一待渲染页面下的组件拉取操作，确定配置平台上面向该待渲染页面所选择的各个目标组件的组件标识，进而按照该组件标识在已注册有大量已有组件的组件库中读取各个目标组件的默认配置属性，进而按照对应的默认配置属性在将各个目标组件加载至配置平台的平台界面中，以展示给工作人员各个目标组件之间的统筹数据来源，同时工作人员根据各个目标组件的默认配置属性中的可配置属性说明文件可知该目标组件中的哪项信息是可配置的，哪项信息是不可配置的，以便后续修改目标组件中的页面渲染属性，实现多样化的页面渲染要求；此时只要配置平台中的组件越来越丰富，通过不同组件之间的组合和渲染配置也能够输出大量不同渲染样式下的页面。

S120，根据配置平台上对目标组件的配置声明，为目标组件配置对应的页面渲染属性，以生成待渲染页面的页面项目实例。

具体的，从组件库中加载出配置平台面向待渲染页面选择的目标组件后，工作人员可以在配置平台的平台界面中根据待渲染页面的渲染要求对各个目标组件的默认配置属性中的可配置信息进行修改，进而获取配置平台上对各个目标组件的配置声明，该配置声明用于描述该目标组件在待渲染页面中的表现特性、数据表现以及交互表现，此时本实施例通过解析各个目标组件的配置声明，以修改各个目标组件在不同待渲染页面下的自定义配置，从而为各个目标组件配置符合该待渲染页面的渲染要求的页面渲染属性，在各个目标组件自定义配置完成后，将全部目标组件以及其配置内容对应生成该待渲染页面的页面项目实例，以便后续访问该待渲染页面时，能够直接运行该页面项目实例，在待渲染页面中渲染各项组件。

具体的，本实施例中的配置声明可以至少包括如下信息中的一项：组件通用配置、组件自身配置、组件交互方式和组件数据结构。其中，组件通用配置是指在配置平台中抽离出的大部分已有组件都可能使用的配置定义内容，例如组件字体大小、字体颜色、字体行高、外边距和内边距等通用配置；组件自身配置是指在组件通用配置不足以表现该组件特性时所需要声明的自身独特表现特性的配置定义内容，例如对于图片上传组件支持单张图片上传还是多张图片上传，或者图片播放组件在存在多张图片时是否支持轮播等；组件交互方式是指对外声明自身的交互方式，如是否允许外部组件或挂件调用等，从而实现已有组件的多种交互表现；组件数据结构是指由于已有组件的数据来源多样化，如已有组件中的数据来源可以是外部输入，也可以是其他组件的数据，而声明已有组件对应于各个数据来源的数据结构。

示例性的，若某一待渲染页面中存在单选按钮组件、按钮组件和弹窗组件，要求用户点击按钮组件时会调用弹窗组件，此时配置平台上对该单选按钮组件的配置声明为：组件通用配置为颜色为绿色，组件自身配置为默认开启，文字为“按钮文字”，组件交互方式为提供方法get Radio获取单选按钮参数true或false；配置平台上对该按钮组件的配置声明为：组件通用配置为文字和边框为蓝色，组件自身配置为按钮文字为“ok”，组件交互方式为点击时调用弹窗组件方法show显示组件，组件数据结构为单选按钮参数为true时按钮文字为“ok”，false时按钮文字为“disable”；配置平台上对弹窗组件的配置声明为：组件自身配置为默认不显示，组件交互方式为提供方法show显示弹窗，hide隐藏弹窗，组件数据结构为单选按钮参数为true时弹窗内容为“radio button true”，false时弹窗内容为“radiobutton disable”。

需要说明的是，本实施例针对任一待渲染页面，可以直接按照页面渲染要求修改各个目标组件的自定义配置，从而丰富目标组件在不同待渲染页面下的页面渲染方式，通过不同目标组件之间的组件交互方式和组件数据结构来延展待渲染页面中的数据内容和交互逻辑，通过数据抽离和平台视图表现统筹数据来源，从而满足配置平台中已有组件的表现多样化、基础定制和高级定制，快速实现不同待渲染页面的多样化灵活搭建。

S130，如果接收到待渲染页面的访问请求，则在待渲染页面中运行页面项目实例，以渲染该待渲染页面。

具体的，在生成待渲染页面的页面项目实例后，其他用户在访问该待渲染页面时，可以接收到该待渲染页面的访问请求，该访问请求指定本次访问的待渲染页面的标识，进而在预先生成的各个页面项目实例中查找出该待渲染页面的页面项目实例，并在该待渲染页面中运行该页面项目实例，使得该页面项目实例中各个目标组件按照对应的页面渲染属性显示在该待渲染页面中，从而将待渲染页面渲染出符合预期的渲染效果。

本实施例提供的技术方案，在配置平台的组件库中预先注册多种可配置组件，面向任一待渲染页面，均可以根据配置平台上选择的组件标识，从组件库中加载对应的目标组件，并为各目标组件配置对应的页面渲染属性，从而生成该待渲染页面的页面项目实例，此时不同待渲染页面可以加载相同的目标组件而配置不同的页面渲染属性，实现不同的页面渲染效果，无需多端针对每一待渲染页面的渲染要求均进行组件配置的协同处理和重新开发定制相应的组件，提高了已有组件的利用率，且实现配置平台上已有组件的多样化定制，同时通过配置平台上已有组件的加载和渲染配置，提高了页面渲染的灵活性。

实施例二

图3A为本发明实施例二提供的一种页面渲染的方法的流程图，图3B为本发明实施例二提供的页面渲染过程的原理示意图。本实施例是在上述实施例的基础上进行优化。具体的，如图3A所示，本实施例中对于待渲染页面的页面项目实例的生成和监听过程进行详细的解释说明。

可选的，如图3A所示，本实施例中可以包括如下步骤：

S210，根据配置平台上面向待渲染页面选择的组件标识，从组件库中加载对应的目标组件。

S220，针对每一目标组件，在该目标组件的默认配置属性中查找出该目标组件的配置声明中指定更新的配置内容。

可选的，从组件库中加载出配置平台面向待渲染页面选择的目标组件后，工作人员可以在配置平台的平台界面中根据待渲染页面的渲染要求对各个目标组件的默认配置属性中的可配置信息进行修改，此时针对每一目标组件，可以通过解析该目标组件的配置声明中的组件信息类型等，从组件库中注册的该目标组件的各项默认配置属性中查找该配置声明中指定需要更新的配置内容，后续对该配置内容进行修改，其他配置内容保持不变；进而按照上述相同的步骤在每一目标组件的各项默认配置属性中查找出该目标组件的配置声明所指定更新的配置内容，便于后续按照页面渲染要求对每一目标组件进行自定义配置，实现多样化的页面渲染要求。

S230，将该配置内容更新为配置声明中对应记录的页面渲染属性，以生成待渲染页面的页面项目实例。

本实施例中，在查找出每一目标组件的配置声明中指定更新的配置内容后，直接按照该目标组件的配置声明中对应记录的组件通用配置、组件自身配置、组件交互方式或组件数据结构等自定义配置信息，对应修改该配置声明指定更新的配置内容，从而将各个目标组件配置成符合该待渲染页面的预期渲染要求的页面渲染属性，并在各个目标组件自定义配置完成后，将全部目标组件以及其配置内容对应生成该待渲染页面的页面项目实例，以便后续访问该待渲染页面时，能够直接运行该页面项目实例，在待渲染页面中渲染各项组件。

S240，实时监听页面项目实例中各目标组件的页面渲染属性，并生成页面项目实例的渲染预览图。

可选的，在生成待渲染页面的页面项目实例后，针对待渲染页面所处的不同应用场景可能需要更新该页面项目实例中某些目标组件的配置信息，此时为了避免重新生成该待渲染页面的页面项目实例，本实施例可以采用键值对的方式存储各个目标组件及其自定义配置的页面渲染属性，进而在配置平台中实时监听该页面项目实例中各目标组件的页面渲染属性，判断待渲染页面对于各个目标组件的渲染要求是否发生改变，以便及时对页面项目实例中各目标组件的页面渲染属性进行更新；同时，为了使工作人员了解所生成页面项目实例的运行渲染效果，本实施例在生成待渲染页面的页面项目实例后，还会初始化运行该页面项目实例，并获取对应的运行渲染效果示意图，从而生成该页面项目实例的渲染预览图，便于工作人员实时了解相应的渲染效果。此外，在根据监听结果每次更新页面项目实例中某一目标组件的页面渲染属性后，还会对应更新该页面项目实例的渲染预览图，保证该渲染预览图的准确性。

S250，如果接收到待渲染页面的访问请求，则在待渲染页面中运行页面项目实例，以渲染该待渲染页面。

本实施例提供的技术方案，在配置平台的组件库中预先注册多种可配置组件，面向任一待渲染页面，均可以根据配置平台上选择的组件标识，从组件库中加载对应的目标组件，并将各目标组件的配置声明中指定更新的配置内容修改为该配置声明中对应记录的页面渲染属性，保证目标组件的自定义配置的准确性，进而生成该待渲染页面的页面项目实例，此时不同待渲染页面可以加载相同的目标组件而配置不同的页面渲染属性，实现不同的页面渲染效果，提高了已有组件的利用率，且实现配置平台上已有组件的多样化定制，同时通过配置平台上已有组件的加载和渲染配置，提高了页面渲染的灵活性，此外通过实时监听页面项目实例并生成对应的渲染预览图，保证页面渲染的准确信和渲染预览图的可靠性。

实施例三

图4A为本发明实施例三提供的页面渲染的方法的流程图，图4B为本发明实施例三提供的页面渲染过程的原理示意图。本实施例是在上述实施例的基础上进行优化。具体的，本发明实施例中采用两种方式生成待渲染页面的页面项目实例，进而执行不同的页面渲染过程，本实施例中对于按照待渲染页面的访问请求中的项目标识来实现页面渲染的具体过程进行详细的解释说明。

可选的，如图4A所示，本实施例中可以包括如下步骤：

S310，根据配置平台上面向待渲染页面选择的组件标识，从组件库中加载对应的目标组件。

S320，根据配置平台上对目标组件的配置声明，为目标组件配置对应的页面渲染属性。

S330，按照页面项目实例的项目标识将页面项目实例中每一目标组件的静态资源地址和页面渲染属性存储至待渲染页面指定的配置数据库中。

可选的，由于一个待渲染页面中可能配置多种不同的活动项目，每一活动项目存在对应的页面渲染要求，此时通过配置平台面向待渲染页面在不同活动项目下的页面渲染要求，会选择不同的目标组件进行自定义配置，从而在一个待渲染页面下生成多种页面项目实例，因此待渲染页面上配置有至少一个页面项目实例。为了对各个页面项目实例进行区分，如图4B所示，本实施例在根据配置平台上对目标组件的配置声明，为各个目标组件自定义配置对应符合页面渲染要求的页面渲染属性后，可以按照本次生成的页面项目实例的项目标识，依次将该页面项目实例中每一目标组件的静态资源地址和页面渲染属性按照各个目标组件的组件标识对应存储至该待渲染页面指定的配置数据库中为该项目标识分配的存储区域。

示例性的，按照JS对象简谱(JavaScript Object Notation，JSON)的数据格式在待渲染页面指定的配置数据库中对应存储该页面项目实例的项目标识以及在该项目标识下的每一目标组件的组件标识、自定义配置的页面渲染属性以及静态资源地址中的JS静态资源地址和层叠样式表(Cascading Style Sheets，CSS)静态资源地址等，后续直接采用该页面项目实例的项目标识来查询对应待渲染页面中各目标组件的配置情况。

S340，如果通过线上服务器接收到待渲染页面的访问请求，则按照访问请求中携带的项目标识，在待渲染页面指定的配置数据库中加载对应页面项目实例中各目标组件的静态资源地址。

具体的，外网在访问面向某一页面项目实例的待渲染页面时，如图4B所示，会通过统一的页面入口向用于处理各类页面访问信息的线上服务器发送该待渲染页面的访问请求，此时该访问请求(例如页面访问地址)中携带有待渲染页面的对应页面项目实例的项目标识，线上服务器会将该访问请求转发给渲染服务器来查询该待渲染页面指定选用的页面项目实例，此时渲染服务器会按照访问请求中携带的项目标识，在待渲染页面指定的配置数据库中加载出对应页面项目实例中各目标组件的静态资源地址，并发送给反馈给线上服务器，后续由线上服务器在待渲染页面中渲染对应页面项目实例中的各目标组件，实现多样化的页面渲染。

S350，通过线上服务器根据静态资源地址在待渲染页面中初步渲染各目标组件的静态配置属性，并在待渲染页面中将配置数据库中各目标组件的页面渲染属性绑定至对应的目标组件上。

可选的，通过线上服务器首先根据加载出的静态资源地址获取对应页面项目实例中的各目标组件的静态资源配置属性，进而在待渲染页面中初步渲染各目标组件的静态配置属性，同时渲染服务器向线上服务器发送待渲染页面对应的配置数据库中存储的对应页面项目实例中各目标组件的页面渲染属性，由线上服务器在待渲染页面中初步渲染各目标组件的静态配置属性之后，进一步将该配置数据库中各目标组件的页面渲染属性绑定至对应的目标组件上，从而实现待渲染页面在对应页面项目实例下的多样化页面渲染。

示例性的，通过线上服务器先加载对应页面项目实例中各个目标组件对应的JS静态资源地址和CSS静态资源地址，在渲染该待渲染页面中的文档对象模型(DocumentObject Model，DOM)节点时，可以通过VUE模版中的is属性传入对应页面项目实例中各个目标组件，从而在待渲染页面中渲染出对应的界面组件，再通过v-bind属性绑定各目标组件的页面渲染属性中描述的组件外观特性、交互方法和数据结构到对应目标组件，最终渲染出一套与配置组件相对应的页面视图。

本实施例提供的技术方案，在配置平台的组件库中预先注册多种可配置组件，面向任一待渲染页面，均可以根据配置平台上选择的组件标识，从组件库中加载对应的目标组件，并为各目标组件配置对应的页面渲染属性，从而生成该待渲染页面的页面项目实例，此时不同待渲染页面可以加载相同的目标组件而配置不同的页面渲染属性，实现不同的页面渲染效果，提高了已有组件的利用率，且实现配置平台上已有组件的多样化定制，同时通过配置平台上根据访问请求中携带的项目标识对已有组件进行加载和渲染配置，提高了页面渲染的灵活性。

实施例四

图5A为本发明实施例四提供的页面渲染的方法的流程图，图5B为本发明实施例四提供的页面渲染过程的原理示意图。本实施例是在上述实施例的基础上进行优化。具体的，本发明实施例中采用两种方式生成待渲染页面的页面项目实例，进而执行不同的页面渲染过程，本实施例中对于按照待渲染页面在指定页面项目实例下该页面项目实例的线上发布路径来实现页面渲染的具体过程进行详细的解释说明。

可选的，如图5A所示，本实施例中可以包括如下步骤：

S410，根据配置平台上面向待渲染页面选择的组件标识，从组件库中加载对应的目标组件。

S420，根据配置平台上对目标组件的配置声明，为目标组件配置对应的页面渲染属性。

S430，打包页面项目实例中每一目标组件的静态配置属性和页面渲染属性，生成页面项目实例对应的项目文件并在线上发布。

可选的，在根据配置平台上对目标组件的配置声明，为配置平台选择的各个目标组件配置对应的页面渲染属性后，本实施例可以采用Webpack打包的方式把页面项目实例中每一目标组件的静态配置属性和页面渲染属性统一打包，从而生成页面项目实例对应的项目文件，该项目文件中包括该页面项目实例的页面文件和静态资源文件，该静态资源文件可以包括JS静态文件和CSS静态文件，并将该页面项目实例对应的项目文件发布到线上服务器中，此时线上服务器针对每一页面项目实例对应的项目文件，会设置对应的页面入口，后续外网访问时无需通过统一的页面入口来访问线上服务器中在同一待渲染页面下的不同页面项目实例。

需要说明的是，本实施例中待渲染页面上配置有至少一个页面项目实例。

S440，如果通过线上服务器接收到待渲染页面在页面项目实例下的访问请求，则通过线上服务器按照页面项目实例的线上发布路径在待渲染页面中渲染各目标组件的静态配置属性和页面渲染属性。

可选的，由于待渲染页面在线上发布的不同页面项目实例设置有对应的页面入口，因此如果通过线上服务器接收到待渲染页面在某一页面项目实例下的访问请求，该访问请求(页面访问地址)中会直接携带该页面项目实例的线上发布路径，从而该线上服务器可以直接按照页面项目实例的线上发布路径获取线上发布的该页面项目实例，并在待渲染页面中渲染各目标组件的静态配置属性和页面渲染属性，实现多样化的页面渲染，无须附带任何查询数据即无需依赖渲染服务器上的项目配置数据，因为在页面文件上已预编译对应的JS静态文件、CSS静态文件和项目配置数据，此外还对搜索引擎提供友好的搜索引擎优化(Search Engine Optimization，SEO)内容。

本实施例提供的技术方案，在配置平台的组件库中预先注册多种可配置组件，面向任一待渲染页面，均可以根据配置平台上选择的组件标识，从组件库中加载对应的目标组件，并为各目标组件配置对应的页面渲染属性，从而生成该待渲染页面的页面项目实例，此时不同待渲染页面可以加载相同的目标组件而配置不同的页面渲染属性，实现不同的页面渲染效果，提高了已有组件的利用率，且实现配置平台上已有组件的多样化定制，同时根据页面项目实例的线上发布路径对对应页面项目实例中的已有组件进行加载和渲染配置，提高了页面渲染的灵活性。

实施例五

图6为本发明实施例五提供的一种页面渲染系统的原理示意图。本实施例中主要对页面渲染的整体过程进行详细描述。参照图6，本实施例的页面渲染系统中可以包括渲染服务器50以及与渲染服务器50通信连接的线上服务器51。

其中，渲染服务器50可以执行上述任一实施例提供的页面渲染的方法；线上服务器51在接收到待渲染页面的访问请求时，按照访问请求中携带的项目标识，从渲染服务器50在待渲染页面指定的配置数据库中加载对应页面项目实例中各目标组件的静态资源地址，并在待渲染页面中渲染各目标组件的静态配置属性和页面渲染属性；或者，

线上服务器51在接收到待渲染页面在对应页面项目实例下的访问请求时，按照对应页面项目实例的线上发布路径在待渲染页面中渲染各目标组件的静态配置属性和页面渲染属性。

本实施例提供的技术方案，在配置平台的组件库中预先注册多种可配置组件，面向任一待渲染页面，均可以根据配置平台上选择的组件标识，从组件库中加载对应的目标组件，并为各目标组件配置对应的页面渲染属性，从而生成该待渲染页面的页面项目实例，此时不同待渲染页面可以加载相同的目标组件而配置不同的页面渲染属性，实现不同的页面渲染效果，无需多端针对每一待渲染页面的渲染要求均进行组件配置的协同处理和重新开发定制相应的组件，提高了已有组件的利用率，且实现配置平台上已有组件的多样化定制，同时通过配置平台上已有组件的加载和渲染配置，提高了页面渲染的灵活性。

实施例六

图7为本发明实施例六提供的一种页面渲染的装置的结构示意图，具体的，如图7所示，该装置可以包括：

组件加载模块610，用于根据配置平台上面向待渲染页面选择的组件标识，从组件库中加载对应的目标组件；

页面项目生成模块620，用于根据配置平台上对目标组件的配置声明，为目标组件配置对应的页面渲染属性，以生成待渲染页面的页面项目实例；

页面渲染模块630，用于如果接收到待渲染页面的访问请求，则在待渲染页面中运行页面项目实例，以渲染该待渲染页面。

本实施例提供的技术方案，在配置平台的组件库中预先注册多种可配置组件，面向任一待渲染页面，均可以根据配置平台上选择的组件标识，从组件库中加载对应的目标组件，并为各目标组件配置对应的页面渲染属性，从而生成该待渲染页面的页面项目实例，此时不同待渲染页面可以加载相同的目标组件而配置不同的页面渲染属性，实现不同的页面渲染效果，无需多端针对每一待渲染页面的渲染要求均进行组件配置的协同处理和重新开发定制相应的组件，提高了已有组件的利用率，且实现配置平台上已有组件的多样化定制，同时通过配置平台上已有组件的加载和渲染配置，提高了页面渲染的灵活性。

进一步的，上述页面项目生成模块620，可以具体用于：

针对每一目标组件，在该目标组件的默认配置属性中查找出该目标组件的配置声明中指定更新的配置内容；

将该配置内容更新为配置声明中对应记录的页面渲染属性。

进一步的，上述配置声明可以至少包括如下信息中的一项：组件通用配置、组件自身配置、组件交互方式和组件数据结构。

进一步的，上述页面项目生成模块620，可以具体用于：

按照页面项目实例的项目标识将页面项目实例中每一目标组件的静态资源地址和页面渲染属性存储至待渲染页面指定的配置数据库中。

进一步的，上述页面渲染模块630，可以具体用于：

如果通过线上服务器接收到待渲染页面的访问请求，则按照访问请求中携带的项目标识，在待渲染页面指定的配置数据库中加载对应页面项目实例中各目标组件的静态资源地址；

通过线上服务器根据静态资源地址在待渲染页面中初步渲染各目标组件的静态配置属性，并在待渲染页面中将配置数据库中各目标组件的页面渲染属性绑定至对应的目标组件上。

进一步的，上述页面项目生成模块620，还可以具体用于：

打包页面项目实例中每一目标组件的静态配置属性和页面渲染属性，生成页面项目实例对应的项目文件并在线上发布。

进一步的，上述页面渲染模块630，还可以具体用于：

如果通过线上服务器接收到待渲染页面在页面项目实例下的访问请求，则通过线上服务器按照页面项目实例的线上发布路径在待渲染页面中渲染各目标组件的静态配置属性和页面渲染属性。

进一步的，上述待渲染页面上配置有至少一个页面项目实例。

进一步的，上述页面渲染的装置，还可以包括：

页面项目优化模块，用于实时监听页面项目实例中各目标组件的页面渲染属性，并生成页面项目实例的渲染预览图。

本实施例提供的页面渲染的装置可适用于上述任意实施例提供的页面渲染的方法，具备相应的功能和有益效果。

实施例七

图8为本发明实施例七提供的一种渲染服务器的结构示意图，如图8所示，该渲染服务器包括处理器70、存储装置71和通信装置72；渲染服务器中处理器70的数量可以是一个或多个，图8中以一个处理器70为例；渲染服务器中的处理器70、存储装置71和通信装置72可以通过总线或其他方式连接，图8中以通过总线连接为例。

存储装置71作为一种计算机可读存储介质，可用于存储软件程序、计算机可执行程序以及模块，如本发明任意实施例所述的页面渲染的方法对应的程序指令/模块。处理器70通过运行存储在存储装置71中的软件程序、指令以及模块，从而执行渲染服务器的各种功能应用以及数据处理，即实现上述页面渲染的方法。

存储装置71可主要包括存储程序区和存储数据区，其中，存储程序区可存储操作系统、至少一个功能所需的应用程序；存储数据区可存储根据终端的使用所创建的数据等。此外，存储装置71可以包括高速随机存取存储器，还可以包括非易失性存储器，例如至少一个磁盘存储器件、闪存器件、或其他非易失性固态存储器件。在一些实例中，存储装置71可进一步包括相对于处理器70远程设置的存储器，这些远程存储器可以通过网络连接至渲染服务器。上述网络的实例包括但不限于互联网、企业内部网、局域网、移动通信网及其组合。

通信装置72可用于实现渲染服务器与线上服务器之间的网络连接或者移动数据连接。

本实施例提供的一种渲染服务器可用于执行上述任意实施例提供的页面渲染的方法，具备相应的功能和有益效果。

实施例八

本发明实施例八还提供了一种计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时可实现上述任意实施例中的页面渲染的方法。该方法具体可以包括：

根据配置平台上面向待渲染页面选择的组件标识，从组件库中加载对应的目标组件；

根据配置平台上对目标组件的配置声明，为目标组件配置对应的页面渲染属性，以生成待渲染页面的页面项目实例；

如果接收到待渲染页面的访问请求，则在待渲染页面中运行页面项目实例，以渲染该待渲染页面。

当然,本发明实施例所提供的一种包含计算机可执行指令的存储介质，其计算机可执行指令不限于如上所述的方法操作，还可以执行本发明任意实施例所提供的页面渲染的方法中的相关操作。

通过以上关于实施方式的描述，所属领域的技术人员可以清楚地了解到，本发明可借助软件及必需的通用硬件来实现，当然也可以通过硬件实现，但很多情况下前者是更佳的实施方式。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品可以存储在计算机可读存储介质中，如计算机的软盘、只读存储器(Read-Only Memory,ROM)、随机存取存储器(RandomAccess Memory,RAM)、闪存(FLASH)、硬盘或光盘等，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行本发明各个实施例所述的方法。

值得注意的是，上述页面渲染的装置的实施例中，所包括的各个单元和模块只是按照功能逻辑进行划分的，但并不局限于上述的划分，只要能够实现相应的功能即可；另外，各功能单元的具体名称也只是为了便于相互区分，并不用于限制本发明的保护范围。

以上所述仅为本发明的优选实施例，并不用于限制本发明，对于本领域技术人员而言，本发明可以有各种改动和变化。凡在本发明的精神和原理之内所作的任何修改、等同替换、改进等，均应包含在本发明的保护范围之内。

Claims (12)

1.一种页面渲染的方法，其特征在于，包括：

根据配置平台上面向待渲染页面选择的组件标识，从组件库中加载对应的目标组件；

根据所述配置平台上对所述目标组件的配置声明，为所述目标组件配置对应的页面渲染属性，以生成所述待渲染页面的页面项目实例；

所述生成所述待渲染页面的页面项目实例，包括：

按照所述页面项目实例的项目标识将所述页面项目实例中每一目标组件的静态资源地址和页面渲染属性存储至所述待渲染页面指定的配置数据库中；

如果接收到所述待渲染页面的访问请求，则在所述待渲染页面中运行所述页面项目实例，以渲染所述待渲染页面。

2.根据权利要求1所述的方法，其特征在于，所述根据所述配置平台上对所述目标组件的配置声明，为所述目标组件配置对应的页面渲染属性，包括：

针对每一目标组件，在该目标组件的默认配置属性中查找出该目标组件的配置声明中指定更新的配置内容；

将所述配置内容更新为所述配置声明中对应记录的页面渲染属性。

3.根据权利要求1所述的方法，其特征在于，所述配置声明至少包括如下信息中的一项：组件通用配置、组件自身配置、组件交互方式和组件数据结构。

4.根据权利要求1所述的方法，其特征在于，如果接收到所述待渲染页面的访问请求，则在所述待渲染页面中运行所述页面项目实例，以渲染所述待渲染页面，包括：

如果通过线上服务器接收到所述待渲染页面的访问请求，则按照所述访问请求中携带的项目标识，在所述待渲染页面指定的配置数据库中加载对应页面项目实例中各所述目标组件的静态资源地址；

通过所述线上服务器根据所述静态资源地址在所述待渲染页面中初步渲染各所述目标组件的静态配置属性，并在所述待渲染页面中将所述配置数据库中各所述目标组件的页面渲染属性绑定至对应的目标组件上。

5.根据权利要求1所述的方法，其特征在于，所述生成所述待渲染页面的页面项目实例，包括：

打包所述页面项目实例中每一目标组件的静态配置属性和页面渲染属性，生成所述页面项目实例对应的项目文件并在线上发布。

6.根据权利要求5所述的方法，其特征在于，如果接收到所述待渲染页面的访问请求，则在所述待渲染页面中运行所述页面项目实例，以渲染所述待渲染页面，包括：

如果通过线上服务器接收到所述待渲染页面在所述页面项目实例下的访问请求，则通过所述线上服务器按照所述页面项目实例的线上发布路径在所述待渲染页面中渲染各所述目标组件的静态配置属性和页面渲染属性。

7.根据权利要求1或5所述的方法，其特征在于，所述待渲染页面上配置有至少一个页面项目实例。

8.根据权利要求1-6任一项所述的方法，其特征在于，在生成所述待渲染页面的页面项目实例之后，还包括：

实时监听所述页面项目实例中各目标组件的页面渲染属性，并生成所述页面项目实例的渲染预览图。

9.一种页面渲染的装置，其特征在于，包括：

组件加载模块，用于根据配置平台上面向待渲染页面选择的组件标识，从组件库中加载对应的目标组件；

页面项目生成模块，用于根据所述配置平台上对所述目标组件的配置声明，为所述目标组件配置对应的页面渲染属性，以生成所述待渲染页面的页面项目实例；

所述页面项目生成模块，具体用于：

按照页面项目实例的项目标识将页面项目实例中每一目标组件的静态资源地址和页面渲染属性存储至待渲染页面指定的配置数据库中；

页面渲染模块，用于如果接收到所述待渲染页面的访问请求，则在所述待渲染页面中运行所述页面项目实例，以渲染所述待渲染页面。

10.一种渲染服务器，其特征在于，所述渲染服务器包括：

一个或多个处理器；

存储装置，用于存储一个或多个程序；

当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现如权利要求1-8中任一所述的页面渲染的方法。

11.一种页面渲染系统，其特征在于，包括权利要求10所述的渲染服务器以及与所述渲染服务器通信连接的线上服务器；

所述线上服务器在接收到待渲染页面的访问请求时，按照所述访问请求中携带的项目标识，从所述渲染服务器在所述待渲染页面指定的配置数据库中加载对应页面项目实例中各所述目标组件的静态资源地址，并在所述待渲染页面中渲染各所述目标组件的静态配置属性和页面渲染属性；或者，

所述线上服务器在接收到所述待渲染页面在对应页面项目实例下的访问请求时，按照对应页面项目实例的线上发布路径在所述待渲染页面中渲染各所述目标组件的静态配置属性和页面渲染属性。

12.一种计算机可读存储介质，其上存储有计算机程序，其特征在于，该程序被处理器执行时实现如权利要求1-8中任一所述的页面渲染的方法。

Images