CN114201170A

CN114201170A - 业务页面生成方法及装置

Info

Publication number: CN114201170A
Application number: CN202111526025.1A
Authority: CN
Inventors: 罗旭廷; 邵帅
Original assignee: Shanghai Bilibili Technology Co Ltd
Current assignee: Shanghai Bilibili Technology Co Ltd
Priority date: 2021-12-14
Filing date: 2021-12-14
Publication date: 2022-03-18

Abstract

本申请提供业务页面生成方法及装置，其中所述业务页面生成方法应用于编辑器页面，包括：创建所述编辑器页面对应的内嵌框架，并在所述内嵌框架中加载初始预览页面；接收针对所述初始预览页面的页面编辑指令，获取所述页面编辑指令中携带的页面编辑信息；基于所述页面编辑信息对所述编辑器页面进行处理，获得目标页面数据；基于所述目标页面数据，将所述初始预览页面渲染为目标预览页面；在接收到页面生成指令的情况下，将所述目标页面数据发送至页面生成对象，以使所述页面生成对象基于所述目标页面数据生成目标业务页面。

Description

业务页面生成方法及装置

技术领域

本申请涉及互联网技术领域，特别涉及一种业务页面生成方法。本申请同时涉及一种业务页面生成装置，一种计算设备，以及一种计算机可读存储介质。

背景技术

在互联网广告领域，广告发布者可以在展示给用户的广告位上设置链接，用户点击广告位即可跳转到事先准备好的、可以随时更新页面内容并可以继续设置跳转链接的信息承载页面，其中，最先展示给用户的广告位页面成为前端广告，跳转后的信息承载页面统称为落地页。

落地页跳转已经成为互联网的基本功能，而由于互联网的时效性较为重要，因此互联网广告需要较短的制作周期，从而达到快速上线的目的，但是，广告落地页的创建需要专业技术人员编写代码，开发工作量大，因此导致落地页开发周期较长，无法实现快速的创建落地页。

发明内容

有鉴于此，本申请实施例提供了一种业务页面生成方法。本申请同时涉及一种业务页面生成装置，一种计算设备，以及一种计算机可读存储介质，以解决现有技术中存在的开发周期长、无法快速的创建落地页的问题。

根据本申请实施例的第一方面，提供了一种业务页面生成方法，应用于编辑器页面，包括：

创建所述编辑器页面对应的内嵌框架，并在所述内嵌框架中加载初始预览页面；

接收针对所述初始预览页面的页面编辑指令，获取所述页面编辑指令中携带的页面编辑信息；

基于所述页面编辑信息对所述编辑器页面进行处理，获得目标页面数据；

基于所述目标页面数据，将所述初始预览页面渲染为目标预览页面；

在接收到页面生成指令的情况下，将所述目标页面数据发送至页面生成对象，以使所述页面生成对象基于所述目标页面数据生成目标业务页面。

根据本申请实施例的第二方面，提供了一种业务页面生成装置，应用于编辑器页面，包括：

创建模块，被配置为创建所述编辑器页面对应的内嵌框架，并在所述内嵌框架中加载初始预览页面；

获取模块，被配置为接收针对所述初始预览页面的页面编辑指令，获取所述页面编辑指令中携带的页面编辑信息；

处理模块，被配置为基于所述页面编辑信息对所述编辑器页面进行处理，获得目标页面数据；

渲染模块，被配置为基于所述目标页面数据，将所述初始预览页面渲染为目标预览页面；

发送模块，被配置为在接收到页面生成指令的情况下，将所述目标页面数据发送至页面生成对象，以使所述页面生成对象基于所述目标页面数据生成目标业务页面。

根据本申请实施例的第三方面，提供了一种计算设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机指令，所述处理器执行所述计算机指令时实现所述业务页面生成方法的步骤。

根据本申请实施例的第四方面，提供了一种计算机可读存储介质，其存储有计算机指令，该计算机指令被处理器执行时实现所述业务页面生成方法的步骤。

本申请提供的业务页面生成方法，应用于编辑器页面，包括创建所述编辑器页面对应的内嵌框架，并在所述内嵌框架中加载初始预览页面；接收针对所述初始预览页面的页面编辑指令，获取所述页面编辑指令中携带的页面编辑信息；基于所述页面编辑信息对所述编辑器页面进行处理，获得目标页面数据；基于所述目标页面数据，将所述初始预览页面渲染为目标预览页面；在接收到页面生成指令的情况下，将所述目标页面数据发送至页面生成对象，以使所述页面生成对象基于所述目标页面数据生成目标业务页面。

通过本申请一实施例提供的业务页面生成方法，通过页面编辑指令对内嵌框架中的初始预览页面进行可视化编辑，并通过目标预览页面实时的向用户展示编辑后的页面，从而通过页面的可视化配置的能力，降低业务页面制作门槛及成本；同时，在接收到页面生成指令的情况下，通过将目标页面数据发送至页面生成对象，以使页面生成对象基于目标页面数据快速的生成目标业务页面，从而提高业务页面的创建速度，减少开发工作量。

附图说明

图1是本申请一实施例提供的一种业务页面生成方法的流程图；

图2是本申请一实施例提供的可视化建站工具的页面示意图；

图3是本申请一实施例提供的一种应用于生成H5落地页的业务页面生成方法的处理流程图；

图4是本申请一实施例提供的生成H5落地页的示意图；

图5是本申请一实施例提供的一种业务页面生成装置的结构示意图；

图6是本申请一实施例提供的一种计算设备的结构框图。

具体实施方式

在下面的描述中阐述了很多具体细节以便于充分理解本申请。但是本申请能够以很多不同于在此描述的其它方式来实施，本领域技术人员可以在不违背本申请内涵的情况下做类似推广，因此本申请不受下面公开的具体实施的限制。

