CN114281332A - 可视化的页面开发方法、装置、设备及介质 - Google Patents

Abstract

本发明提供一种可视化的页面开发方法、装置、设备及介质。在该方法中，用户在终端设备上进行选择组件和对组件进行配置，终端设备生成页面配置数据并发送至服务器。服务器根据页面配置数据和组件库获取到相应的代码，再将代码发送至GIT服务器，同时将提示信息返回至终端设备，以便提示用户代码提交成功。本方案通过服务器根据用户选择的组件及对组件进行的配置，自动生成相应的代码并发送至GIT服务器，有效提高了前端页面开发的效率。

Description

可视化的页面开发方法、装置、设备及介质

技术领域

本发明涉及计算机领域，尤其涉及一种可视化的页面开发方法、装置、设备及介质。

背景技术

前端开发是创建全球广域网(World Wide Web，简称：WEB)页面或手机软件(Application，简称：APP)等前端界面呈现给用户的过程，通过HTML，CSS及JavaScript以及衍生出来的各种技术、框架、解决方案，来实现互联网产品的用户界面交互。在进行前端开发时，需要经历大量的代码编写，导致前端工程师有大量的重复工作要做。

现有技术中，为了减少重复工作，有一些平台可以生成静态的前端页面，对于实际需求，还需要前端工程师将静态的前端页面的代码导出，进行二次开发，或者在平台上进行代码编写，实现实际需求。

因此，现有的前端页面开发方法需要前端工程师了解代码知识，并进行代码撰写，导致开发效率较低。

发明内容

本发明实施例提供一种可视化的页面开发方法、装置、设备及介质，用于解决现有的前端页面开发方法需要前端工程师了解代码知识，并进行代码撰写，导致开发效率较低的问题。

第一方面，本发明实施例提供一种可视化的页面开发方法，应用于开发平台的服务器，所述方法包括：

接收终端设备发送的页面配置数据，所述页面配置数据中包括用户选择的待开发页面上的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息；

根据所述页面配置数据以及本地预先存储的组件库中多个组件对应的代码，获取所述待开发页面对应的程序代码；

将所述程序代码、所述用户提供的分支号以及文件夹名称发送至GIT服务器，所述分支号用于在所述GIT服务器中确定GIT库，所述文件夹名称用于在所述GIT服务器中创建所述待开发页面对应的文件夹；

向所述终端设备返回提示信息，所述提示信息用于提示用户程序代码提交成功。

在一种具体实施方式中，所述根据所述页面配置数据以及本地预先存储的组件库中多个组件对应的代码，获取所述待开发页面对应的程序代码，包括：

根据所述页面配置数据中的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息，从所述组件库中获取中所述至少一个组件对应的组件代码；

将所述至少一个组件对应的组件代码进行组合，得到所述待开发页面对应的所述程序代码。

在一种具体实施方式中，所述根据所述页面配置数据中的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息，从所述组件库中获取中所述至少一个组件对应的组件代码，包括：

将所述页面配置数据中的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息进行json转换，得到所述待开发页面的json配置文件；

根据所述待开发页面的json配置文件，以及所述组件库中json配置文件与组件代码之间的映射关系，获取出所述至少一个组件对应的组件代码。

在一种具体实施方式中，所述方法还包括：

向所述终端设备发送文件信息填写提示，所述文件信息填写提示用于提示所述用户填写分支号和文件夹名称；

接收所述终端设备返回的文件夹名称和分支号；

根据所述分支号，确定所述用户提供的分支号。

在一种具体实施方式中，所述根据所述分支号，确定所述用户提供的分支号，包括：

确定所述用户是否多次填写过分支号；

若所述用户只填写过一次分支号，则向所述终端设备发送第一确认信息，所述第一确认信息用于提示用户确认所述分支号是否填写正确；

若所述用户填写过至少两次分支号，且至少两次填写的分支号不同，则向所述终端设备发送第二确认信息，所述第二确认信息用于提示用户从至少两个分支号中选择最终的分支号；

接收所述终端设备返回的分支号确认结果；

根据所述分支号确认结果，确定所述用户提供的分支号。

第二方面，本发明实施例提供一种可视化的页面开发方法，应用于用户的终端设备，所述方法包括：

响应于用户的页面建立操作，在图形用户界面上显示待开发页面，所述图形用户界面上还包括多个功能组件；

响应于用户的选择操作，将用户从所述多个功能组件中选中的至少一个组件展示在所述待开发页面中；

响应于用户对所述至少一个组件的属性和功能的配置，生成所述待开发页面对应的页面配置数据，所述页面配置数据中包括用户选择的待开发页面上的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息；

将所述页面配置数据发送至服务器；

接收并在所述图形用户界面上展示所述服务器返回的提示信息，所述提示信息用于提示用户程序代码提交成功。

在一种具体实施方式中，所述方法还包括：

接收并在所述图形用户界面上展示所述服务器发送的文件信息填写提示；

响应于用户在所述图形用户界面中用于填写文件信息的位置的输入操作，获取文件夹名称以及分支号；

将所述文件夹名称以及所述分支号发送至所述服务器。

在一种具体实施方式中，所述方法还包括：

