CN109857378A

CN109857378A - 一种Web系统开发框架的构建方法及装置

Info

Publication number: CN109857378A
Application number: CN201910044907.0A
Authority: CN
Inventors: 谭喜成; 钟燕飞; 常川
Original assignee: Wuhan University WHU
Current assignee: Wuhan University WHU
Priority date: 2019-01-17
Filing date: 2019-01-17
Publication date: 2019-06-07

Abstract

本发明提供了一种Web系统开发框架的构建方法及装置，其中的方法首先准备导航栏图标和菜单栏图标，以实现更加美观的界面显示，并在MySQL数据库中创建数据库表，预先存储导航栏、菜单栏数据，同时创建其他数据库表用于实现用户管理和导航栏、菜单栏管理等功能，其次基于SSM框架实现后台架构，包括对导航栏、菜单栏的增、删、改、查及用户管理等功能，然后基于HTML、CSS、jQuery等技术实现前端架构，最后对前后端进行集成，实现前后端交互。本发明实现了降低了用户在开发Web系统过程中的重复性工作，提高开发效率的技术效果。

Description

一种Web系统开发框架的构建方法及装置

技术领域

本发明涉及计算机技术领域，具体涉及一种Web系统开发框架的构建方法及装置。

背景技术

Web系统由于具有访问便捷、占用资源少和跨平台等优点，成为企业、高校等机构进行系统开发的首要选择。Web系统的开发主要分为三个部分：前端开发、后端开发和数据库管理。

本申请发明人在实施本发明的过程中，发现现有技术中的方法至少存在如下技术问题：

在进行Web系统的开发中，具有相似功能的Web系统常常具有类似的前端开发架构，开发过程中存在大量重复工作；并且在Web系统维护的过程中，对于很小的修改也需要专业的技术人员来完成，用户需求的变化无法及时更新到Web系统中，且需要专业的团队完成系统的功能修改工作，耗费了大量的人力财力物力。

由此，可知现有技术中的方法存在效率低的技术问题。

发明内容

有鉴于此，本发明提供了一种Web系统开发框架的构建方法及装置，用以解决或者至少部分解决现有技术中的方法存在效率低的技术问题。

本发明第一方面提供了一种Web系统开发框架的构建方法，包括：

准备导航栏图标和菜单栏图标；

在数据库中创建第一数据库表，用以存储预定义的导航栏信息和菜单栏信息，同时创建第二数据库表，用以实现用户管理功能、导航栏管理功能以及菜单栏管理功能；

基于SSM框架实现后台架构，具体包括对导航栏管理功能、菜单栏的管理功能及用户管理功能的实现；

基于前端开发技术实现前端架构；

对后台架构与前端架构后端进行集成，实现前后端交互，从而构建Web系统开发框架。

在一种实施方式中，预定义的导航栏信息包括导航栏和导航栏子节点。

在一种实施方式中，基于SSM框架实现后台架构具体包括：

在前端页面的相应位置创建菜单栏；

依次创建导航栏和导航栏子节点，且，菜单栏、导航栏以及导航栏子节点三者之间呈树状结构。

在一种实施方式中，导航栏管理功能和菜单栏管理功能包括如下的一种或多种：

增加、删除、修改和查询。

在一种实施方式中，用户管理功能包括用户登录注册的业务逻辑。

在一种实施方式中，基于前端开发技术实现前端架构具体包括：

采用HTML、CSS和jQuery技术开发前端架构。

基于同样的发明构思，本发明第二方面提供了一种Web系统开发框架的构建装置，包括：

图标准备模块，用于准备导航栏图标和菜单栏图标；

数据库创建模块，用于在数据库中创建第一数据库表，用以存储导航栏信息和菜单栏信息，同时创建第二数据库表，用以实现用户管理功能、导航栏管理功能以及菜单栏管理功能；

后台架构实现模块，用于基于SSM框架实现后台架构，具体包括对导航栏管理功能、菜单栏的管理功能及用户管理功能的实现；

前台架构实现模块，用于基于前端开发技术实现前端架构；

前后端集成模块，用于对后台架构与前端架构后端进行集成，实现前后端交互，从而构建Web系统开发框架。

