生成网站应用系统的方法、装置、电子设备及存储介质

技术领域

本申请涉及数据处理技术领域，具体而言，涉及一种生成网站应用系统的方法、装置、电子设备及存储介质。

背景技术

目前阶段中，在进行网站应用系统开发时，通过基于流程图的代码生成前端代码，或者开发固定场景的后端代码，需要将独立开发的前端代码以及后端代码进行融合才可以完成一个网站应用系统的开发，存在网站应用系统开发复杂、低效的问题。

发明内容

本申请的实施例在于提供一种生成网站应用系统的方法、装置、电子设备及存储介质，以解决目前方法生成网站应用系统的效率低的问题。

本申请的实施例提供了一种生成网站应用系统的方法，所述方法包括：

基于建表信息进行建表得到数据表并存储在数据库中，所述建表信息是根据数据表参数生成的，所述数据表参数包括数据表字段信息；

基于从所述数据库中的数据表以及用户选择进行信息配置，得到配置信息；

基于所述配置信息生成前端代码；

基于所述配置信息中的属性配置信息生成后端代码；

基于所述前端代码得到前端镜像，以及基于所述后端代码得到后端镜像；

基于所述前端镜像、所述后端镜像，以及网站域名和网站地址之间的映射关系进行网站应用系统的部署。

在上述实现过程中，通过建立所述数据表，并基于从数据库中的数据表以及用户选择进行信息配置，基于所述配置信息得到分别得到所述前端代码和后端代码，基于所述前端代码以及所述后端代码分别生成前端镜像以及后端镜像，基于所述前端镜像以及所述后端镜像完成对所述网站应用系统的部署，即数据库的建立、前端以及后端的开发是相互联系的，并通过这种联系实现一站式方式完成对网站应用系统的数据库、前端、后端的开发，并完成对网站应用系统的部署生成网站应用系统，避免将前端、后端分开开发，提高生成网站应用系统的效率。

可选地，所述前端代码包括前端页面展示代码以及前端数据请求接口代码，所述配置信息包括对所述数据表的字段名称、字段描述进行配置得到的字段配置子信息以及对所述数据表的各个字段名称对应的组件进行配置得到的组件配置子信息，所述基于所述配置信息生成前端代码，包括：

基于配置信息生成第一配置文件，所述第一配置文件包括入口配置文件以及接口数据配置文件；

根据所述配置信息中的所述字段配置子信息以及所述组件配置子信息生成入口配置文件，并将所述入口配置文件通过Vue的语法生成所述前端页面展示代码；

基于根据所述配置信息中的所述字段配置子信息以及所述组件配置子信息生成接口数据配置文件，并基于所述接口数据配置文件通过request对象将接口请求信息封装生成前端数据请求接口代码。

在上述实现过程中，基于所述入口配置文件并基于Vue的语法生成所述前端页面展示代码，以在执行所述前端页面展示代码时能够通过可视化的方式向用户展示网站应用系统，即生成与用户进行互动的用户界面。基于所述接口数据配置文件并通过request对象将接口请求信息封装生成前端数据请求接口代码，以在执行所述前端数据请求接口代码时基于所述前端数据请求完成用户对于所述网站应用系统的请求数据的输入，提高用户与所述网站应用系统交互的便捷性。

可选地，所述前端页面展示代码包括标签代码，所述根据所述配置信息中的所述字段配置子信息以及所述组件配置子信息生成入口配置文件，并将所述入口配置文件通过Vue的语法生成所述前端页面展示代码，包括：

基于所述字段配置子信息以及所述组件配置子信息构建前端模板；

基于所述前端模板通过Vue的语法生成每个所述字段名称对应的标签的所述标签代码。

在上述实现过程中，每个字段名称对应一个所述字段配置子信息，通过构建所述前端模板能够将各个字段与不同的标签组件对应，通过Vue的语法将不同标签对应的各个字段进行代码化得到对应的所述标签代码，在执行所述标签代码时能够将所述各个字段名称对应的所述字段配置子信息以可视化的标签的形式在前端展示出来，也就是不同的字段配置子信息能够通过标签的方式在前端进行展示，提高对字段进行可视化展示的适用性。

可选地，所述前端页面展示代码包括点击按钮代码以及按钮事件代码，所述根据所述配置信息中的所述字段配置子信息以及所述组件配置子信息生成入口配置文件，并将所述入口配置文件通过Vue的语法生成所述前端页面展示代码，包括：

在el-col组件中嵌入el-button组件生成所述点击按钮代码；

将与所述点击按钮代码对应的按钮与基于import方法导入的请求文件中的数据接口绑定生成所述按钮事件代码。