在本申请一个或多个实施例中使用的术语是仅仅出于描述特定实施例的目的，而非旨在限制本申请一个或多个实施例。在本申请一个或多个实施例和所附权利要求书中所使用的单数形式的“一种”、“所述”和“该”也旨在包括多数形式，除非上下文清楚地表示其他含义。还应当理解，本申请一个或多个实施例中使用的术语“和/或”是指并包含一个或多个相关联的列出项目的任何或所有可能组合。

应当理解，尽管在本申请一个或多个实施例中可能采用术语第一、第二等来描述各种信息，但这些信息不应限于这些术语。这些术语仅用来将同一类型的信息彼此区分开。例如，在不脱离本申请一个或多个实施例范围的情况下，第一也可以被称为第二，类似地，第二也可以被称为第一。取决于语境，如在此所使用的词语“如果”可以被解释成为“在……时”或“当……时”或“响应于确定”。

首先，对本申请一个或多个实施例涉及的名词术语进行解释。

落地页：也称着陆页、引导页，在互联网营销中，引导页就是当潜在用户点击广告或者利用搜索引擎搜索后显示给用户的网页。一般这个页面会显示和所点击广告或搜索结果链接相关的扩展内容，而且这个页面应该是针对某个关键字(或短语)做过搜索引擎优化的

H5：H5为HTML5的简称，HTML5是HyperText Markup Language 5的缩写，HTML5技术结合了HTML4.01的相关标准并革新，符合现代网络发展要求，在2008年正式发布。HTML5由不同的技术构成，其在互联网中得到了非常广泛的应用，提供更多增强网络应用的标准机。与传统的技术相比，HTML5的语法特征更加明显，并且结合了SVG()的内容。这些内容在网页中使用可以更加便捷地处理多媒体内容，而且HTML5中还结合了其他元素，对原有的功能进行调整和修改，进行标准化工作。HTML5在2012年已形成了稳定的版本。

原生app：NativeApp是一种基于智能手机本地操作系统(如iOS、Android、WP)，并使用原生程式编写运行的第三方应用程序，也叫本地app。一般使用的开发语言为JAVA、C++、Objective-C。

html：超文本标记语言，是一种标记语言。

css：层叠样式表。

javascript：是一种具有函数优先的轻量级、解释型或即时编译型的编程语言，被应用到了很多非浏览器环境中，JavaScript基于原型编程、多范式的动态脚本语言，并且支持面向对象、命令式和声明式风格。

在互联网飞速发展的今天，随着新技术的不断介入及消费者接触信息方式的多元化，传播媒介发生深刻的变革，尤其是广告的传播形式、技术手段、创意手法等。对于互联网广告来讲，内涵也是丰富多彩的。广告的本质特点是引导受众，信息科技日新月异，互联网已取代报纸、电视等传统媒体，成为年轻人获得信息的主要途径，因此网络广告业随之兴起。由于互联网广告具有速度快、低成本、互动性强、即时性等优势，因此非常受广告发布者的青睐和认可。而网络媒体的特点决定了网络广告的特定要求，网络的时效性非常重要，网络广告的制作周期短，上线时间快，因此广告落地页的创作也必须适应这种快速性，及时性，便利性。

广告落地页(例如H5广告落地页)在互联网中广泛传播，建立一个H5广告落地页，需要懂得web网页技术(如html、css、javascript等)的专业技术人员进行开发，同时H5广告落地页的创建还需要一定开发周期。从而无法满足互联网广告的快速性，及时性，便利性的原则。

基于此，在本申请中，提供了一种业务页面生成方法，本申请同时涉及一种业务页面生成装置，一种计算设备，以及一种计算机可读存储介质，在下面的实施例中逐一进行详细说明。

图1示出了根据本申请一实施例提供的一种业务页面生成方法的流程图，该业务页面生成方法应用于编辑器页面，具体包括以下步骤：

步骤102：创建所述编辑器页面对应的内嵌框架，并在所述内嵌框架中加载初始预览页面。

随着互联网技术的发展，为了降低广告落地页的制作门槛，提高广告落地页的创建速度，本申请提供的业务页面生成方法，为运营人员，代理商及广告发布者等广告投放相关人员，提供一种可视化广告落地页建站工具，从而实现降低落地页制作门槛及成本，提高落地页制作速度的目的。

随着可视化建站工具(可视化广告落地页建站工具)的应运而生，对于不懂技术的用户(广告投放者)而言，也可以通过可视化建站工具来搭建网站，制作网页。用户通过可视化建站工具可以创建一个网页的编辑器页面，在编辑器页面中包括有要创建页面属性信息，例如页面名称、页面标题、页面背景等，还包括有创建页面的基础信息，例如网页的图片格式、图片大小、图片链接、图片描述等等。

其中，编辑器可以理解为生成目标业务页面的工具，例如可视化建站工具。编辑器页面可以理解为能够用于对页面数据进行处理的页面。在实际应用中，编辑器中包含编辑器页面。基于此，创建所述编辑器页面对应的内嵌框架可以理解为在编辑器中创建与该编辑器页面对应的内嵌框架；也即是说，该编辑器中包括编辑器页面和内嵌框架。

该内嵌框架(Iframe)是HTML标签，作用是文档中的文档，或浮动的框架，Iframe元素会创建包含另外一个文档的内联框架，Iframe用于在网页内显示另外的网页界面。

业务页面具体是指与具体业务相关的网页，如广告落地页、网站宣传页等等，用户希望创建一个业务页面时，可以通过建站工具创建一个编辑器页面和所述编辑器页面对应的Iframe。

