CN109783083A - Web应用开发方法及其系统 - Google Patents

Abstract

本发明提供WEB应用开发方法及其系统，方法包括：通过在适配层分别定义统一接口和构建通用组件库，搭建出应用框架层，其中，所述通用组件库集成有两个以上组件；依据当前业务功能，分别从应用框架层中选取对应的统一接口和对应的组件；依据所选取的统一接口和组件，通过管理框架编写对应当前业务功能的业务逻辑；编译部署所述管理框架、所述业务逻辑和所选取的组件，生成一对应当前业务功能的应用。本发明能实现任一具体业务应用的高效开发；同时又易于针对组件进行维护。

Description

WEB应用开发方法及其系统

技术领域

本发明涉及WEB前端应用开发领域，具体涉及WEB应用开发方法及其系统。

背景技术

互联网的飞速发展，敏捷开发与容器技术的成熟，促进了服务端微服务架构的诞生。服务端微服务架构风格是一种使用一套小服务来开发单个应用的方式途径，每个小服务都是基于业务能力构建并可以通过自动化独立部署。相对的，为了使业务能力独立，WEB前端应用需要与服务端微服务一一对应。

由于不同业务的WEB前端应用相互独立，开发者不得不构建多个应用用来实现对应的业务功能。为了加快开发效率，现有的WEB前端应用开发技术方案是开发一套通用APP组件，然后用一套管理框架来拼装并管理通用组件，其具体结构组成如图1所示。比如开发一个微博前端，可以选择列表组件、详情组件、国际化语言组件等与管理框架进行组合。组件化方案使得开发者免去了在多个应用中编写大量的相同功能代码，只需要根据业务适当的选择所需要的组件并在其基础上开发业务功能代码。

但是，微服务架构使得一个系统会被拆分出成百上千个小服务，对应的WEB前端应用就会有成百上千个，即使是组件拼装也无法满足开发效率上的要求，且组件拼装存在维护上的困难，当某个组件出现BUG需要修复或需要增强功能时，需要将所有涉及到该组件的应用全部修复一次，特别是管理框架出现BUG或者需要增强功能，所有的应用都需要进行一次修复，人力物力耗费巨大。进而言之，即存在以下缺点：1、面对成百上千的WEB端应用，组件拼装方案存在开发效率问题；2、当通用组件出现改动时，需要对大量的相关WEB端应用进行人工修改工作，不易于维护。因此需要一套可以应对上述情况的WEB应用开发方法。

发明内容

本发明所要解决的技术问题是：提供一种WEB应用开发方法及其系统，能显著提高开发效率，且易于维护。

为了解决上述技术问题，本发明采用的技术方案为：

WEB应用开发方法，包括：

通过在适配层分别定义统一接口和构建通用组件库，搭建出应用框架层，其中，所述通用组件库集成有两个以上组件；

依据当前业务功能，分别从应用框架层中选取对应的统一接口和对应的组件；

依据所选取的统一接口和组件，通过管理框架编写对应当前业务功能的业务逻辑；

编译部署所述管理框架、所述业务逻辑和所选取的组件，生成一对应当前业务功能的应用。

本发明提供的另一个技术方案为：

WEB应用模块化开发系统，包括应用框架层和定制化模块层；

所述应用框架层包括统一接口定义模块和通用组件库模块；

所述统一接口定义模块，通过在适配层定义统一接口获取；

所述通用组件库模块，通过在适配层集成有两个以上组件构建得到；

所述定制化模块层搭建有管理框架；

所述定制化模块层，用于依据当前业务功能，分别从应用框架层中选取对应的统一接口和对应的组件；以及依据所选取的统一接口和组件，通过管理框架编写对应当前业务功能的业务逻辑；以及编译部署所述管理框架、所述业务逻辑和所选取的组件，生成一对应当前业务功能的应用。

本发明的有益效果在于：本发明将WEB前端应用拆分成应用框架层和定制化模块层；通过将现有的公共模块集成到应用框架层中，由应用框架层提供统一的接入标准，具体的业务应用按照应用框架层提供的标准接入和所选取的组件来定制业务逻辑。由此使得具体的业务功能无需关心通用组件的集成，在后续其他业务应用的开发阶段，无需再重复开发具体组件，而能实现通用组件的复用，大大提高开发效率；同时，由于本发明的业务逻辑和应用框架层是分离的，只有在发布时才进行集成编译，因此保证了应用框架层的独立性，可以针对应用框架层进行单独维护，使得维护工作变得更加独立和简单。

附图说明

图1为现有技术的web应用开发系统框架示意图；