在上述实现过程中，将所述点击按钮代码对应的按钮与所述请求文件中的数据接口绑定，通过在el-col组件中嵌入el-button组件生成所述点击按钮代码并在执行所述点击按钮代码时在前端生成按钮，按钮能够用于用户与所述网站应用系统进行互动，能够通过所述点击按钮代码完成用户请求，提高用户与所述网站应用系统应用的便捷性。

可选地，所述属性配置信息包括对所述数据表中的各个字段名称对应的java类型、java属性进行配置得到的实体配置子信息，所述后端代码包括实体类属性代码，所述基于所述配置信息中的属性配置信息生成后端代码，包括：

基于所述实体配置子信息生成所述各个字段名称对应的class类信息；

基于所述各个字段名称对应的所述class类信息生成所述各个字段名称对应的实体类属性代码。

在上述实现过程中，通过对基于所述实体配置子信息生成所述各个字段名称对应的class类信息代码化生成所述实体类属性代码，在接收来自前端的用户请求后通过后端进行执行，即接收到来自前端的基于所述字段，名称的用户请求之后，后端通过调用所述实体类属性代码完成对所述各个字段名称对应的class类信息的调用。

可选地，所述基于所述前端代码得到前端镜像，以及基于所述后端代码得到后端镜像，包括：

制作第一镜像文本文件并将所述前端代码打包后生成的代码挂载到所述第一镜像文本文件中；

基于所述第一镜像文本文件制作所述前端镜像；

制作第二镜像文本文件并将所述后端代码挂载到所述第一镜像文本文件中；

基于所述第二镜像文本文件制作后端镜像。

在上述实现过程中，所述前端镜像能够为所述前端代码提供多个不同的下载源，所述后端镜像能够为所述后端代码提供多个不同的下载源，在所述网站应用系统所在的网络下载量比较大时，提高请求所述网站应用系统时的网络连接的可靠性。

本申请的实施例提供了一种生成网站应用系统的装置，应用于服务器,所述装置包括：

建表模块，用于基于建表信息进行建表得到数据表并存储在数据库中，所述建表信息是根据数据表参数生成的，所述数据表参数包括数据表字段信息；

配置模块，用于基于从所述数据库中的数据表以及用户选择进行信息配置，得到配置信息；

生成前端代码模块，用于基于所述配置信息生成前端代码；

生成后端代码模块，用于基于所述配置信息中的属性配置信息生成后端代码；

镜像模块，用于基于所述前端代码得到前端镜像，以及基于所述后端代码得到后端镜像；

部署模块，用于基于所述前端镜像、所述后端镜像，以及网站域名和网站的地址之间的映射关系进行网站应用系统的部署。

在上述实现过程中，通过建立所述数据表，并基于从数据库中的数据表以及用户选择进行信息配置，基于所述配置信息得到分别得到所述前端代码和后端代码，基于所述前端代码以及所述后端代码分别生成前端镜像以及后端镜像，基于所述前端镜像以及所述后端镜像完成对所述网站应用系统的部署，即数据库的建立、前端以及后端的开发是相互联系的，并通过这种联系实现一站式方式完成对网站应用系统的数据库、前端、后端的开发，并完成对网站应用系统的部署生成网站应用系统，避免将前端、后端分开开发，提高生成网站应用系统的效率。

可选地，所述前端代码包括前端页面展示代码以及前端数据请求接口代码，所述配置信息包括对所述数据表的字段名称、字段描述进行配置得到的字段配置子信息以及对所述数据表的各个字段名称对应的组件进行配置得到的组件配置子信息，所述生成前端代码模块用于：

基于配置信息生成第一配置文件，所述第一配置文件包括入口配置文件以及接口数据配置文件；

根据所述配置信息中的所述字段配置子信息以及组件配置子信息生成入口配置文件，并将所述入口配置文件通过Vue的语法生成前端页面展示代码；

基于根据所述配置信息中的所述字段配置子信息以及组件配置子信息生成接口数据配置文件，并基于所述接口数据配置文件通过request对象将接口请求信息封装生成前端数据请求接口代码。

在上述实现过程中，基于所述入口配置文件并基于Vue的语法生成所述前端页面展示代码，以在执行所述前端页面展示代码时能够通过可视化的方式向用户展示网站应用系统，即生成与用户进行互动的用户界面。基于所述接口数据配置文件并通过request对象将接口请求信息封装生成前端数据请求接口代码，以在执行所述前端数据请求接口代码时基于所述前端数据请求完成用户对于所述网站应用系统的请求数据的输入，提高用户与所述网站应用系统交互的便捷性。

可选地，所述前端页面展示代码包括标签代码，所述生成前端代码模块用于：

基于所述字段配置子信息以及所述组件配置子信息构建前端模板；

基于所述前端模板通过Vue的语法生成每个所述字段名称对应的标签的所述标签代码。