在内嵌框架中加载的初始预览页面可以理解为在用户进行业务页面制作过程中，实时向用户展示其制作成果的预览页面。例如，最终的业务页面为一张风景图片页面，初始预览页面即用户通过可视化建站工具对风景图片页面的参数进行修改和调整时，向用户展示其调整结果的预览界面。使得用户能够通过该初始预览页面了解到自己的创建业务页面时，进行了何种修改。

在实际应用中，在内嵌框架中加载初始预览页面可以理解为基于初始页面数据，在内嵌框架中渲染初始浏览页面，其中，页面数据可以理解为业务页面的页面代码数据以及页面属性信息，例如，广告落地页的JSON描述信息数据源、页面模版代码块等。对应的，初始页面数据可以理解为在生成业务页面过程中，用户需要根据业务需要，进行编辑页面代码数据或页面属性信息。

在本申请提供的一具体实施方式中，以用户希望创建某静态网页为例，用户通过可视化建站工具创建编辑器页面，同时创建与编辑器页面对应的Iframe，并基于初始页面数据，在Iframe中渲染初始预览页面，便于通过该初始预览页面展示在创建广告落地页过程中，对广告落地页的各种编辑结果。

步骤104：接收针对所述初始预览页面的页面编辑指令，获取所述页面编辑指令中携带的页面编辑信息。

在实际应用中，建站工具是可视化的，即编辑器页面和预览页面是对应显示的，如图2所示，图2示出了本申请一实施例提供的可视化建站工具的页面示意图，其中，该可视化建站工具中包含有内嵌框架和编辑器页面，在内嵌框架中展示的是预览界面，通过该预览界面能够清楚的了解到对落地页进行的结果。

其中，页面编辑指令可以理解为在创建广告落地页的过程中，对广告落地页进行编辑的指令。对应的，针对初始预览页面的页面编辑指令可以理解为用户通过对预览页面中展示的初始预览页面，进行拖拽、放大或缩小等调整操作时产生的编辑指令。例如，用户通过拖拽的方式调整初始预览页面的边框时产生的编辑指令。

页面编辑信息可以理解为用户通过对初始浏览页面进行拖拽、放大或缩小等调整操作时产生的信息。例如，用户通过拖拽的方式缩小初始预览页面的边框时产生的编辑信息，后续基于该编辑信息能够确定将初始预览页面的边框调整到何种尺寸。

在本申请提供的一具体实施方式中，通过可视化建站工具中与编辑器页面对应的Iframe，展示制作落地页过程中的预览页面；用户可以通过拖拽Iframe中的预览页面，到达对落地页进行编辑的目的。其中，在用户拖拽Iframe中的预览页面时，能够接收到用户针对该预览页面的页面编辑指令，且该指令中携带有用户需要对落地页进行调整的页面编辑信息。获取该页面编辑信息，便于后续基于该页面编辑信息快速的创建落地页。

步骤106：基于所述页面编辑信息对所述编辑器页面进行处理，获得目标页面数据。

其中，基于所述页面编辑信息对所述编辑器页面进行处理，可以理解为基于页面编辑信息对编辑器页面中的页面参数进行处理；该对编辑器页面中的也参数进行处理的方式，具体可以为对编辑器页面中的参数进行调整。

该页面参数可以理解为表示该目标页面的格式、类型的参数，例如，页面尺寸，页面边距、页面名称，页面图片的位置信息等参数。

在具体实施过程中，该编辑器页面中包含该目标页面数据中的各种页面参数，例如，页面尺寸，页面边距或页面名称等页面参数。如图2所示，该编辑器页面中包括“页面名称”、“页面背景”等参数。通过页面编辑信息对该编辑器页面中包括的页面参数进行调整，可以实现对页面数据进行调整。

在可视化建站工具中，在获取到页面编辑指令中携带的页面编辑信息之后，可以基于该页面编辑信息对编辑器页面进行处理，从而获得目标页面数据。其中，目标页面数据可以理解为基于页面编辑信息对初始页面数据进行更新后，获得页面数据。

在本申请提供的一实施例中，基于页面编辑信息获得目标页面数据的方式具体如下。

所述基于所述页面编辑信息对所述编辑器页面进行处理，获得目标页面数据，包括：

基于所述页面编辑信息对所述编辑器页面进行更新，获得页面更新数据；

基于所述页面更新数据对所述初始预览页面的初始页面数据进行更新，获得目标页面数据。

其中，基于所述页面编辑信息对所述编辑器页面进行更新，可以理解为基于页面编辑信息对编辑器页面中的页面参数进行更新。

在可视化建站工具中，在获取到页面编辑指令中携带的页面编辑信息之后，基于该页面编辑信息对编辑器页面进行处理，从而获得在编辑器页面中生成的页面更新数据，例如，页面编辑指令为调整图片的位置，对应的页面编辑信息为图片需要被调整的位置信息。基于图片需要被调整的位置信息，对编辑器页面中图片的位置信息进行调整，生成图片调整完成后的位置信息，该图片调整后的位置信息即为页面更新数据。

在获得页面更新数据之后，基于该页面更新数据对初始页面数据中图片的位置信息进行更新，从而获得目标页面数据，其中，该初始页面数据即渲染该初始预览页面时所依据的页面数据。

在本申请提供的一具体实施方式中，基于通过页面编辑信息对编辑器页面进行更新获得的页面更新数据，对初始预览页面的初始页面数据进行更新，获得目标页面数据，使得用户通过对初始预览页面执行的调整操作，即可对编辑过程中的落地页的参数进行调整，便于后续快速的创建落地页，使不懂web网页技术的人员也可以快速的制作广告落地页，降低了落地页制作门槛及成本。