接收并在所述图形用户界面上展示所述服务器发送的第一确认信息，所述第一确认信息用于提示用户确认所述分支号是否填写正确；

响应于用户的确认操作，向所述服务器返回分支号确认结果；

或者，

接收并在所述图形用户界面上展示所述服务器发送的第二确认信息，所述第二确认信息用于提示用户从至少两个分支号中选择最终的分支号；

响应于用户的分支号选择操作，向所述服务器返回分支号确认结果。

第三方面，本发明实施例提供一种可视化的页面开发装置，包括：

接收模块，用于接收终端设备发送的页面配置数据，所述页面配置数据中包括用户选择的待开发页面上的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息；

获取模块，用于根据所述页面配置数据以及本地预先存储的组件库中多个组件对应的代码，获取所述待开发页面对应的程序代码；

发送模块，用于将所述程序代码、所述用户提供的分支号以及文件夹名称发送至GIT服务器，所述分支号用于在所述GIT服务器中确定GIT库，所述文件夹名称用于在所述GIT服务器中创建所述待开发页面对应的文件夹；

所述发送模块，还用于向所述终端设备返回提示信息，所述提示信息用于提示用户程序代码提交成功。

第四方面，本发明实施例提供一种可视化的页面开发装置，包括：

显示模块，用于响应于用户的页面建立操作，在图形用户界面上显示待开发页面，所述图形用户界面上还包括多个功能组件；

所述显示模块，还用于响应于用户的选择操作，将用户从所述多个功能组件中选中的至少一个组件展示在所述待开发页面中；

生成模块，用于响应于用户对所述至少一个组件的属性和功能的配置，生成所述待开发页面对应的页面配置数据，所述页面配置数据中包括用户选择的待开发页面上的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息；

发送模块，用于将所述页面配置数据发送至服务器；

接收模块，用于接收并在所述图形用户界面上展示所述服务器返回的提示信息，所述提示信息用于提示用户程序代码提交成功。

第五方面，本发明实施例提供一种服务器，包括：

处理器，存储器，通信接口；

所述存储器用于存储所述处理器的可执行指令；

其中，所述处理器配置为经由执行所述可执行指令来执行第一方面任一项所述的可视化的页面开发方法。

第六方面，本发明实施例提供一种终端设备，包括：

处理器，存储器，通信接口以及显示器；

所述存储器用于存储所述处理器的可执行指令；

其中，所述处理器配置为经由执行所述可执行指令来执行第二方面任一项所述的可视化的页面开发方法。

第七方面，本发明实施例提供一种可读存储介质，其上存储有计算机程序，所述计算机程序被处理器执行时实现第一方面至第二方面任一项所述的可视化的页面开发方法。

第八方面，本发明实施例提供一种计算机程序产品，包括计算机程序，所述计算机程序被处理器执行时用于实现第一方面至第二方面任一项所述的可视化的页面开发方法。

本发明实施例提供的可视化的页面开发方法、装置、设备及介质，通过用户在终端设备上进行选择组件和对组件进行配置，终端设备生成页面配置数据并发送至服务器。服务器根据页面配置数据和组件库获取到相应的代码，再将代码发送至GIT服务器，同时将提示信息返回至终端设备，以便提示用户代码提交成功。本方案通过服务器根据用户选择的组件及对组件进行的配置，自动生成相应的代码并发送至GIT服务器，有效提高了前端页面开发的效率。

附图说明

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

图1为为本发明提供的可视化的页面开发方法场景示意图；

图2为本发明提供的可视化的页面开发方法实施例一的流程示意图；

图3为本发明提供的可视化的页面开发方法实施例二的流程示意图；

图4为本发明提供的可视化的页面开发方法实施例三的流程示意图；

图5为本发明提供的可视化的页面开发装置实施例一的结构示意图；

图6为本发明提供的可视化的页面开发装置实施例二的结构示意图；

图7为本发明提供的可视化的页面开发装置实施例三的结构示意图；

图8为本发明提供的可视化的页面开发装置实施例四的结构示意图；

图9为本发明提供的一种服务器的结构示意图；

图10为本发明提供的一种终端设备的结构示意图。

具体实施方式

为使本发明实施例的目的、技术方案和优点更加清楚，下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在根据本实施例的启示下作出的所有其他实施例，都属于本发明保护的范围。

本发明的说明书和权利要求书及上述附图中的术语“第一”、“第二”、“第三”“第四”等(如果存在)是用于区别类似的对象，而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换，以便这里描述的本发明的实施例能够以除了在这里图示或描述的那些以外的顺序实施。此外，术语“包括”和“具有”以及他们的任何变形，意图在于覆盖不排他的包含，例如，包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元，而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。

随着科技的迅速发展，前端页面也由简单的图片文字组合变成了可以进行交互的页面形式，让网页的内容更加的生动，这些都离不开前端开发。前端开发是创建全球广域网(World Wide Web，简称：WEB)页面或手机软件(Application，简称：APP)等前端界面呈现给用户的过程，通过HTML，CSS及JavaScript以及衍生出来的各种技术、框架、解决方案，来实现互联网产品的用户界面交互。在进行前端开发时，需要经历大量的代码编写，导致前端工程师有大量的重复工作要做。

