一种页面的生成方法、相关装置及前端页面制造方法及图纸

本发明专利技术公开了一种页面的生成方法、相关装置及前端页面。所述方法包括：将页面对应的页面描述数据以及所述页面使用的至少一个框架对应的框架模板，传送给模板引擎；接收所述模板引擎输出的所述页面在所述至少一个框架下的页面代码；所述页面代码是通过所述页面描述数据和对应的框架模板合成得到的。本发明专利技术大大节省了页面开发和维护时间以及人力成本，并且提高了页面开发效率。

【技术实现步骤摘要】
一种页面的生成方法、相关装置及前端页面
本专利技术涉及计算机程序开发领域，特别涉及一种页面的生成方法、相关装置及前端页面。
技术介绍
现在开发前端页面为了提高开发速度降低维护成本都会使用前端框架，比如react、vue和rax等，同一个页面使用不同前端框架开发的代码是不一样的，不同的前端框架优缺点和各自适应的场景也不一样，需要平衡选择，互联网业务中基于业务特点、时间、页面性能要求等出发点，经常需要将同一个页面以不同的前端框架来开发以满足目标需求，此时就需要进行重复开发，成本较高，后期页面修改多个不同框架下的页面代码修改成本也较高。一方面，目前前端框架有好多种，优缺点及适应场景都不一样，有些开发速度更快，有些生成的页面代码性能更高，有些开发门槛更低等等，另一方面，实际业务场景比较复杂，同一个页面可能使用A框架开发后上线无问题，过一段时间该页面使用A框架开发的页面代码在另一个应用场景中不适用了，可能有需要使用B框架把页面重新开发一遍，这样，同一个页面因为业务场景、应用目标等因素的影响，可能针对同一个页面，开发团队会使用多个不同前端框架分别开发出多个不同框架下的页面代码。这样，同一个页面开发了多遍，且多个不同框架下的页面代码在后期产品迭代修改过程中，多份代码都需要统一修改，开发效率低，维护成本高。本专利技术的其它特征和优点将在随后的说明书中阐述，并且，部分地从说明书中变得显而易见，或者通过实施本专利技术而了解。本专利技术的目的和其他优点可通过在所写的说明书、权利要求书、以及附图中所特别指出的结构来实现和获得。>下面通过附图和实施例，对本专利技术的技术方案做进一步的详细描述。
技术实现思路
鉴于上述问题，提出了本专利技术以便提供一种克服上述问题或者至少部分地解决上述问题的一种页面的生成方法、相关装置及前端页面。第一方面，本专利技术实施例提供一种页面的生成方法，包括：将页面对应的页面描述数据以及所述页面使用的至少一个框架对应的框架模板，传送给模板引擎；接收所述模板引擎输出的所述页面在所述至少一个框架下的页面代码；所述页面代码是通过所述页面描述数据和对应的框架模板合成得到的。在一个实施例中，将页面描述数据和所述框架模板，传送给模板引擎，包括：调用所述模板引擎的编写接口，将所述页面描述数据和所述至少一个框架对应的框架模板作为编写接口参数传递给所述模板引擎的编程接口。在一个实施例中，所述框架模板，包括：与框架相关的、用于描述所述页面的且符合所述框架规定格式的代码。在一个实施例中，所述模板引擎，是预先通过所述页面使用的至少一个框架确定得到的。在一个实施例中，所述页面描述数据，包括下述一项或多项：页面布局的信息、页面样式的信息、页面的数据关联关系信息和页面交互的信息。在一个实施例中，所述数据关联关系，包括：页面上的内容数据、所述内容数据与页面布局和/或页面样式之间关联关系；所述页面交互的信息，为所述页面交互逻辑的信息。在一个实施例中，所述框架模板，为下述任一项框架所对应的模板：React框架、Vue框架和Rax框架。第二方面，本专利技术实施例提供一种页面的生成装置，包括：传送模块，用于将所述页面对应的页面描述数据以及所述页面使用的至少一个框架对应的框架模板，传送给模板引擎；模板引擎模块，用于将所述页面描述数据和对应的框架模板合成，得到框架下的页面代码；接收模块，用于接收所述模板引擎输出的所述页面在所述至少一个框架下的页面代码。第三方面，本专利技术实施例提供的一种服务器，包括：存储器和处理器；其中，所述存储器存储有计算机程序，所述程序被处理器执行时能够实现前述页面的生成方法。第四方面，本专利技术实施例提供的一种计算机可读存储介质，其上存储有计算机指令，该指令被处理器执行时实现前述页面的生成方法。第五方面，本专利技术实施例提供的一种前端页面，所述页面的代码是通过页面描述数据和所述页面所使用的框架下的框架模板合成得到的。本专利技术实施例提供的上述技术方案的有益效果至少包括：本专利技术实施例提供的上述页面的生成方法；针对每个页面，都编写了对应的页面描述数据，并且，针对页面可能使用到的每种前端框架，也分别编写了对应的框架模板，在进行页面开发时，只需要将每个页面的页面描述数据与对应的框架模板使用模板引擎进行自动合成即可，对于大量页面的开发工作而言，由于框架模板是互通的，可以大大减少开发的工作量，并且，不管有多少新的页面需要上线，也只需要自动地执行页面的页面描述数据与对应的框架模板使用模板引擎的步骤。类似地，在页面根据业务情况需要进行修改时，由于也不必去修改框架模板，将修改后的页面描述数据与框架模板进行自动合成即可，大大提升了前端页面开发和修改的效率，并降低了人工编写代码的工作量。本专利技术实施例中，预先编写好的页面描述数据，包括描述页面的设计信息，包括页面布局的信息、页面样式的信息、页面的数据关联关系信息和页面交互的信息，这些信息与页面自身相关，与框架无关，而框架模板中包含与框架相关的、符合框架规定格式的用于描述页面的那部分设计信息，将这两者通过框架模板进行自动合成，最终生成页面的代码，由于大量页面可以通用若干个前端框架，这样的分离开发，然后进行自动合成的方式，可有效地减少人工开发的工作量，提高页面开发效率。附图说明附图用来提供对本专利技术的进一步理解，并且构成说明书的一部分，与本专利技术的实施例一起用于解释本专利技术，并不构成对本专利技术的限制。在附图中：图1为本专利技术实施例提供的页面的生成方法的流程图；图2A为现有开发方式开发n个框架下的m个页面的页面代码的示意图；图2B为本专利技术实施例提供的页面的生成方法生成m个页面在n个框架下的页面代码的示意图；图3为本专利技术实施例提供的页面的生成装置的结构示意图。具体实施方式下面将参照附图更详细地描述本公开的示例性实施例。虽然附图中显示了本公开的示例性实施例，然而应当理解，可以以各种形式实现本公开而不应被这里阐述的实施例所限制。相反，提供这些实施例是为了能够更透彻地理解本公开，并且能够将本公开的范围完整的传达给本领域的技术人员。为了解决现有技术中同一个页面例如前端页面在不同的框架下，需要重复开发多遍，并且在后续产品迭代过程中，修改代码存在的开发工作量大，维护成本高的问题，本专利技术实施例提供了一种页面的生成方法，下面结合附图，对该方法的实现流程进行详细的说明。本专利技术实施例提供的页面的生成方法，参照图1所示，包括：S11、将页面对应的页面描述数据以及所述页面使用的至少一个框架对应的框架模板，传送给模板引擎；在本专利技术实施例中，前端页面通常会根据业务需求，例如为了适应于多种不同类型的设备终端，可能需要使用多种前端框架(以下简称框架)进行开发，例如已有的可以降低前端页面开发、维护成本的javascript框架，前端框架对进行前端页面开发所需的底层应用程序编程接口(API，ApplicationProgrammingInter本文档来自技高网...

【技术保护点】
1.一种页面的生成方法，其特征在于，包括：/n将页面对应的页面描述数据以及所述页面使用的至少一个框架对应的框架模板，传送给模板引擎；/n接收所述模板引擎输出的所述页面在所述至少一个框架下的页面代码；所述页面代码是通过所述页面描述数据和对应的框架模板合成得到的。/n

【技术特征摘要】
1.一种页面的生成方法，其特征在于，包括：
将页面对应的页面描述数据以及所述页面使用的至少一个框架对应的框架模板，传送给模板引擎；
接收所述模板引擎输出的所述页面在所述至少一个框架下的页面代码；所述页面代码是通过所述页面描述数据和对应的框架模板合成得到的。


2.如权利要求1所述的方法，其特征在于，将页面描述数据和所述框架模板，传送给模板引擎，包括：
调用所述模板引擎的编写接口，将所述页面描述数据和所述至少一个框架对应的框架模板作为编写接口参数传递给所述模板引擎的编程接口。


3.如权利要求1所述的方法，其特征在于，所述框架模板，包括：与框架相关的、用于描述所述页面的且符合所述框架规定格式的代码。


4.如权利要求1所述的方法，其特征在于，所述模板引擎，是预先通过所述页面使用的至少一个框架确定得到的。


5.如权利要求1-4任一项所述的方法，其特征在于，所述页面描述数据，包括下述一项或多项：
页面布局的信息、页面样式的信息、页面的数据关联关系信息和页面交互的信息。


6.如权利要求5所述的方法，其特征在于，所述数据关联关系，包括：页面上的内容数据、所...

【专利技术属性】
技术研发人员：程水强，
申请(专利权)人：阿里巴巴集团控股有限公司，
类型：发明
国别省市：开曼群岛;KY