进一步地，在本申请提供的业务页面生成方法中，在能够接收到针对初始预览页面的页面编辑指令的同时，还能够接收到用户针对编辑器页面的页面编辑指令，也即是，本申请提供的业务页面生成方法中，用户可以通过对初始预览页面进行拖拽、放大等调整操作创建落地页，也能够基于编辑器页面在创建落地页的过程中对落地页进行调整，实现快速的创建落地页。具体实现方式如下。

本申请提供的业务页面生成方法，还包括：

接收针对所述编辑器页面的页面编辑指令，其中，所述页面编辑指令中携带有页面编辑信息；

响应于页面编辑指令，基于所述页面编辑信息处理所述编辑器页面，获得页面更新数据；

其中，页面编辑指令具体是指针对编辑器页面的处理指令，在实际应用中，建站工具是可视化的，即编辑器页面和初始预览页面是对应显示的，如图2所示，图2示出了本申请一实施例提供的可视化建站工具的页面示意图，在可视化建站工具中有内嵌框架和编辑器页面，在内嵌框架中可以展示预览页面；在编辑器页面中有建站工具的各种编辑参数、组件和基础信息。用户针对编辑器页面发送页面编辑指令。

基于页面编辑信息处理编辑器页面，可以理解为基于页面编辑信息对编辑器页面中的页面参数进行处理。

在本申请提供的一种实施方式中，针对编辑器页面的页面编辑指令包括但不限于添加、修改页面名称或页面标题，修改模块的基础信息等等。

在本申请提供的一具体实施方式中，沿用上例，接收针对编辑器页面的页面编辑指令，所述页面编辑指令包括调整初始预览页面中按钮的位置(即调整编辑中的落地页的按钮位置)，以及更换初始预览页面中的图片(即根据编辑中的落地页的图片)。

在可视化建站工具中，接收到页面编辑指令之后，即可响应于该页面编辑指令，基于该页面编辑指令中携带的页面编辑信息处理编辑器页面，从而获得在编辑器页面中生成的页面更新数据，例如，页面编辑指令为调整图片的位置，响应于所述页面编辑指令，生成图片调整完成后的位置信息，该图片调整后的位置信息即为页面更新数据。

用户可以在编辑器页面中，对通过初始预览页面进行展示的、处于编辑中的落地页进行调整，例如移动、新增、删除、更改配置项等等，用户可以添加页面名称、页面标题等信息，还可以在模块中选择相应的模块，并在基础信息中修改、编辑选中模块的基础信息，如图2所示，用户点击“添加模块”区域中的“图片”，则在基础信息中显示图片模块的相关基础信息；若用户点击按钮模块，则在基础信息中显示按钮模块的相关基础信息。

在本申请提供的一具体实施方式中，沿用上例，响应于页面编辑指令，获得初始预览页面中展示的按钮、被调整后的位置信息、和更新后的图片的图片信息，其中，按钮的位置信息和新图片的图片信息即为页面更新数据。

在获得页面更新数据之后，基于该页面更新数据对初始页面数据进行更新，从而获得目标页面数据，例如，页面编辑指令为调整按钮的位置信息，该页面编辑信息为按钮的左边距为5。基于该页面编辑信息将编辑器页面中按钮的左边距更改为5，从而获得页面更新数据；基于该页面更新数据将初始页面数据中，按钮在落地页中的左边距更新为5，从而获得目标页面数据。

在本申请提供的一具体实施方式中，能够响应于针对编辑器页面的页面编辑指令，基于该指令中的页面编辑信息处理编辑器页面，获得页面更新数据；并基于页面更新数据对初始预览页面的初始页面数据进行更新，获得目标页面数据，从而便于后续基于该目标页面数据快速的创建业务页面，同时，用户通过编辑器页面中展示的信息，便捷的对编辑过程中的落地页的参数进行精准的调整，降低了落地页制作门槛及成本，提高了落地页的质量。

在具体实施过程中，用户能够通过对初始预览页面中的组件，执行各种类型的调整操作，例如以拖拽的方式调整组件的位置，通过放大或缩小的方式调整组件的尺寸等。通过调整操作实现对编辑过程中的落地页的组件进行调整，具体实现方式如下。

所述接收针对所述初始预览页面的页面编辑指令，获取所述页面编辑指令中携带的页面编辑信息，包括：

接收针对所述初始预览页面的组件编辑指令，获取所述组件编辑指令中携带的目标组件编辑信息；

对应的，所述基于所述页面编辑信息对所述编辑器页面进行处理，获得目标页面数据，包括：

响应于所述组件编辑指令，基于所述目标组件编辑信息对所述编辑器页面进行更新，获得目标组件更新数据；

基于所述目标组件更新数据对所述初始预览页面的初始页面数据进行更新，获得目标页面数据。

其中，基于目标组件编辑信息对编辑器页面进行更新，可以理解为对编辑器页面中包含的页面组件参数进行更新，该页面组件可以理解为该页面中包含按钮、图片、文本框等组件。该页面组件参数可以理解为页面中按钮的尺寸、页面中按钮的边距，文本框的大小、图片大小等参数。

在具体实施过程中，该编辑器页面中包含该目标页面数据中的各种页面组件参数。能够通过目标组件编辑信息对该编辑器页面中包括的页面组件参数进行调整，可以实现对页面数据进行调整。

其中，组件可以理解为业务页面中的组件，例如广告落地页中的组件。在实际应用中，广告落地页包含各个组件，例如：按钮、图片、表单、多线沟通、轮播图、关注、电话、文本、全屏图片以及全屏视频等。对每个组件有相应的描述信息，如组件宽高、组件布局、组件样式、组件类型、组件版本、组件功能(主要包含：下载、跳转、唤起、电话调用、关注对应博主)，图片资源地址等。