现在一些平台可以减轻一些前端工程师的重复工作，可以生成一些静态的前端页面，要想满足实际的需要，前端工程师还需要将静态的前端页面的代码导出，进行二次开发，或者在平台上进行代码编写，实现实际需求。因此，现有的前端页面开发方法需要前端工程师了解代码知识，并进行代码撰写，导致开发效率较低。

针对现有技术中存在的问题，发明人在对可视化的页面开发方法进行研究的过程中发现，可以通过一种可视化的方法，只需要用户在终端设备上进行选择自己想要的组件，然后调整大小和位置等，再对组件的功能进行配置，用户进行保存后，终端设备将用户的页面配置数据发送至服务器。服务器根据页面配置数据和组件库自动生成对应的代码，将代码发送至分布式版本控制系统(GIT)服务器后向用户发送提示信息，来提示用户代码提交成功，完成前端页面的开发。基于上述发明构思，设计了本发明中的可视化的页面开发方案。

示例性的，图1为本发明提供的可视化的页面开发方法场景示意图，如图1所示，该应用场景可以包括：终端设备11、开发平台的服务器12和GIT服务器13。

终端设备包括但不限于经由数据连接/网络和/或经由无线接口进行通信的装置，如，针对蜂窝网络、无线局域网(Wireless Local Area Network，WLAN)、的通信装置；和/或另一被设置成接收/发送通信信号的装置。被设置成通过无线接口通信的终端设备可以被称为“无线通信终端”、“无线终端”或“移动终端”。终端设备是可以开发平台相应的操作软件，并且具有发送个接收功能的设备，它可以是台式电脑，也可以是笔记本电脑等其他智能终端，本发明实施例不对终端设备的具体形态进行限定，可以根据实际需求确定。

服务器是在网络中为其它客户机(如PC机、智能手机、ATM等终端甚至是火车系统等大型设备)提供计算或者应用服务的设备。在本申请的实施例中，该服务器具有获取待开发页面对应的程序代码的能力，确定用户提供的分支号的能力，以及发送和接收功能。

示例性的，在图1所示的应用场景中，在用户想要进行开发前端页面时，可以在终端设备11的图形用户界面进行操作，建立待开发页面，选择需要的组件，对组件进行大小和位置调整，以及对组件的功能进行配置。进而就可以将页面配置数据发送至开发平台的服务器12，服务器12在接收到页面配置数据后，可以获取相应的代码并发送至GIT服务器13，再将提示用户提交成功的提示信息返回至终端设备11。

相应的，开发平台的服务器12可以接收终端设备11发送的页面配置数据，进而结合组件库可以获取到待开发页面对应的程序代码，将代码、分支号以及文件夹名称发送至GIT服务器13后，还要将提示信息发送至终端设备11来提示用户提交成功。后续想要对代码进行测试时，还可以从GIT服务器13中获取相应的代码。

相应的，GIT服务器13可以接收开发平台12发送的待开发页面对应的程序代码、分支号以及文件夹名称后，可以根据分支号找到相应的分支，再在此分支下创建文件夹，文件夹名称使用接收到的文件夹名称，再将代码放置在此文件夹下。若后续需要对此代码进行测试，开发平台的服务器12还可以向GIT服务器13发送请求消息，GIT服务器13接收到后就可以将代码发送至开发平台的服务器12。

需要说明的是，图1仅是本发明实施例提供的一种应用场景的示意图，本发明实施例不对图1中包括的各种设备的实际形态进行限定，也不对图1中设备之间的交互方式进行限定，在方案的具体应用中，可以根据实际需求设定。

下面，通过具体实施例对本发明的技术方案进行详细说明。需要说明的是，下面这几个具体的实施例可以相互结合，对于相同或相似的概念或过程可能在某些实施例中不再赘述。

图2为本发明提供的可视化的页面开发方法实施例一的流程示意图，如图2所示，该可视化的页面开发方法具体包括以下步骤：

S201：响应于用户的页面建立操作，在图形用户界面上显示待开发页面。用户在终端设备的图形用户界面上进行操作之前，需要在GIT服务器中将GIT库进行复制，同时对复制的新的GIT库设置分支号。

在本步骤中，用户在GIT服务器中复制GIT库并设置分支号后，就可以在终端设备上进行开发平台的账号登陆，登录开发平台后，在图形用户界面上进行创建页面，这样图形用户界面上就可以显示用户创建的待开发页面。图形用户界面上还包括多个功能组件，以便后续用户可以在此图形用户界面上进行选择组件并显示在待开发页面中。

需要说明的是，用户创建的待开发页面可以是空白的页面，也可以是将之前创建的页面调取出来，对其继续开发的页面。

需要说明的是，对复制的新的GIT库设置分支号的方式可以是用户按照自己的需求进行设置，也可以是GIT服务器自动生成并发送给用户展示。本发明实施例不对设置分支号的方式进行限定，可根据实际情况进行设置。