在一种实施方式中，数据库中存储的导航栏信息包括导航栏和导航栏子节点。

基于同样的发明构思，本发明第三方面提供了一种计算机可读存储介质，其上存储有计算机程序，其该程序被执行时实现第一方面所述的方法所述的方法。

基于同样的发明构思，本发明第四方面提供了一种计算机设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，所述处理器执行所述程序时实现第一方面所述的方法。

本申请实施例中的上述一个或多个技术方案，至少具有如下一种或多种技术效果：

在本发明提供的方法，首先准备导航栏图标和菜单栏图标，以实现更加美观的界面显示，并在数据库中创建第一数据库表，用以存储导航栏、菜单栏信息，并创建其他数据库表(第二数据表)用于实现用户管理和导航栏、菜单栏管理等功能，其次基于SSM框架实现后台架构，包括对导航栏、菜单栏的增、删、改、查及用户管理等功能，然后基于HTML、CSS、jQuery等技术实现前端架构，最后对前后端进行集成，实现前后端交互。

相对于现有技术中对于具有相似功能的Web系统的开发过程中存在大量重复工作而言，本发明将Web系统开发过程中的重复性工作进行了集成，降低了用户在开发Web系统过程中的重复性工作，使得用户可以专注于所搭建系统特定功能的实现；同时，在用户需求变化时，用户可以及时便捷地更新到Web系统，而不必通过专业的开发人员进行更改。

附图说明

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

图1为本发明实施例中Web系统开发框架的构建方法的实现流程图；

图2为本发明构建的Web系统的前端、后台、数据库交互示意图；

图3为本发明的前端菜单栏、导航栏、导航栏子节点树状图；

图4为本发明的数据库结构图；

图5为本发明Web系统开发框架的使用流程图；

图6为本发明实施例中Web系统开发框架的构建装置的结构框图；

图7为本发明实施例中计算机可读存储介质的结构框架图；

图8为本发明实施例中计算机设备的结构图。

具体实施方式

为了减少Web系统开发过程中的重复工作，提高开发的效率，同时增加Web系统维护的便捷性，本发明提出了一种零代码或少量代码进行Web系统开发框架的构建方法。

本发明的主要技术效果如下：

将Web系统开发过程中的重复性工作进行了集成，降低了用户在开发Web系统过程中的重复性工作，使得用户可以专注于所搭建系统特定功能的实现；同时，在用户需求变化时，用户可以及时便捷地更新到Web系统，而不必通过专业的开发人员进行更改。

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

实施例一

本实施例提供了一种Web系统开发框架的构建方法，请参见图1，该方法包括：

首先执行步骤S1：准备导航栏图标和菜单栏图标。

具体来说，导航栏图标和菜单栏图标可以预先设置，以便开发时应用。Web系统的开发主要分为三个部分：前端开发、后端开发、数据库管理，前端开发包括对Web页面的设计和实现，后端开发指Web系统后台逻辑的设计和实现及数据的存取，数据库管理指对数据库进行设计、开发等工作，以实现数据的存取。

然后执行步骤S2：在数据库中创建第一数据库表，用以存储导航栏信息和菜单栏信息，同时创建第二数据库表，用以实现用户管理功能、导航栏管理功能以及菜单栏管理功能。

具体来说，第一数据表和第二数据表可以由多张数据表组成，可以根据实际需求进行创建。零代码开发框架的数据库使用了MySQL数据库，用于存储预定义的导航栏、菜单栏，并对用户和用户对应的角色进行存储，在使用零代码开发框架进行Web系统搭建时，存储添加的菜单栏、导航栏、和导航栏子节点。

在具体的实施过程中，数据库结构图如图4所示，主要包括七个表：tbl_navigation、tbl_menu、tbl_category、tbl_service、tbl_datadic、tbl_user、tbl_role，其中tbl_navigation和tbl_menu分别用于存储预定义的导航栏和菜单栏信息，tbl_category用于存储所添加的节点的类别，类别包括导航栏、菜单栏、导航栏子节点，tbl_service用于存储用户将导航栏子节点所链接到的URL的地址，即导航栏子节点的功能，tbl_datadic用于存储用于添加的导航栏、菜单栏、导航栏子节点的信息，tbl_user用于存储用户信息，tbl_role用于存储系统用户的角色，分为普通用户、管理员、设计者等。