其中，组件编辑指令可以理解为在创建广告落地页的过程中，对广告落地页中的组件进行编辑的指令。对应的，针对初始预览页面的组件编辑指令可以理解为用户通过对预览页面中，所展示的初始预览页面中的组件，进行拖拽、放大或缩小等调整操作时产生的编辑指令。例如，用户通过拖拽的方式调整初始预览页面中按钮尺寸时产生的编辑指令。

目标组件编辑信息可以理解为用户通过对组件进行拖拽、放大或缩小等调整操作时产生的数据。例如，用户通过拖拽的方式缩小页面中按钮尺寸时产生的编辑信息，后续基于该编辑信息能够确定将该按钮调整到何种尺寸。

具体地，用户在通过调整操作对初始预览页面进行调整时，可以直接调整在初始预览页面上的组件，例如将组件1从位置A移动至位置B，在此过程中，会生成针对初始预览页面中展示的组件1的组件编辑指令，并且组件编辑指令中携带的目标组件编辑信息。

响应于该组件编辑指令，基于该目标组件编辑信息对编辑器页面进行更新，从而获得在编辑器页面中生成的目标组件更新数据，例如，组件编辑指令为调整按钮的位置，对应的目标组件编辑信息为按钮需要被调整的位置信息。基于按钮需要被调整的位置信息，对编辑器页面中按钮的位置信息进行调整，生成按钮调整完成后的位置信息，该按钮调整后的位置信息即为目标组件更新数据。

在获得目标组件更新数据之后，基于该目标组件更新数据对初始页面数据中按钮的位置信息进行更新，从而获得目标页面数据。

在本申请提供的一具体实施方式中，基于针对初始预览页面的组件编辑指令中携带的目标组件编辑信息，对编辑器页面进行更新获得目标组件更新数据，并基于目标组件更新数据对初始预览页面的初始页面数据进行更新，从而获得目标页面数据。便于后续基于该目标页面数据快速的创建业务页面，实现了使不懂web网页技术的人员也可以快速的制作广告落地页，降低了落地页制作门槛及成本。

进一步地，在本申请提供的业务页面生成方法中，用户在通过对初始预览页面中组件进行拖拽、放大等调整操作创建落地页的同时，也能够通过针对组件的配置页面，对创建落地页的过程中落地页的组件参数进行调整。具体实现方式如下。

所述基于所述目标页面数据，将所述初始预览页面渲染为目标预览页面之前，还包括：

接收针对所述初始预览页面的页面组件编辑指令，其中，所述页面组件编辑指令携带有目标组件标识；

响应于所述页面组件编辑指令调用所述目标组件标识对应的目标组件的配置页面；

接收在所述配置页面中生成的针对所述目标组件的组件配置数据；

基于所述组件配置数据对所述初始预览页面的初始页面数据进行更新，获得目标页面数据。

具体地，在用户需要对组件进行调整时，可以直接调整在初始业务页面上的组件，例如将组件1从位置A移动至位置B，而在此过程中，会生成针对组件1的页面组件编辑指令，其中，在页面组件编辑指令中携带有目标组件标识“1”。

响应于该页面组件编辑指令，编辑器页面根据页面组件编辑指令中携带的目标组件标识，可以确定用户需要对目标组件进行调整，则在编辑器页面中调用目标组件对应的配置页面，例如，目标组件标识为“组件1”，编辑器页面基于该“组件1”，选中编辑器页面中的“组件1”，再调用“组件1”对应的配置页面。

在调用“组件1”对应的配置页面之后，用户可以在配置页面中对目标组件进行进一步的配置调整，并生成针对目标组件的组件配置数据；且在获得组件配置数据之后，基于该组件配置数据对初始页面数据中组件的属性信息进行更新，从而获得目标页面数据。例如，组件配置数据可以为按钮被调整后的位置信息，基于该组件配置数据对初始页面数据中按钮的位置信息进行更新，从而获得目标页面数据。

在本申请提供的业务页面生成方法中，所述基于所述目标页面数据，将所述初始预览页面渲染为目标预览页面之前，还包括：

接收针对所述编辑器页面的组件确定指令，其中，所述组件确定指令中携带目标组件标识；

响应于所述组件确定指令确定所述目标组件标识对应的目标组件数据；

基于所述目标组件数据对所述初始预览页面的初始页面数据进行更新，获得目标页面数据。

其中，组件确定指令可以理解为在创建落地页过程中，为落地页中添加组件的指令。

其中，页面编辑指令具体是指针对编辑器页面的处理指令，在实际应用中，建站工具是可视化的，即编辑器页面和初始预览页面是对应显示的，如图2所示，在编辑器页面中有建站工具的各种组件。用户可以针对编辑器页面中的组件发送组件确定指令。

目标组件数据可以理解为组件对应的组件代码数据以及组件属性数据，例如组件模版代码块以及组件的JSON描述数据。

在本申请提供的一具体实施方式中，沿用上例，能够接收到用户针对编辑器页面中的按钮组件1，发出的组件确定指令，该组件确定指令中携带有按钮组件1的标识“1”。

响应于该组件确定指令，确定出标识“1”对应的按钮组件1，并获取该按钮组件1的组件代码块以及组件JSON描述数据，并将该组件代码块以及组件JSON描述数据，加入到初始页面数据中，对该初始页面数据进行更新，从而获得目标页面数据。