需要说明的是，分支号可以是一串数字，也可以是一串数字与字母的结合，分支号与GIT服务器中的GIT库一一对应，GIT服务器可以根据分支号查找到对应的GIT库。示例性的，在GIT服务器中存在一个GIT库，它的分支号为3864hs4f5f5f7，在GIT服务器获取到此分支号后，就可以根据3864hs4f5f5f7查找到对应的GIT库。用户在开发前端页面时需要填写分支号，就是为了将开发好的程序代码发送至GIT服务器，并存储在分支号对应的GIT库中。本发明实施例不对分支号的具体形式进行限定，可根据实际情况进行设置。

需要说明的是，在用户创建了待开发页面后，可以选择是否填写分支号，若选择填写分支号，则终端设备可以获取到此分支号并发送至服务器。

S202：响应于用户的选择操作，将用户从多个功能组件中选中的至少一个组件展示在待开发页面中。

在本步骤中，终端设备在图形用户界面上显示待开发页面后，用户可以继续在图形用户界面上选择自己需要的功能组件，用户选择后，终端设备将用户选择的组件显示在待开发页面中，以便后续用户可以对组件进行进一步的操作。

需要说明的是，用户选择功能组件以及组件显示在待开发页面中的方式可以是用户点击选择组件，组件自动显示在待开发页面中；还可以是用户将组件通过拖拽的方式，将组件放置在待开发页面中。本发明实施例不对用户选择功能组件以及组件显示在待开发页面中的方式进行限定，可根据实际情况进行选择。

S203：响应于用户对至少一个组件的属性和功能的配置，生成待开发页面对应的页面配置数据。

S204：将页面配置数据发送至服务器。

在上述步骤中，终端设备将用户选择的组件显示在待开发页面中后，用户就可以继续对组件进行操作，用户可以调整组件的位置、大小、颜色等属性，进而再对组件的功能进行配置。用户对组件进行属性和功能的配置时，终端设备可根据用户的配置生成待开发页面对应的页面配置数据，页面配置数据中包括用户选择的待开发页面上的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息。在用户点击图形用户界面的保存按钮后，终端设备就将页面配置数据发送至开发平台的服务器。

需要说明的是，在图形用户界面上显示的组件都有默认配置，并且其中包含了实现功能的逻辑代码，在待开发页面上显示组件时，是使用默认的配置生成此组件并显示在待开发页面上的。

示例性的，组件为查询按钮组件时，用户将此组件显示在待开发页面上后，可以通过拖拽设置其大小和位置，通过图形用户界面上的下拉框选择颜色等，组件的大小、位置和颜色等属于组件的属性；修改其功能配置时，在图形用户界面上点击对应的下拉框，显示用户可以选择选项，用户选择后，当按下此按钮就可以实现查询该选项的功能，选择选项就是修改组件的功能配置。组件为表单组件时，用户将此组件显示在待开发页面上后，可以通过拖拽设置其大小和位置，通过图形用户界面上的下拉框选择颜色等，组件的大小、位置和颜色等属于组件的属性；修改其功能配置时，在图形用户界面上点击对应的下拉框，显示用户可以选择的表单项，用户选择后，后续在该开发页面上就显示该表单项对应的表单，选择表单项就是修改组件的功能配置。本发明实施例不对组件的功能和样式进行限定，可根据实际情况进行设置。

S205：接收终端设备发送的页面配置数据。

S206：根据页面配置数据以及本地预先存储的组件库中多个组件对应的代码，获取待开发页面对应的程序代码。

在本步骤中，终端设备设向服务器发送页面配置数据后，服务器进行接收，因为页面配置数据中包括用户选择的待开发页面上的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息，以及服务器中本地预先存储有组件库，组件库中有多个组件对应的代码，所以根据页面配置数据中的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息，从组件库中获取中至少一个组件对应的组件代码。进而将至少一个组件对应的组件代码进行组合，得到待开发页面对应的程序代码。

需要说明的是，本地预先存储的组件库为进行前端页面开发之前，由工作人员设置在服务器中的，用于从中获取组件代码。

S207：将程序代码、用户提供的分支号以及文件夹名称发送至GIT服务器。

S208：向终端设备返回提示信息。

在服务器接收到终端设备发送的页面配置数据时，会向终端设备发送文件信息填写提示，来提示用户填写分支号和文件夹名称，用户填写完成后，终端向服务器发送，服务器接收分支号和文件夹名称并对分支号进行确认。

在上述步骤中，服务器获取到程序代码、用户提供的分支号以及文件夹名称后，将其发送至GIT服务器，分支号用于在GIT服务器中确定GIT库，文件夹名称用于在GIT服务器中创建待开发页面对应的文件夹。在发送至GIT服务器后，就可以向终端设备返回提示信息，用于提示用户程序代码提交成功。

具体的，在用户在开发平台开发页面之前，在GIT服务器中复制了GIT库并设置了分支号，因此GIT服务器可以根据分支号找到对应的GIT库，并且根据文件夹名称在GIT库中创建名称为次文件夹名称的文件夹，在将程序代码放入此文件夹中。

S209：接收并在图形用户界面上展示服务器返回的提示信息。

在本步骤中，服务器发送提示信息后，终端设备就可以接收该提示信息，并在图形用户界面上展示给用户，以便用户可以知道程序代码已经提交成功。以便后续用户可以在图形用户界面上进行其他操作，例如，对程序代码进行测试、验收和发布。