图2为本申请实施例的web应用开发系统框架示意图；

图3为本申请实施例的web应用开发方法的流程示意图。

具体实施方式

为详细说明本发明的技术内容、所实现目的及效果，以下结合实施方式并配合附图予以说明。

本发明最关键的构思在于：本发明将WEB前端应用拆分成应用框架层和定制化模块层；将现有的公共模块集成到应用框架层中，由应用框架层提供统一的接入标准，具体的业务应用按照应用框架层提供的标准接入和所选取的组件来定制业务逻辑。

本发明涉及的技术术语解释:

请参照图2以及图3，本发明提供WEB应用开发方法，包括：

通过在适配层分别定义统一接口和构建通用组件库，搭建出应用框架层，其中，所述通用组件库集成有两个以上组件；

依据当前业务功能，分别从应用框架层中选取对应的统一接口和对应的组件；

依据所选取的统一接口和组件，通过管理框架编写对应当前业务功能的业务逻辑；

编译部署所述管理框架、所述业务逻辑和所选取的组件，生成一对应当前业务功能的应用。

从上述描述可知，本发明的有益效果在于：本发明将一个WEB前端应用拆分成应用框架层与定制化模块层，将公共模块集成进应用框架层，由应用框架层提供接入标准，具体的业务应用按照应用框架层提供的标准接入定制化的业务代码，这样可以使得具体的业务无需关心通用功能的集成，例如其中一个通用组件“国际化语言组件”，将其集成在应用框架层的通用组件库中，则后续无论开发微博还是论坛，还是其他应用，都无需再做重复劳动开发上述组件，大大节约了劳动量，同时提高开发效率；当一个定制化业务开发完毕后，如微博页面，再通过编译脚本自动将其与管理框架集成编译后发布，因应用框架代码分开维护，这样定制化业务开发就无法改变应用框架代码，从而保证了应用框架层的唯一性，使得后续维护变得更加独立与简单。

进一步的，在适配层定义的统一接口包括两个以上分别对应不同业务功能的统一接口。

由上述描述可知，对应不同的业务功能需求，通过尽可能配置多种类型的标准接口供选择，提高可开发的具体业务应用的类型。

进一步的，所述通用组件库中集成的是通用组件；

所述通用组件库集成有国际化语言组件、网络请求组件、提示框组件、列表组件、详情描述组件和HTTP通信组件。

由上述描述可知，通过丰富通用组件库的组成，能支持开发更多类型的具体业务应用，从而提高本发明web应用开发方法的实用性。

本发明提供的另一个技术方案为：

WEB应用模块化开发系统，包括应用框架层和定制化模块层；

所述应用框架层包括统一接口定义模块和通用组件库模块；

所述统一接口定义模块，通过在适配层定义统一接口获取；

所述通用组件库模块，通过在适配层集成有两个以上组件构建得到；

所述定制化模块层搭建有管理框架；

所述定制化模块层，用于依据当前业务功能，分别从应用框架层中选取对应的统一接口和对应的组件；以及依据所选取的统一接口和组件，通过管理框架编写对应当前业务功能的业务逻辑；以及编译部署所述管理框架、所述业务逻辑和所选取的组件，生成一对应当前业务功能的应用。

本发明提供的上述技术方案的有益效果为：将WEB前端应用拆分成应用框架层和定制化模块层；通过将现有的公共模块集成到应用框架层中，由应用框架层提供统一的接入标准，具体的业务应用按照应用框架层提供的标准接入和所选取的组件来定制业务逻辑。由此使得具体的业务功能无需关心通用组件的集成，在后续其他业务应用的开发阶段，无需再重复开发具体组件，大大提高开发效率；同时，由于本发明的业务逻辑和应用框架层是分离的，只有在发布时才进行集成编译，因此保证了应用框架层的独立性，可以针对应用框架层进行单独维护，使得维护工作变得更加独立和简单。

进一步地，所述统一接口定义模块在适配层定义的统一接口的数量为两个以上；两个以上的统一接口分别对应不同业务功能。

进一步地，所述通用组件库模块中集成的是通用组件；

所述通用组件库集成有国际化语言组件、网络请求组件、提示框组件、列表组件、详情描述组件和HTTP通信组件。

实施例一

请参照图2，本实施例提供一种WEB应用开发的系统，能基于该系统实现高效开发WEB具体应用，且可实现高效复用，大大降低人力和成本；进一步地，在通用组件出现改动时，无需再对大量的相关WEB端应用进行人工维护，大大提高了维护的便捷性。