在本申请提供的一具体实施方式中，接收携带有目标组件标识的组件确定指令，响应于组件确定指令确定目标组件标识对应的目标组件数据，并基于目标组件数据对初始预览页面的初始页面数据进行更新，获得目标页面数据，从而便于后续基于该目标页面数据快速的创建业务页面，同时，用户通过编辑器页面中展示的信息，便捷的对编辑过程中落地页的组件进行添加，降低了落地页制作门槛及成本，提高了落地页的质量。

进一步地，所述基于所述页面编辑信息对所述编辑器页面进行处理，获得目标页面数据，包括：

确定所述初始预览页面对应的初始页面数据，其中，所述初始页面数据包括页面属性数据以及页面代码数据；

基于所述页面编辑信息对所述编辑器页面进行处理，获得页面更新数据；

基于所述页面更新数据对所述页面属性数据进行更新，获得更新属性数据；

基于所述更新属性数据以及所述页面代码数据，生成目标页面数据。

其中，页面属性信息可以立即为落地页数据源，也即是落地页的JSON描述数据源；在实际应用中，该JSON描述数据源中包含落地页以及落地页中组件的JSON描述数据。

其中，页面代码数据可以理解为落地页以及落地页中组件的代码数据，在实际应用中，该代码数据以模版代码块的实现表示，便于在创建落地页时，基于该模版代码块快速确定的落地页的代码数据。

具体地，在基于页面编辑数据生成目标页面数据的过程中，首先需要确定初始预览页面对应的初始页面数据，该初始页面数据包括页面属性数据以及页面代码数据；之后基于页面编辑信息对编辑器页面进行处理，通过该编辑器页面生成页面更新数据，并基于页面更新数据对页面属性数据进行更新，获得更新属性数据；通过该页面更新数据对初始页面数据中的页面数据进行更新，例如，在页面更新数据为按钮被调整后的位置信息时，通过该页面更新数据，对落地页的JSON数据源中所包含的、按钮的JSON描述数据进行更新，使得按钮的JSON描述数据中记载的原位置信息，变更为被调整后的位置信息，获得落地页更新后的JSON数据源，即更新属性数据。

基于更新属性数据以及页面代码数据，生成目标页面数据。

在本申请提供的一具体实施方式中，基于页面编辑信息对初始页面数据中的编辑器页面进行处理，获得页面更新数据；基于页面更新数据对页面属性数据进行更新，获得更新属性数据；从而实现对业务页面中的属性数据进行调整，并将更新属性数据以及页面代码数据，生成目标页面数据。从而便于后续基于该目标页面数据快速的创建业务页面。

步骤108：基于所述目标页面数据，将所述初始预览页面渲染为目标预览页面。

在实际应用中，在获得目标页面数据之后，能够基于该用目标页面数据，将编辑器页面对应的内嵌框架中的初始预览页面，渲染为目标预览页面，也即是，根据用户的指令对初始页面数据进行更新获得目标页面数据之后，将用户在创建落地页过程中对该落地页的编辑操作，通过在内嵌框架中渲染目标预览页面的方式，向用户展示，从而达到实时的将用户对落地页的调整，实时的向用户进行展示的目的，从而便于用户基于该目标预览页面清晰的了解到自己对落地页的调整结果。

具体实施时，该目标页面数据包含页面代码数据以及页面属性数据，因此，基于该目标页面数据将初始预览页面渲染为目标预览页面，也可以理解为基于落地页的页面代码数据以及页面属性数据，在内嵌框架中将初始预览页面渲染为目标预览页面。例如，根据落地页的页面模版代码块(页面模版和组件模版)、以及落地页的JSON描述数据源，将内嵌框架中的初始预览页面渲染为目标预览页面，其中，该页面模版代码块中包含页面模版以及页面中组件模版。该页面模版可以为广告落地页的代码，组件模版可以为广告落地页中组件的代码。

步骤110：在接收到页面生成指令的情况下，将所述目标页面数据发送至页面生成对象，以使所述页面生成对象基于所述目标页面数据生成目标业务页面。

其中，该页面生成对象可以理解为基于目标页面数据生成落地页的对象，例如生成落地页的SSR服务、能够生成落地页的服务器、或能够基于目标页面数据生成落地页的程序等。本申请对此不做具体限制。

具体地，在将初始预览页面渲染为目标预览页面之后，用户能够实时的感知到自己对落地页的调整结果，在用户确定对落地页已满足业务需求时，会发出页面生成指令，指示编辑器页面执行页面生成的操作。

编辑器页面在接收到该页面生成指令之后，将目标页面数据发送至页面生成对象；以使得页面生成对象基于目标页面数据生成落地页。

在本申请提供的一具体实施方式中，沿用上例，用户确认预览页面呈现效果，并点击保存页面后，能够发送针对编辑器页面的页面生成指令，在接收到页面生成指令时，将落地页的页面JSON描述信息数据源，以及落地页的页面模版代码块推送到SSR服务；以使得SSR服务使用页面模版代码块及页面JSON描述信息数据源渲染生成真实广告落地页。

在实际应用中，在SSR服务生成真实广告落地页之后，将广告落地页推送到云储存服务。后续广告投放引擎从云存储服务中获取到该真实广告落地页，并将落地页分发用户终端，实现广告落地页触达到用户侧。

下述结合附图3和附图4，以本申请提供的业务页面生成方法在生成H5落地页的应用为例，对所述业务页面生成方法进行进一步说明。其中，图4是本申请一实施例提供的生成H5落地页的示意图。