导航栏管理功能和菜单栏管理功能包括如下的一种或多种：

增加、删除、修改和查询。

在一种实施方式中用户管理功能包括用户登录注册的业务逻辑。

接下来执行步骤S3：基于SSM框架实现后台架构，具体包括对导航栏管理功能、菜单栏的管理功能及用户管理功能的实现。

具体来说，SSM框架即(Spring、SpringMVC、Mybatis)框架，是一种开发框架。实现了用户登录注册的业务逻辑，并完成了对导航栏、菜单栏、导航栏子节点进行增、删、改、查等操作。

在一种实施方式中，基于SSM框架实现后台架构具体包括：

在前端页面的相应位置创建菜单栏；

具体来说，本发明的前端菜单栏、导航栏、导航栏子节点树状图如图3所示，在使用零代码开发框架实现Web系统开发时，首先需要在前端页面的相应位置创建菜单栏，然后才能依次创建导航栏和导航栏子节点，三者之间呈树状结构。

再执行步骤S4：基于前端开发技术实现前端架构。

采用HTML、CSS和jQuery技术开发前端架构。

具体来说，零代码开发框架的前端是基于HTML、CSS、jQuery进行开发的，用于实现在前端页面添加、删除和修改导航栏、菜单栏、菜单栏子节点的操作，前端页面通过上述语言实现基本的框架，在使用时，可以在导航栏和菜单栏的位置通过鼠标右键添加菜单栏、导航栏和导航栏子节点，并根据需要修改成相应的样式，最后将输入菜单栏子节点所链接到的URL即可。

再执行步骤S5：对后台架构与前端架构后端进行集成，实现前后端交互，从而构建Web系统开发框架。

具体来说，本发明的前端、后台、数据库交互图如图2所示，前端进行服务请求，通过鼠标点击事件发起导航栏、菜单栏的增加、修改、删除等请求，后台接收前端请求，进行解析后将导航栏、菜单栏的增、删、改持久化到数据库，并从数据库查询相应导航栏、菜单栏信息，后台在完成前端请求后，将结果返回到前端页面进行显示。

本发明构建的开发框架，主要功能为：在Web系统开发过程中，使用本框架通过设计者角色在前端页面上添加菜单栏、导航栏、导航栏子节点(导航栏、菜单栏、导航栏子节点已预先存储在数据库中，分为不同的样式)，并将导航栏子节点链接到相应的URL(URL指向用户自定义的功能)，以实现快速便捷的Web系统搭建。开发框架包括实现系统业务逻辑处理的系统后端，用于用户交互的系统前端以及用于数据存储的数据库。前端接收请求后，将请求发送到后端，后端进行逻辑处理和数据库操作，并将处理结果传输到前端进行显示。

在具体的具体应用和使用流程如图5所示，进入平台后，可以选择按照次序对菜单栏、导航栏、导航栏子节点进行添加，并将导航栏子节点链接到URL，也可以对已有的菜单栏、导航栏和导航栏子节点的信息进行修改，在进行删除节点的操作时，若所删除的导航栏下有菜单栏，则无法删除成功，需要先对导航栏下的菜单栏进行删除，才可删除导航栏，删除菜单栏时，若菜单栏下有导航栏子节点，也无法删除成功，需先删除导航栏子节点，才可对菜单栏进行删除。

基于同一发明构思，本申请还提供了与实施例一中一种Web系统开发框架的构建方法对应的装置，详见实施例二。

实施例二

本实施例提供了一种Web系统开发框架的构建装置，请参见图6，该装置包括：

图标准备模块201，用于准备导航栏图标和菜单栏图标；

数据库创建模块202，用于在数据库中创建第一数据库表，用以存储导航栏信息和菜单栏信息，同时创建第二数据库表，用以实现用户管理功能、导航栏管理功能以及菜单栏管理功能；

后台架构实现模块203，用于基于SSM框架实现后台架构，具体包括对导航栏管理功能、菜单栏的管理功能及用户管理功能的实现；