本实施例提供的可视化的页面开发方法，通过用户对组件进行属性和功能的配置，终端生成页面配置数据并发送至服务器，服务器根据页面配置数据自动生成待开发页面对应的程序代码，再将代码发送至GIT服务器。相较于现有技术需要前端工程师进行二次开发，本发明不需要用户了解代码知识，进行代码撰写，有效提高了开发效率。同时将一个用户程序代码放入同一个文件夹，避免了不同用户的代码冲突。

图3为本发明提供的可视化的页面开发方法实施例二的流程示意图，如图3所示，在上述实施例一的基础上，步骤S206具体包括以下步骤：

S301：将页面配置数据中的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息进行json转换，得到待开发页面的json配置文件。

在本步骤中，由于组件库中包含json配置文件与组件代码之间的映射关系，因此想要根据至少一个组件的标识，每个组件的属性信息，每个组件的功能信息，从组件库中获取中至少一个组件对应的组件代码，就需要先将页面配置数据中的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息进行json转换，得到待开发页面的json配置文件并保存。

S302：根据待开发页面的json配置文件，以及组件库中json配置文件与组件代码之间的映射关系，获取出至少一个组件对应的组件代码。

在本步骤中，服务器得到待开发页面的json配置文件后，由于组件库中含有json配置文件与组件代码之间的映射关系，就可以根据json配置文件找到相应的组件代码。

S303：将至少一个组件对应的组件代码进行组合，得到待开发页面对应的程序代码。

在本步骤中，服务器获取到组件代码后，将代码组件进行组合，就可以形成待开发页面对应的程序代码，以便后续可以将此程序代码发送至GIT服务器。

本实施例提供的可视化的页面开发方法，通过将页面配置数据中的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息进行json转换，再通过组件库找到组件代码，将组件代码组合就可以形成待开发文件的程序代码。本方案不需要用户进行撰写代码，有效提高了开发效率。同时服务器中保存了json配置文件，用户下一次可直接使用此json配置文件进行进一步的开发，有效提高了开发效率。

图4为本发明提供的可视化的页面开发方法实施例三的流程示意图，如图4所示，在上述实施例一的基础上，在接收终端设备发送的页面配置数据之后，该可视化的页面开发方法还包括以下步骤：

S401：向终端设备发送文件信息填写提示。

在本步骤中，服务器接收到终端发送的页面配置数据后，向终端设备发送文件信息填写提示，用来提示用户填写分支号与文件夹名称。

S402：接收并在图形用户界面上展示服务器返回的文件信息填写提示。

S403：响应于用户在图形用户界面中用于填写文件信息的位置的输入操作，获取文件夹名称以及分支号。

S404：将文件夹名称以及分支号发送至服务器。

在上述步骤中，服务器发送文件信息填写提示后，终端设备进行接收并在图形用户界面上进行显示，提醒用户填写分支号与文件夹名称。用户在图形用户界面中用于填写文件信息的位置的输入文件夹名称和分支号，这样终端设备就可以获取到文件夹名称和分支号，进而将其发送至服务器。

S405：接收终端设备返回的文件夹名称和分支号。

S406：确定用户是否多次填写过分支号。

在上述步骤中，终端设备将文件夹名称和分支号发送至服务器后，服务器进行接收，进而确定用户是否多次填写过分支号。若用户在服务器向终端设备发送文件信息填写提示之前，在图形用户界面上填写过分支号，则终端设备会向服务器发送用户填写的分支号，这样服务器可判断出用户多次填写过分支号。

在服务器确定出用户是否多次填写过分支号之后，服务器会向终端设备发送确认信息，用户进行确认或选择操作，终端向服务器发送确认结果，在具体实现中，根据是否多次填写过分支号，至少包括两种处理方式：一种方式为步骤S407、S409和S410所示的方式，另一种为步骤S408、S411和S412所示的方式。

S407：若用户只填写过一次分支号，则向终端设备发送第一确认信息。

在本步骤中，服务器确定用户只填写过一次分支号，则向终端设备发送第一确认信息，第一确认信息用于提示用户确认所述分支号是否填写正确。

需要说明的是，若用户多次填写分支号，并且填写的分支号相同，也向终端设备发送第一确认信息。

S408：若用户填写过至少两次分支号，且至少两次填写的分支号不同，则向终端设备发送第二确认信息。

在本步骤中，服务器确定用户填写过至少两次分支号，且至少两次填写的分支号不同，则向终端设备发送第二确认信息，第二确认信息用于提示用户从至少两个分支号中选择最终的分支号。

S409：接收并在图形用户界面上展示服务器发送的第一确认信息。

S410：响应于用户的确认操作，向服务器返回分支号确认结果。

在上述步骤中，服务器向终端设备发送第一确认信息后，终端设备进行接收并显示在图形用户界面上，来提醒用户确认分支号是否填写正确，若用户点击确认按钮，则服务器返回分支号确认结果；若用户发现分支号错误，可以再次填写分支号，终端设备将再次填写的分支号作为确认结果发送至服务器。

S411：接收并在图形用户界面上展示服务器发送的第二确认信息。

S412：响应于用户的分支号选择操作，向服务器返回分支号确认结果。