如图4所示，根据快速创建H5落地页(广告落地页)的业务需求，本申请提供的业务页面生成方法中，提供一种可视化建站工具，该可视化建站工具中包括H5落地页的编辑器页面，以及与编辑器页面对应的内嵌框架；在该内嵌框架中加载H5落地页的预览界面并向用户展示；用户(广告投放者)可以通过拖拽预览界面或预览界面中的组件，对H5落地页进行布局，并通过视图数据转换模块将广告投放者的拖拽操作，转换为针对H5落地页的调整数据，其中该视图数据转换模块可以为编辑器页面；在获得调整数据之后，基于该调整数据对H5落地页的JSON描述数据进行更新，从而生成页面JSON描述数据。

在获得页面的JSON描述数据之后，根据该JSON描述数据以及页面模版代码块，重新渲染H5落地页的预览页面，并向广告投放者展示，在广告投放者预览配置好的落地页，并发出对该H5落地页进行保存的指令之后，编辑器页面基于该指令保存页面并发送该H5落地页的JSON描述数据源至SSR服务。其中，该页面模版代码块中包含页面模版以及页面中组件模版。该页面模版可以为H5落地页的代码，组件模版可以为H5落地页中组件的代码。在创建H5落地页过程中，广告投放者可以根据业务需求选择页面模版以及组件模版；该页面模版以及组件模版可以通过内嵌框架中预览界面向广告投放者展示，而广告投放者也可以通过拖拽的方式对预览界面以及预览界面中的组件进行调整。在广告投放者发出对该H5落地页进行保存的指令之后，还需要将页面模版代码块同步至SSR服务中。以使SSR服务基于页面模版代码块以及JSON描述数据源，生成真实H5落地页。

而SSR服务在接收到JSON描述数据源以及页面模版代码块之后，通过页面模版代码块以及JSON描述数据源渲染页面，从而生成真实的H5落地页；并将该真实的H5落地页同步至页面存储云服务，以使后续能够将真实的H5落地页(广告落地页)投放给用户。

其中，图3示出了本申请一实施例提供的一种应用于生成H5落地页的业务页面生成方法的处理流程图，具体包括以下步骤：

步骤302：预先约定H5落地页中组件模版相应的JSON描述信息。

步骤304：基于H5落地页的JSON描述数据以及页面模块代码块渲染生成预览界面。

步骤306：用户通过拖拽的方式调整预览页面中组件的JSON描述信息，对H5落地页进行布局，实现构建H5落地页。

步骤308：在落地页数据源中加入该组件JSON描述信息。

步骤310：根据JSON数据源及页面模版代码块渲染预览界面。

步骤312：用户确认预览视图呈现效果满足业务需求后点击保存H5落地页。

步骤314：将H5落地页的页面JSON描述信息数据源，以及H5落地页的页面模版代码块推送到SSR服务。

步骤316：SSR服务使用页面模版代码块及页面JSON描述信息数据渲染生成真实广告落地页。

其中，该广告落地页即为H5落地页。

步骤318：同步广告落地页至页面云存储服务。

步骤320：广告投放引擎向用户投放广告落地页。

步骤322：用户访问广告落地页。

通过本申请一实施例提供的业务页面生成方法，考虑到广告落地页的功能大多具有一致性，只是形态上多种多样。因此，将广告落地页的功能抽象为功能模块，从而提供页面形态可视化配置的能力，使不懂web网页技术的人员，也可以制作广告落地页。广告投放者只需上传图片、添加需要的功能模块，并对落地页进行排版布局，从而降低业务页面制作门槛及成本；从而提高H5落地页的创建速度，减少开发工作量。

与上述方法实施例相对应，本申请还提供了业务页面生成装置实施例，图5示出了本申请一实施例提供的一种业务页面生成装置的结构示意图。如图5所示，该装置应用于编辑器页面，包括：

创建模块502，被配置为创建所述编辑器页面对应的内嵌框架，并在所述内嵌框架中加载初始预览页面；

获取模块504，被配置为接收针对所述初始预览页面的页面编辑指令，获取所述页面编辑指令中携带的页面编辑信息；

处理模块506，被配置为基于所述页面编辑信息对所述编辑器页面进行处理，获得目标页面数据；

渲染模块508，被配置为基于所述目标页面数据，将所述初始预览页面渲染为目标预览页面；

发送模块510，被配置为在接收到页面生成指令的情况下，将所述目标页面数据发送至页面生成对象，以使所述页面生成对象基于所述目标页面数据生成目标业务页面。

可选的，所述业务页面生成装置，还包括页面数据获取模块，被配置为：

可选的，所述处理模块506，进一步被配置为：

可选的，所述获取模块504，进一步被配置为：

对应的，所述处理模块506，进一步被配置为：

可选的，所述业务页面生成装置，还包括配置页面调用模块，被配置为：

可选的，所述业务页面生成装置，还包括组件数据确定模块，被配置为：

对应的，所述处理模块506，进一步被配置为：

通过本申请一实施例提供的业务页面生成装置，通过页面编辑指令对内嵌框架中的初始预览页面进行可视化编辑，并通过目标预览页面实时的向用户展示编辑后的页面，从而通过页面的可视化配置的能力，降低业务页面制作门槛及成本；同时，在接收到页面生成指令的情况下，通过将目标页面数据发送至页面生成对象，以使页面生成对象基于目标页面数据快速的生成目标业务页面，从而提高业务页面的创建速度，减少开发工作量。

上述为本实施例的一种业务页面生成装置的示意性方案。需要说明的是，该业务页面生成装置的技术方案与上述的业务页面生成方法的技术方案属于同一构思，业务页面生成装置的技术方案未详细描述的细节内容，均可以参见上述业务页面生成方法的技术方案的描述。

图6示出了根据本说明书一个实施例提供的一种计算设备600的结构框图。该计算设备600的部件包括但不限于存储器610和处理器620。处理器620与存储器610通过总线630相连接，数据库650用于保存数据。