前台架构实现模块204，用于基于前端开发技术实现前端架构；

前后端集成模块205，用于对后台架构与前端架构后端进行集成，实现前后端交互，从而构建Web系统开发框架。

在一种实施方式中，后台架构实现模块203具体用于：

在前端页面的相应位置创建菜单栏；

增加、删除、修改和查询。

在一种实施方式中，前台架构实现模块204具体用于：

采用HTML、CSS和jQuery技术开发前端架构。

由于本发明实施例二所介绍的装置，为实施本发明实施例一中Web系统开发框架的构建方法所采用的装置，故而基于本发明实施例一所介绍的方法，本领域所属人员能够了解该装置的具体结构及变形，故而在此不再赘述。凡是本发明实施例一的方法所采用的装置都属于本发明所欲保护的范围。

实施例三

基于同一发明构思，本申请还提供了一种计算机可读存储介质300，请参见图7，其上存储有计算机程序311，该程序被执行时实现实施例一所述的方法。

由于本发明实施例三所介绍的计算机可读存储介质为实施本发明实施例一中Web系统开发框架的构建方法所采用的计算机设备，故而基于本发明实施例一所介绍的方法，本领域所属人员能够了解该计算机可读存储介质的具体结构及变形，故而在此不再赘述。凡是本发明实施例一中方法所采用的计算机可读存储介质都属于本发明所欲保护的范围。

实施例四

基于同一发明构思，本申请还提供了一种计算机设备，请参见图8，包括存储401、处理器402及存储在存储器上并可在处理器上运行的计算机程序403，处理器402执行上述程序时实现实施例一中的方法。

由于本发明实施例三所介绍的计算机设备为实施本发明实施例一中Web系统开发框架的构建方法所采用的计算机设备，故而基于本发明实施例一所介绍的方法，本领域所属人员能够了解该计算机设备的具体结构及变形，故而在此不再赘述。凡是本发明实施例一中方法所采用的计算机设备都属于本发明所欲保护的范围。

本领域内的技术人员应明白，本发明的实施例可提供为方法、系统、或计算机程序产品。因此，本发明可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且，本发明可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。

本发明是参照根据本发明实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。

尽管已描述了本发明的优选实施例，但本领域内的技术人员一旦得知了基本创造性概念，则可对这些实施例做出另外的变更和修改。所以，所附权利要求意欲解释为包括优选实施例以及落入本发明范围的所有变更和修改。

显然，本领域的技术人员可以对本发明实施例进行各种改动和变型而不脱离本发明实施例的精神和范围。这样，倘若本发明实施例的这些修改和变型属于本发明权利要求及其等同技术的范围之内，则本发明也意图包含这些改动和变型在内。

Claims

1.一种Web系统开发框架的构建方法，其特征在于，包括：

准备导航栏图标和菜单栏图标；

基于前端开发技术实现前端架构；

2.如权利要求1所述的方法，其特征在于，预定义的导航栏信息包括导航栏和导航栏子节点。

3.如权利要求1所述的方法，其特征在于，基于SSM框架实现后台架构具体包括：

在前端页面的相应位置创建菜单栏；

4.如权利要求1所述的方法，其特征在于，导航栏管理功能和菜单栏管理功能包括如下的一种或多种：

增加、删除、修改和查询。

5.如权利要求1所述的方法，其特征在于，用户管理功能包括用户登录注册的业务逻辑。

6.如权利要求1所述的方法，其特征在于，基于前端开发技术实现前端架构具体包括：

采用HTML、CSS和jQuery技术开发前端架构。

7.一种Web系统开发框架的构建装置，其特征在于，包括：

图标准备模块，用于准备导航栏图标和菜单栏图标；

前台架构实现模块，用于基于前端开发技术实现前端架构；

8.如权利要求7所述的装置，其特征在于，数据库中存储的导航栏信息包括导航栏和导航栏子节点。

9.一种计算机可读存储介质，其上存储有计算机程序，其特征在于，该程序被执行时实现如权利要求1至6中任一项权利要求所述的方法。

10.一种计算机设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，其特征在于，所述处理器执行所述程序时实现如权利要求1至6中任一项权利要求所述的方法。