在上述步骤中，服务器向终端设备发送第二确认信息后，终端设备进行接收并显示在图形用户界面上，来提醒用户从至少两个分支号中选择最终的分支号，若用户从中选择一个分支号，则服务器返回分支号确认结果；若用户发现分支号错误，可以再次填写分支号，终端设备将再次填写的分支号作为确认结果发送至服务器。

S413：接收终端设备返回的分支号确认结果。

S414：根据分支号确认结果，确定用户提供的分支号。

在上述步骤中，终端设备将确认结果发送至服务器后，服务器将其接收，根据分支号确认结果，确定用户提供的分支号。

具体的，若用户只填写过一次分支号并且确认此分支号正确，则将此分支号确定为用户提供的分支号；若用户多次填写过分支号，多次填写的分支号相同，并且确认此分支号正确，则将此分支号确定为用户提供的分支号；若用户只填写过一次分支号，但是确认此分支号错误，重新填写分支号，则将重新填写的分支号确定为用户提供的分支号；若用户多次填写过分支号，多次填写的分支号相同，但是确认此分支号错误，重新填写分支号，则将重新填写的分支号确定为用户提供的分支号；若用户多次填写过分支号，且至少两次填写的分支号不同，并且从中选出一个正确的分支号，则将此分支号确定为用户提供的分支号；若用户多次填写过分支号，且至少两次填写的分支号不同，但是其中没有正确的分支号，用户重新填写分支号，则将重新填写的分支号确定为用户提供的分支号。

本实施例提供的可视化的页面开发方法，通过服务器向终端设备发送文件信息填写提示，提示用户填写分支号和文件夹名称，进而判断用户是否多次填写分支号，进行不同的处理方式，以便获取到正确的分支号以及文件夹名称，有效减少了GIT服务器寻找GIT库的错误率。

下述为本发明装置实施例，可以用于执行本发明方法实施例。对于本发明装置实施例中未披露的细节，请参照本发明方法实施例。

图5为本发明提供的可视化的页面开发装置实施例一的结构示意图；如图5所示，该可视化的页面开发装置50包括：

接收模块51，用于接收终端设备发送的页面配置数据，所述页面配置数据中包括用户选择的待开发页面上的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息；

获取模块52，用于根据所述页面配置数据以及本地预先存储的组件库中多个组件对应的代码，获取所述待开发页面对应的程序代码；

发送模块53，用于将所述程序代码、所述用户提供的分支号以及文件夹名称发送至GIT服务器，所述分支号用于在所述GIT服务器中确定GIT库，所述文件夹名称用于在所述GIT服务器中创建所述待开发页面对应的文件夹；

所述发送模块53，还用于向所述终端设备返回提示信息，所述提示信息用于提示用户程序代码提交成功。

进一步地，所述获取模块52，具体用于：

根据所述页面配置数据中的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息，从所述组件库中获取中所述至少一个组件对应的组件代码；

将所述至少一个组件对应的组件代码进行组合，得到所述待开发页面对应的所述程序代码。

进一步地，所述获取模块52，具体还用于：

将所述页面配置数据中的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息进行json转换，得到所述待开发页面的json配置文件；

根据所述待开发页面的json配置文件，以及所述组件库中json配置文件与组件代码之间的映射关系，获取出所述至少一个组件对应的组件代码。

进一步地，所述发送模块53，还用于向所述终端设备发送文件信息填写提示，所述文件信息填写提示用于提示所述用户填写分支号和文件夹名称。

进一步地，所述接收模块51，还用于接收所述终端设备返回的文件夹名称和分支号。

本实施例提供的可视化的页面开发装置，用于执行前述任一方法实施例中服务器的技术方案，其实现原理和技术效果类似，在此不再赘述。

图6为本发明提供的可视化的页面开发装置实施例二的结构示意图；如图6所示，该可视化的页面开发装置50还包括：

确定模块54，用于根据所述分支号，确定所述用户提供的分支号。

进一步地，所述确定模块54，具体用于：

确定所述用户是否多次填写过分支号；

若所述用户只填写过一次分支号，则向所述终端设备发送第一确认信息，所述第一确认信息用于提示用户确认所述分支号是否填写正确；

若所述用户填写过至少两次分支号，且至少两次填写的分支号不同，则向所述终端设备发送第二确认信息，所述第二确认信息用于提示用户从至少两个分支号中选择最终的分支号。

接收所述终端设备返回的分支号确认结果；

根据所述分支号确认结果，确定所述用户提供的分支号。

本实施例提供的可视化的页面开发装置，用于执行前述任一方法实施例中服务器的技术方案，其实现原理和技术效果类似，在此不再赘述。

图7为本发明提供的可视化的页面开发装置实施例三的结构示意图；如图7所示，该可视化的页面开发装置70包括：

显示模块71，用于响应于用户的页面建立操作，在图形用户界面上显示待开发页面，所述图形用户界面上还包括多个功能组件；

所述显示模块71，还用于响应于用户的选择操作，将用户从所述多个功能组件中选中的至少一个组件展示在所述待开发页面中；

生成模块72，用于响应于用户对所述至少一个组件的属性和功能的配置，生成所述待开发页面对应的页面配置数据，所述页面配置数据中包括用户选择的待开发页面上的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息；