在上述实现过程中，每个字段名称对应一个所述字段配置子信息，通过构建所述前端模板能够将各个字段与不同的标签组件对应，通过Vue的语法将不同标签对应的各个字段进行代码化得到对应的所述标签代码，在执行所述标签代码时能够将所述各个字段名称对应的所述字段配置子信息以可视化的标签的形式在前端展示出来，也就是不同的字段配置子信息能够通过标签的方式在前端进行展示，提高对字段进行可视化展示的适用性。

可选地，所述前端页面展示代码包括点击按钮代码以及按钮事件代码，所述生成前端代码模块用于：

在el-col组件中嵌入el-button组件生成所述点击按钮代码；

将与所述点击按钮代码对应的按钮与基于import方法导入的请求文件中的数据接口绑定生成所述按钮事件代码。

在上述实现过程中，将所述点击按钮代码对应的按钮与所述请求文件中的数据接口绑定，通过在el-col组件中嵌入el-button组件生成所述点击按钮代码并在执行所述点击按钮代码时在前端生成按钮，按钮能够用于用户与所述网站应用系统进行互动，能够通过所述点击按钮代码完成用户请求，提高用户与所述网站应用系统应用的便捷性。

可选地，所述属性配置信息包括对所述数据表中的各个字段名称对应的java类型、java属性进行配置得到的实体配置子信息，所述生成后端代码模块用于：

基于所述实体配置子信息生成所述各个字段名称对应的class类信息；

基于所述各个字段名称对应的所述class类信息生成所述各个字段名称对应的实体类属性代码。

在上述实现过程中，通过对基于所述实体配置子信息生成所述各个字段名称对应的class类信息代码化生成所述实体类属性代码，在接收来自前端的用户请求后通过后端进行执行，即接收到来自前端的基于所述字段，名称的用户请求之后，后端通过调用所述实体类属性代码完成对所述各个字段名称对应的class类信息的调用。

可选地，所述镜像模块用于：

制作第一镜像文本文件并将所述前端代码打包后生成的代码挂载到所述第一镜像文本文件中；

基于所述第一镜像文本文件制作所述前端镜像；

制作第二镜像文本文件并将所述后端代码挂载到所述第一镜像文本文件中；

基于所述第二镜像文本文件制作后端镜像。

在上述实现过程中，所述前端镜像能够为所述前端代码提供多个不同的下载源，所述后端镜像能够为所述后端代码提供多个不同的下载源，在所述网站应用系统所在的网络下载量比较大时，提高请求所述网站应用系统时的网络连接的可靠性。

本实施例还提供了一种电子设备，所述电子设备包括存储器和处理器，所述存储器中存储有程序指令，所述处理器运行所述程序指令时，执行上述任意方法中的步骤。

本实施例还提供了一种存储介质，所述存储介质中存储有计算机程序指令，所述计算机程序指令被一处理器运行时，执行上述任意方法中的步骤。

附图说明

为了更清楚地说明本申请实施例的技术方案，下面将对本申请实施例中所需要使用的附图作简单地介绍，应当理解，以下附图仅示出了本申请的某些实施例，因此不应被看作是对范围的限定，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他相关的附图。

应注意到：相似的标号和字母在下面的附图中表示类似项，因此，一旦某一项在一个附图中被定义，则在随后的附图中不需要对其进行进一步定义和解释。

图1为本申请实施例提供的一种生成网站应用系统的方法的流程图。

图2为本申请实施例提供的一种可视化页面上建表的示意图。

图3为本申请实施例提供的一种信息配置的示意图。

图4为本申请实施例提供的一种生成前端代码的步骤的流程图。

图5为本申请实施例提供的一种生成前端页面展示代码的步骤的流程图。

图6为本申请实施例提供的一种基于组件生成前端页面展示代码的步骤的流程图。

图7为本申请实施例提供的一种生成后端代码的步骤的流程图。

图8为本申请实施例提供的一种生成前端镜像以及后端镜像的步骤的流程图。

图9为本申请实施例提供的一种生成网站应用系统的装置的示意图。

图例：70-生成网站应用系统的装置；701-建表模块；702-配置模块；703-生成前端代码模块；704-生成后端代码模块；705-镜像模块；706-部署模块。

具体实施方式

下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行描述。

在本申请的描述中，需要说明的是，术语“第一”、“第二”等仅用于区分描述，而不能理解为指示或暗示相对重要性。

本申请的其他特征和优点将在随后的说明书阐述，并且，部分地从说明书中变得显而易见，或者通过实施本申请实施例而了解。本申请的目的和其他优点可通过在所写的说明书、以及附图中所特别指出的结构来实现和获得。

为了提高生成网站应用系统的效率，本申请的实施例提供了一种生成网站应用系统的方法，请参看图1，图1为本申请实施例提供的一种生成网站应用系统的方法的流程图，所述生成网站应用系统的方法包括以下分步骤：