计算设备600还包括接入设备640，接入设备640使得计算设备600能够经由一个或多个网络660通信。这些网络的示例包括公用交换电话网(PSTN)、局域网(LAN)、广域网(WAN)、个域网(PAN)或诸如因特网的通信网络的组合。接入设备640可以包括有线或无线的任何类型的网络接口(例如，网络接口卡(NIC))中的一个或多个，诸如IEEE802.11无线局域网(WLAN)无线接口、全球微波互联接入(Wi-MAX)接口、以太网接口、通用串行总线(USB)接口、蜂窝网络接口、蓝牙接口、近场通信(NFC)接口，等等。

在本说明书的一个实施例中，计算设备600的上述部件以及图6中未示出的其他部件也可以彼此相连接，例如通过总线。应当理解，图6所示的计算设备结构框图仅仅是出于示例的目的，而不是对本说明书范围的限制。本领域技术人员可以根据需要，增添或替换其他部件。

计算设备600可以是任何类型的静止或移动计算设备，包括移动计算机或移动计算设备(例如，平板计算机、个人数字助理、膝上型计算机、笔记本计算机、上网本等)、移动电话(例如，智能手机)、可佩戴的计算设备(例如，智能手表、智能眼镜等)或其他类型的移动设备，或者诸如台式计算机或PC的静止计算设备。计算设备600还可以是移动式或静止式的服务器。

其中，处理器620执行所述计算机指令时实现所述的业务页面生成方法的步骤。

上述为本实施例的一种计算设备的示意性方案。需要说明的是，该计算设备的技术方案与上述的业务页面生成方法的技术方案属于同一构思，计算设备的技术方案未详细描述的细节内容，均可以参见上述业务页面生成方法的技术方案的描述。

本申请一实施例还提供一种计算机可读存储介质，其存储有计算机指令，该计算机指令被处理器执行时实现如前所述业务页面生成方法的步骤。

上述为本实施例的一种计算机可读存储介质的示意性方案。需要说明的是，该存储介质的技术方案与上述的业务页面生成方法的技术方案属于同一构思，存储介质的技术方案未详细描述的细节内容，均可以参见上述业务页面生成方法的技术方案的描述。

上述对本申请特定实施例进行了描述。其它实施例在所附权利要求书的范围内。在一些情况下，在权利要求书中记载的动作或步骤可以按照不同于实施例中的顺序来执行并且仍然可以实现期望的结果。另外，在附图中描绘的过程不一定要求示出的特定顺序或者连续顺序才能实现期望的结果。在某些实施方式中，多任务处理和并行处理也是可以的或者可能是有利的。

所述计算机指令包括计算机程序代码，所述计算机程序代码可以为源代码形式、对象代码形式、可执行文件或某些中间形式等。所述计算机可读介质可以包括：能够携带所述计算机程序代码的任何实体或装置、记录介质、U盘、移动硬盘、磁碟、光盘、计算机存储器、只读存储器(ROM，Read-Only Memory)、随机存取存储器(RAM，RandomAccess Memory)、电载波信号、电信信号以及软件分发介质等。需要说明的是，所述计算机可读介质包含的内容可以根据司法管辖区内立法和专利实践的要求进行适当的增减，例如在某些司法管辖区，根据立法和专利实践，计算机可读介质不包括电载波信号和电信信号。

需要说明的是，对于前述的各方法实施例，为了简便描述，故将其都表述为一系列的动作组合，但是本领域技术人员应该知悉，本申请并不受所描述的动作顺序的限制，因为依据本申请，某些步骤可以采用其它顺序或者同时进行。其次，本领域技术人员也应该知悉，说明书中所描述的实施例均属于优选实施例，所涉及的动作和模块并不一定都是本申请所必须的。

在上述实施例中，对各个实施例的描述都各有侧重，某个实施例中没有详述的部分，可以参见其它实施例的相关描述。

以上公开的本申请优选实施例只是用于帮助阐述本申请。可选实施例并没有详尽叙述所有的细节，也不限制该发明仅为所述的具体实施方式。显然，根据本申请的内容，可作很多的修改和变化。本申请选取并具体描述这些实施例，是为了更好地解释本申请的原理和实际应用，从而使所属技术领域技术人员能很好地理解和利用本申请。本申请仅受权利要求书及其全部范围和等效物的限制。

Claims

1.一种业务页面生成方法，其特征在于，应用于编辑器页面，包括：

2.根据权利要求1所述的业务页面生成方法，其特征在于，还包括：

3.根据权利要求1所述的业务页面生成方法，其特征在于，所述基于所述页面编辑信息对所述编辑器页面进行处理，获得目标页面数据，包括：

4.根据权利要求1所述的业务页面生成方法，其特征在于，所述接收针对所述初始预览页面的页面编辑指令，获取所述页面编辑指令中携带的页面编辑信息，包括：

5.根据权利要求1所述的业务页面生成方法，其特征在于，所述基于所述目标页面数据，将所述初始预览页面渲染为目标预览页面之前，还包括：

6.根据权利要求1所述的业务页面生成方法，其特征在于，所述基于所述目标页面数据，将所述初始预览页面渲染为目标预览页面之前，还包括：

7.根据权利要求1所述的业务页面生成方法，其特征在于，所述基于所述页面编辑信息对所述编辑器页面进行处理，获得目标页面数据，包括：

8.一种业务页面生成装置，其特征在于，应用于编辑器页面，包括：

9.一种计算设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机指令，其特征在于，所述处理器执行所述计算机指令时实现权利要求1-7任意一项所述方法的步骤。

10.一种计算机可读存储介质，其存储有计算机指令，其特征在于，该计算机指令被处理器执行时实现权利要求1-7任意一项所述方法的步骤。