发送模块73，用于将所述页面配置数据发送至服务器；

接收模块74，用于接收并在所述图形用户界面上展示所述服务器返回的提示信息，所述提示信息用于提示用户程序代码提交成功。

进一步地，所述接收模块74，还用于接收并在所述图形用户界面上展示所述服务器发送的文件信息填写提示；

本实施例提供的可视化的页面开发装置，用于执行前述任一方法实施例中用户的终端设备的技术方案，其实现原理和技术效果类似，在此不再赘述。

图8为本发明提供的可视化的页面开发装置实施例四的结构示意图；如图8所示，该可视化的页面开发装置70还包括：

获取模块75，用于响应于用户在所述图形用户界面中用于填写文件信息的位置的输入操作，获取文件夹名称以及分支号。

进一步地，所述发送模块73，还用于将所述文件夹名称以及所述分支号发送至所述服务器。

进一步地，所述接收模块74，还用于接收并在所述图形用户界面上展示所述服务器发送的第一确认信息，所述第一确认信息用于提示用户确认所述分支号是否填写正确。

进一步地，所述发送模块73，还用于响应于用户的确认操作，向所述服务器返回分支号确认结果。

进一步地，所述接收模块74，还用于接收并在所述图形用户界面上展示所述服务器发送的第二确认信息，所述第二确认信息用于提示用户从至少两个分支号中选择最终的分支号。

进一步地，所述发送模块73，还用于响应于用户的分支号选择操作，向所述服务器返回分支号确认结果。

本实施例提供的可视化的页面开发装置，用于执行前述任一方法实施例中用户的终端设备的技术方案，其实现原理和技术效果类似，在此不再赘述。

图9为本发明提供的一种服务器的结构示意图。如图9所示，该服务器90包括：

处理器91，存储器92，以及通信接口93；

所述存储器92用于存储所述处理器91的可执行指令；

其中，所述处理器91配置为经由执行所述可执行指令来执行前述任一方法实施例中服务器的技术方案。

可选的，存储器92既可以是独立的，也可以跟处理器91集成在一起。

可选的，当所述存储器92是独立于处理器91之外的器件时，所述服务器90还可以包括：

总线，用于将上述器件连接起来。

该服务器用于执行前述任一方法实施例中服务器的技术方案，其实现原理和技术效果类似，在此不再赘述。

图10为本发明提供的一种终端设备的结构示意图。如图10所示，该终端设备100包括：

处理器101，存储器102，通信接口103以及显示器104；

所述存储器102用于存储所述处理器101的可执行指令；

其中，所述处理器101配置为经由执行所述可执行指令来执行前述任一方法实施例中用户的终端设备的技术方案。

可选的，存储器102既可以是独立的，也可以跟处理器101集成在一起。

可选的，当所述存储器102是独立于处理器101之外的器件时，所述终端设备100还可以包括：

总线，用于将上述器件连接起来。

该服务器用于执行前述任一方法实施例中用户的终端设备的技术方案，其实现原理和技术效果类似，在此不再赘述。

本发明实施例还提供一种可读存储介质，其上存储有计算机程序，所述计算机程序被处理器执行时实现前述任一实施例提供的服务器或者终端设备的技术方案。

本发明实施例还提供一种计算机程序产品，包括计算机程序，所述计算机程序被处理器执行时用于实现前述任一方法实施例提供的服务器或者终端设备的技术方案。

本领域普通技术人员可以理解：实现上述各方法实施例的全部或部分步骤可以通过程序指令相关的硬件来完成。前述的程序可以存储于一计算机可读取存储介质中。该程序在执行时，执行包括上述各方法实施例的步骤；而前述的存储介质包括：ROM、RAM、磁碟或者光盘等各种可以存储程序代码的介质。

最后应说明的是：以上各实施例仅用以说明本发明的技术方案，而非对其限制；尽管参照前述各实施例对本发明进行了详细的说明，本领域的普通技术人员应当理解：其依然可以对前述各实施例所记载的技术方案进行修改，或对其中部分或全部技术特征进行等同替换；而这些修改或替换，并不使相应技术方案的本质脱离本发明各实施例技术方案的范围。

Claims (14)

1.一种可视化的页面开发方法，其特征在于，应用于开发平台的服务器，所述方法包括：

接收终端设备发送的页面配置数据，所述页面配置数据中包括用户选择的待开发页面上的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息；

根据所述页面配置数据以及本地预先存储的组件库中多个组件对应的代码，获取所述待开发页面对应的程序代码；

将所述程序代码、所述用户提供的分支号以及文件夹名称发送至分布式版本控制系统GIT服务器，所述分支号用于在所述GIT服务器中确定GIT库，所述文件夹名称用于在所述GIT服务器中创建所述待开发页面对应的文件夹；

向所述终端设备返回提示信息，所述提示信息用于提示用户程序代码提交成功。

2.根据权利要求1所述的方法，其特征在于，所述根据所述页面配置数据以及本地预先存储的组件库中多个组件对应的代码，获取所述待开发页面对应的程序代码，包括：

根据所述页面配置数据中的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息，从所述组件库中获取中所述至少一个组件对应的组件代码；

将所述至少一个组件对应的组件代码进行组合，得到所述待开发页面对应的所述程序代码。