如图2所示，本实施例的系统包括应用框架层和定制化模块层；

其中，所述应用框架层包括：统一接口定义模块和通用组件库模块；

具体的，所述统一接口定义模块中包含两个以上的统一接口；更具体的，统一接口的编辑(删除、新增或修改)，均在适配层进行定义实现，可以根据业务需要制定对应的接入标准(统一接口)。

统一接口定义模块中包含的各个统一接口用于实现对应具体业务功能的接入。例如，业务需要国际化语言能力，则可以预先通过统一接口定义模块定义好对应的国际化语言接入标准，而后由应用框架层提供该接入标准(接口)来实现国家化语言能力功能的接入，以中英文为例，英文放入en.json文件、中文放入zh.json。

具体的，所述通用组件库模块中集成有两个以上的通用组件，例如国际化语言组件、网络请求组件、提示框组件、列表组件、详情描述组件、HTTP通信组件等其他的通用组件。同样的，可以依据业务需求预先在适配层中对通用组件库中进行编辑(具体包括删除具体通用组件、新增通用组件或修改原有通用组件等操作)。

已知，在应用框架层中配置好了各种标准接入和各种通用组件，作为基础数据支持，提供公共业务能力(通用组件)和制定接入标准。

而本实施例的系统还另外配置有独立于应用框架层的定制化模块层，其用于定制化具体应用；具体用于通过与应用框架层的交互，将当前定制中的业务应用所需的组件和接口与在定制化模块层编译的业务逻辑进行编译部署，完成业务应用的开发。在本实施例中，下述的当前业务功能对应的是当前定制中的具体应用的功能。

具体的，本实施例的定制化模块层中搭建有管理框架。

所述定制化模块层，用于依据当前业务功能，分别从应用框架层的统一接口定义模块中选取对应的统一接口，从应用框架层的通用组件库中选取对应的组件；

还用于依据从应用框架层中选取的统一接口和组件，编写对应当前业务功能的业务逻辑；

还用于编译部署所述管理框架、所述业务逻辑和所选取的组件，生成一对应当前业务功能的应用。

上述定制化模块层的作用只是以一具体业务应用的开发为例进行说明，对于其他不同功能的业务应用开发，其做法完全一致，只是所选取的接口和具体组件不同。

本实施例体提供的系统，应用框架层将WEB前端应用拆分成相互独立的应用框架层和定制化模块层；由应用框架层提供接口和组件；由定制化模块层进行自动编译部署发布，完成具体应用的开发过程。由此使得具体的业务功能无需关心通用组件的集成，在后续其他业务应用的开发阶段，无需再重复开发具体组件，而能实现通用组件的复用，大大提高开发效率；同时，由于业务逻辑和应用框架层是分离的，只有在发布时才进行集成编译，因此保证了应用框架层的独立性，可以针对应用框架层进行单独维护，使得维护工作变得更加独立和简单。

通过本实施例提供的系统，能实现任一具体业务应用的高效开发；同时又易于针对组件进行维护。

实施例二

请参照图2和图3，本实施例基于实施例一提供的WEB应用模块化开发系统，提供一种WEB应用模块化开发方法：

一、搭建应用框架层。

具体的，由以下步骤实现：

1.1、在适配层定义两个以上且对应不同业务功能的统一接口；

1.2、在适配层构建通用组件库，所述通用组件库中包括两个以上的通用组件。通用组件库中所包含的通用组件同样依据业务需求配置。其中，对应目前通用的业务功能，可以在所述通用组件库中配置有国际化语言组件、网络请求组件、提示框组件、列表组件、详情描述组件和HTTP通信组件等通用组件。

二、定制一具体业务应用，该应用对应一具体业务功能。

2.1、依据当前业务功能，从应用框架层中选取所需的统一接口；

2.2、依据当前业务功能，从通用组件库中选取所需的组件；

2.3、依据所选取的统一接口和组件，通过管理框架编写对应当前业务功能的业务逻辑；

2.4、编译部署所述管理框架、所述业务逻辑和所选取的组件，生成一对应当前业务功能的应用。具体的，即编写一套集成编译脚本，将定制化模块层与应用框架层集成编译并发布。

例如需要开发一个与服务端微服务对应的WEB前端应用时，如微博应用，只需要编写定制化的微博业务界面，之后使用脚本自动将应用框架层模块、通用组件库模块集成编译并发布，即可产生一个完整的WEB前端应用。

另外，其他业务应用的开发过程，其原理与上述2.1-2.4的步骤一致，区别在于不同业务应用所需的接口和组件不同。