步骤S1：基于建表信息进行建表得到数据表并存储在数据库中，建表信息是根据数据表参数生成的，数据表参数包括数据表字段信息。

作为一种实施方式，本申请采用网页版的建表方法，即用户可以在可视化的界面上进行建表操作，通过可视化方式建表或者采用命令行的方式建表。可以理解的是，数据表参数包括表名称、表的存储时长、表的字段名称、字段的类型信息、字段的描述。数据表信息可以根据实际需要确定，并不唯一。请参看图2，图2为本申请实施例提供的一种可视化页面上建表的示意图。在图2中，有两种建表方式，即“可视化建表”以及“命令行建表”。表名称为“tmp_xtai_t”，表的存储时长为“180min”，表的字段名称分别为“id”、“name”、“info”，上述三个字段名称分别对应的字段类型为“double”、“string”、“string”,上述三个字段名称分别对应的字段的描述分别为“自增ID”、“名称”、“信息”。并通过“确定”按钮，将用户配置的建表信息发送到服务器，服务器通过Druid进行数据源配置后，并进行建表完成建表并将建成的数据表在数据库中进行储存，完成对数据库的更新。可以理解的是，建表信息为通过各个用户配置的数据表参数在通过“确认”按钮后向服务器发送的信息。

可以理解的是，命令行建表的方式就是通过编程代码实现将各个数据表参数转化为建表信息，并发送到服务器。

步骤S2：基于从数据库中的数据表以及用户选择进行信息配置，得到配置信息。

作为一种实施方式，可以基于JS开发可视化信息配置界面，用户通过该可视化信息配置页面请参看图3，图3为本申请实施例提供的一种信息配置的示意图。在图中，对字段名称为“id”、“name”、“desc”等对应的字段名称、字段描述、字段类型、java类型、java属性、插入、编辑、列表、查询功能以及查询方式进行设定，具体配置信息可以根据实际情况进行设置，并不唯一。其中，字段名称、字段描述、物理类型用于前端代码的生成以及在前端各个标签组件的生成。java类型、java属性用于后端实体类的生成，插入、编辑、列表、查询功能以及查询方式用于后端对数据库增、删、查、改接口的生成。在图3中，长方形框内的信息需要用户根据实际情况进行填写，带有倒三角的长方形框内的信息需要用户从多个选项中选择指定一个，正方形框内的信息需要用户通过勾选的方式进行选定。

可以理解的是，还可以对数据表的名称、表的描述、表对应的实体类名称、生成的配置信息的后台代码包路径、与具体应用场景对应的业务名称、业务功能描述进行配置。配置方式可以通过图3中的生成信息对应的表中通过用户进行输入配置，具体配置的信息根据网页应用系统的实际情境进行设置，并不唯一。

步骤S3：基于配置信息生成前端代码。

请参看图4，图4为本申请实施例提供的一种生成前端代码的步骤的流程图。可选地，前端代码包括前端页面展示代码以及前端数据请求接口代码，配置信息包括对数据表的字段名称、字段描述进行配置得到的字段配置子信息以及对数据表的各个字段名称对应的组件进行配置得到的组件配置子信息,步骤S3包括以下分步骤：

步骤S31：基于配置信息生成第一配置文件，第一配置文件包括入口配置文件以及接口数据配置文件。

作为一种实施方式，入口配置文件可以是Vue中的index.vue文件。

步骤S32：根据配置信息中的字段配置子信息以及组件配置子信息生成入口配置文件，并将入口配置文件通过Vue的语法生成前端页面展示代码。

在步骤S31-S32中，基于入口配置文件并基于Vue的语法生成前端页面展示代码，以在执行前端页面展示代码时能够通过可视化的方式向用户展示网站应用系统，即生成对用户可见的、与用户进行互动的用户界面。

请参看图5，图5为本申请实施例提供的一种生成前端页面展示代码的步骤的流程图。可选地，前端页面展示代码包括标签代码，步骤S32包括以下分步骤：

步骤S321：基于字段配置子信息以及组件配置子信息构建前端模板。

步骤S322：基于前端模板通过Vue的语法生成每个字段名称对应的标签的标签代码。

在步骤S321-S322中，每个字段名称对应一个字段配置子信息，通过构建前端模板能够将各个字段与不同的标签组件对应，通过Vue的语法将不同标签对应的各个字段进行代码化得到对应的所述标签代码，在执行标签代码时能够将各个字段名称对应的字段配置子信息以可视化的标签的形式在前端展示出来，也就是不同的字段配置子信息能够通过标签的方式在前端进行展示，提高对字段进行可视化展示的适用性。

作为一种实施方式，构建前端模板也就是创建