3.根据权利要求2所述的方法，其特征在于，所述根据所述页面配置数据中的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息，从所述组件库中获取中所述至少一个组件对应的组件代码，包括：

将所述页面配置数据中的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息进行json转换，得到所述待开发页面的json配置文件；

根据所述待开发页面的json配置文件，以及所述组件库中json配置文件与组件代码之间的映射关系，获取出所述至少一个组件对应的组件代码。

4.根据权利要求1至3任一项所述的方法，其特征在于，所述方法还包括：

向所述终端设备发送文件信息填写提示，所述文件信息填写提示用于提示所述用户填写分支号和文件夹名称；

接收所述终端设备返回的文件夹名称和分支号；

根据所述分支号，确定所述用户提供的分支号。

5.根据权利要求4所述的方法，其特征在于，所述根据所述分支号，确定所述用户提供的分支号，包括：

确定所述用户是否多次填写过分支号；

若所述用户只填写过一次分支号，则向所述终端设备发送第一确认信息，所述第一确认信息用于提示用户确认所述分支号是否填写正确；

若所述用户填写过至少两次分支号，且至少两次填写的分支号不同，则向所述终端设备发送第二确认信息，所述第二确认信息用于提示用户从至少两个分支号中选择最终的分支号；

接收所述终端设备返回的分支号确认结果；

根据所述分支号确认结果，确定所述用户提供的分支号。

6.一种可视化的页面开发方法，其特征在于，应用于用户的终端设备，所述方法包括：

响应于用户的页面建立操作，在图形用户界面上显示待开发页面，所述图形用户界面上还包括多个功能组件；

响应于用户的选择操作，将用户从所述多个功能组件中选中的至少一个组件展示在所述待开发页面中；

响应于用户对所述至少一个组件的属性和功能的配置，生成所述待开发页面对应的页面配置数据，所述页面配置数据中包括用户选择的待开发页面上的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息；

将所述页面配置数据发送至服务器；

接收并在所述图形用户界面上展示所述服务器返回的提示信息，所述提示信息用于提示用户程序代码提交成功。

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

接收并在所述图形用户界面上展示所述服务器发送的文件信息填写提示；

响应于用户在所述图形用户界面中用于填写文件信息的位置的输入操作，获取文件夹名称以及分支号；

将所述文件夹名称以及所述分支号发送至所述服务器。

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

接收并在所述图形用户界面上展示所述服务器发送的第一确认信息，所述第一确认信息用于提示用户确认所述分支号是否填写正确；

响应于用户的确认操作，向所述服务器返回分支号确认结果；

或者，

接收并在所述图形用户界面上展示所述服务器发送的第二确认信息，所述第二确认信息用于提示用户从至少两个分支号中选择最终的分支号；

响应于用户的分支号选择操作，向所述服务器返回分支号确认结果。

9.一种可视化的页面开发装置，其特征在于，包括：

接收模块，用于接收终端设备发送的页面配置数据，所述页面配置数据中包括用户选择的待开发页面上的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息；

获取模块，用于根据所述页面配置数据以及本地预先存储的组件库中多个组件对应的代码，获取所述待开发页面对应的程序代码；

发送模块，用于将所述程序代码、所述用户提供的分支号以及文件夹名称发送至分布式版本控制系统GIT服务器，所述分支号用于在所述GIT服务器中确定GIT库，所述文件夹名称用于在所述GIT服务器中创建所述待开发页面对应的文件夹；

所述发送模块，还用于向所述终端设备返回提示信息，所述提示信息用于提示用户程序代码提交成功。

10.一种可视化的页面开发装置，其特征在于，包括：

显示模块，用于响应于用户的页面建立操作，在图形用户界面上显示待开发页面，所述图形用户界面上还包括多个功能组件；

所述显示模块，还用于响应于用户的选择操作，将用户从所述多个功能组件中选中的至少一个组件展示在所述待开发页面中；

生成模块，用于响应于用户对所述至少一个组件的属性和功能的配置，生成所述待开发页面对应的页面配置数据，所述页面配置数据中包括用户选择的待开发页面上的至少一个组件的标识，每个组件的属性信息，每个组件的功能信息；

发送模块，用于将所述页面配置数据发送至服务器；

接收模块，用于接收并在所述图形用户界面上展示所述服务器返回的提示信息，所述提示信息用于提示用户程序代码提交成功。

11.一种服务器，其特征在于，包括：

处理器，存储器，通信接口；

所述存储器用于存储所述处理器的可执行指令；

其中，所述处理器配置为经由执行所述可执行指令来执行权利要求1至5任一项所述的可视化的页面开发方法。

12.一种终端设备，其特征在于，包括：

处理器，存储器，通信接口以及显示器；

所述存储器用于存储所述处理器的可执行指令；

其中，所述处理器配置为经由执行所述可执行指令来执行权利要求6至8任一项所述的可视化的页面开发方法。

13.一种可读存储介质，其上存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现权利要求1至8任一项所述的可视化的页面开发方法。

14.一种计算机程序产品，其特征在于，包括计算机程序，所述计算机程序被处理器执行时用于实现权利要求1至8任一项所述的可视化的页面开发方法。

Images