实施例三

本实施例对应实施例二，提供一具体实例，在本实例中，基础能力适配层对应上述的应用框架层；业务管理对接层对应上述的定制化模块层。

本实例的WEB应用模块化开发方法包括：

1.首先定义基础能力适配层的统一的接口，类似搭建框架；

2.基础能力适配层的其他基础能力根据之前定义的接口以及具体业务需求来开发提供相应基础能力。比如：对于开发微博应用，它需要网络加载最新的微博消息，就开发一个和业务无关的纯粹的对外访问网络能力。

3.业务管理对接层对应业务如微博界面，业务管理对接层使用基础能力适配层提供的能力，如网络请求使用的是统一定义的接口，不用去关心底层是由socket提供的长连接还是http请求。

4.业务管理对接层、基础能力(组件)和基础能力适配(接口)分离存放，编写一套集成编译脚本，发布时将它们集成编译发布出去。

5.当再次开发类似微博这样应用时，可直接选择它们共通的基础能力使用，然后进行3和4步骤即可，如果已有基础能力(组件)没有所需的，就样重新开发一个基础能力(组件)，如需要国际化能力、录音输入能力等就根据适配层接口定义开发对应能力接入基础能力来提供应用使用。

实施例四

本实施例对应上述实施例一至实施例三，提供一具体运用场景：

以开发国际化微博应用为例：

首先，从通用组件库中选择出该应用所需的列表组件、详情描述组件、国际化语言组件以及HTTP通信组件后；

然后在定制化模块层中编写业务逻辑，如利用HTTP通信组件向服务端微服务请求数据并使用列表组件进行渲染展示；

最后将管理框架、通用组件(上述从通用组件库中选取的组件)与业务逻辑代码一起编译部署完成国际化微博应用这个应用的开发。

若需要再开发一个国际化论坛应用，只需重复上述开发步骤即可。

综上所述，本发明提供的WEB应用模块化开发方法及其系统，针对具体的业务功能，从通用组件库中选择需要的组件，在其基础上开发对应的业务逻辑后部署发布即可；不仅能实现通用组件的复用，显著提高应用开发的效率；而且将组件与逻辑分离，使得针对组件的维护独立而简单。本发明能实现任一具体业务应用的高效开发；同时又易于针对组件进行维护。

以上所述仅为本发明的实施例，并非因此限制本发明的专利范围，凡是利用本发明说明书及附图内容所作的等同变换，或直接或间接运用在相关的技术领域，均同理包括在本发明的专利保护范围内。

Claims (6)

1.WEB应用开发方法，其特征在于，包括：

通过在适配层分别定义统一接口和构建通用组件库，搭建出应用框架层，其中，所述通用组件库集成有两个以上组件；

依据当前业务功能，分别从应用框架层中选取对应的统一接口和对应的组件；

依据所选取的统一接口和组件，通过管理框架编写对应当前业务功能的业务逻辑；

编译部署所述管理框架、所述业务逻辑和所选取的组件，生成一对应当前业务功能的应用。

2.如权利要求1所述的WEB应用开发方法，其特征在于，在适配层定义的统一接口包括两个以上分别对应不同业务功能的统一接口。

3.如权利要求1所述的WEB应用开发方法，其特征在于，所述通用组件库中集成的是通用组件；

所述通用组件库集成有国际化语言组件、网络请求组件、提示框组件、列表组件、详情描述组件和HTTP通信组件。

4.WEB应用模块化开发系统，其特征在于，包括应用框架层和定制化模块层；

所述应用框架层包括统一接口定义模块和通用组件库模块；

所述统一接口定义模块，通过在适配层定义统一接口获取；

所述通用组件库模块，通过在适配层集成有两个以上组件构建得到；

所述定制化模块层搭建有管理框架；

所述定制化模块层，用于依据当前业务功能，分别从应用框架层中选取对应的统一接口和对应的组件；以及依据所选取的统一接口和组件，通过管理框架编写对应当前业务功能的业务逻辑；以及编译部署所述管理框架、所述业务逻辑和所选取的组件，生成一对应当前业务功能的应用。

5.如权利要求4所述的WEB应用模块化开发系统，其特征在于，所述统一接口定义模块在适配层定义的统一接口的数量为两个以上；两个以上的统一接口分别对应不同业务功能。

6.如权利要求4所述的WEB应用模块化开发系统，其特征在于，所述通用组件库模块中集成的是通用组件；

所述通用组件库集成有国际化语言组件、网络请求组件、提示框组件、列表组件、详情描述组件和HTTP通信组件。