一种Web应用的实现方法和装置制造方法
【专利摘要】本发明实施方式提出了一种Web应用的实现方法和装置。方法包括：按照业务类型对Web应用的前台功能模块进行切分，以生成对应于各个前台功能模块的页面；按照业务逻辑分别在各个页面中切分出预定类型的组件，并且设置各个组件到统一总线的总线接口；利用各组件的总线接口在组件内和/或组件间传递数据。本发明实施方式可以更好地组织逻辑结构，并实现功能复用。
【专利说明】一种Web应用的实现方法和装置
【技术领域】
[0001]本发明实施方式涉及信息处理【技术领域】，更具体地，涉及一种Web应用的实现方法和装置。
【背景技术】
[0002]Web应用程序是由完成特定任务的各种Web组件(web components)构成的，并通过Web将服务展示给外界。在实际应用中，Web应用程序通常由多个Servlet、JSP页面、HTML文件以及图像文件等组成。所有这些组件相互协调为用户提供一组完整的服务.
[0003]模型一视图一控制器(MVC,Model View Controller)是一种Web应用软件设计典范，用于组织代码，实际上是一种业务逻辑和数据显示分离的方法。这个方法的假设前提是如果业务逻辑被聚集到一个部件里面，而且界面和用户围绕数据的交互能被改进和个性化定制而不需要重新编写业务逻辑。MVC被独特的发展起来用于映射传统的输入、处理和输出功能在一个逻辑的图形化用户界面的结构中。
[0004]模型一视图一层现器(MVP, Model View Presenter)模式从MVC模式演变而来。Presenter为层现器，负责逻辑的处理；Model为模型，提供数据；View为视图，负责显示。MVP中的View不直接使用Model,它们之间的通信是通过Presenter进行，交互会发生在Presenter内部。目前GWT (Google Web Toolkit)开发普遍使用MVP模式，MVP常用于基于GWT的Web系统，应用十分广泛。
[0005]MVP模式是一种通用的模式技术。然而，基于GWT的许多应用系统有着复杂的页面结构和模块结构，现有技术很难通过MVP技术较好地组织逻辑结构，并实现功能复用，这就会造成代码冗余。另外，许多应用系统存在大量复杂页面和页面、页面和模块、模块和模块之间的展示切换、事件交互、数据传递等功能，现在技术很难进行统一管理。
【发明内容】
[0006]本发明实施方式提出一种WEB应用的实现方法，以更好地组织逻辑结构，并实现功能复用。
[0007]本发明实施方式还提出了一种WEB应用的实现装置，以更好地组织逻辑结构，并实现功能复用。
[0008]本发明实施方式的具体方案如下:
[0009]一种Web应用的实现方法，该方法包括:
[0010]按照业务类型对Web应用的前台功能模块进行切分，以生成对应于各个前台功能模块的页面；
[0011]按照业务逻辑分别在各个页面中切分出预定类型的组件，并且设置各个组件到统一总线的总线接口；
[0012]利用各组件的总线接口在组件内和/或组件间传递数据。
[0013]一种Web应用的实现装置，包括功能切分单元、组件切分单元和数据传递单元，其中:
[0014]功能切分单元，用于按照业务类型对Web应用的前台功能模块进行切分，以生成对应于各个前台功能模块的页面；
[0015]组件切分单元，用于按照业务逻辑分别在各个页面中切分出预定类型的组件，并且设置各个组件到统一总线的总线接口 ；
[0016]数据传递单元，用于利用各组件的总线接口在组件内和/或组件间传递数据。
[0017]从上述技术方案可以看出，在本发明实施方式中，按照业务类型对Web应用的前台功能模块进行切分，以生成对应于各个前台功能模块的页面；按照业务逻辑分别在各个页面中切分出预定类型的组件，并且设置各个组件到统一总线的总线接口 ；利用各组件的总线接口在组件内和/或组件间传递数据。由此可见，本发明实施方式融合传统HTML页面开发和MVP模式的优点，提出一套基于页面(Page)的组件化机制以实现复杂的Web应用，可以更好地组织逻辑结构，并实现功能复用，尤其适用于GWT应用。
【专利附图】
【附图说明】
[0018]图1为根据本发明实施方式WEB应用的实现方法流程图；
[0019]图2为根据本发明实施方式组件切分示意图；
[0020]图3为根据本发明实施方式独占组件状态感知示意图；
[0021]图4为根据本发明实施方式WEB应用的实现装置结构图。
【具体实施方式】
[0022]为使本发明的目的、技术方案和优点更加清楚，下面结合附图对本发明作进一步的详细描述。
[0023]在本发明实施方式中，融合传统HTML页面开发和MVP模式的优点,提出一套基于页面(Page)的组件化机制来实现复杂的Web应用，尤其适用于GWT应用。
[0024]图1为根据本发明实施方式WEB应用的实现方法流程图。
[0025]如图1所示，该方法包括:
[0026]步骤101:按照业务类型对Web应用的前台功能模块进行切分，以生成对应于各个前台功能模块的页面。
[0027]示范性地，可以对Web管理系统的各种前台功能模块进行切分。Web管理系统可以具有两种模式，分别为C/s或B/S。C/S是客户端/服务器端程序，也就是说这类程序一般独立运行，而B/S就是浏览器端/服务器端应用程序，这类应用程序一般借助IE等浏览器来运行。在这里，将前台功能模块根据业务逻辑进行横向分割，切分成不同的页面。
[0028]比如，针对广告推广类型的Web应用，可以切分为广告管理、统计报告、工具箱、账户管理、财务管理等等页面。
[0029]在对前台功能模块进行切分时，由于针对业务类型的定义不同，可能会划分多种页面。
[0030]步骤102:按照业务逻辑分别在各个页面中切分出预定类型的组件，并且设置各个组件到统一总线的总线接口。
[0031]在这里，进一步在各个页面中细化业务逻辑，对页面进行纵向分割，将页面切分成不同的类型的组件，其中组件表示页面中具有独立业务功能的模块。
[0032]组件类型可以分为共享组件(SharedComponent)、独占组件(ExclusiveComponent)和叶子组件(SimpleCompnent)。组件化机制通过这三类组件的组合完成复杂的页面模块组织。独占组合或共享组件也可以称之为组合组件。
[0033]共享组件:包含若干个叶子组件，所有叶子组件都可以展示其状态，用于页面的构建和切分。
[0034]独占组件:包含若干个叶子组件，但只有唯一叶子组件展示其状态，用于感知组件的状态变化。
[0035]叶子组件:最小的组件单元，承载业务实体、用户Π和功能逻辑。每个叶子组件都有自己的状态(State)，用户操作会触发叶子组件的状态，组合组件通过感知所包含叶子组件的状态变更来实现页面和模块更新。叶子组件优选具有模型-视图-层现器模式。
[0036]图2为根据本发明实施方式组件切分示意图。
[0037]如图2所示，该页面200为某广告管理页签，实际上是一个Web页面，这个页面表示一个完整的顶级视图，类似于一个传统的HTML页面。
[0038]该页面200自身为一个共享组件，可以切分为不同类型的组件，如导航组件201为叶子组件，状态不可变；广告序列202和广告序列列表203都是独占组件，状态可变。
[0039]在图2中，在广告序列202中进一步包括多个叶子组件，分别为广告组2021、广告2022和关键词2023。而且，广告序列202和广告序列列表203是具有关联属性的独占组件。
[0040]各个组件都具有到统一的总线接口，从而便于在组件内和/或组件间传递数据。
[0041]步骤103:利用各组件的总线接口在组件内和/或组件间传递数据。
[0042]由于各个组件具有到统一的总线的接口，因此可以通过总线在组件内和/或组件间传递数据。
[0043]在一个实施方式中:
[0044]进一步设置同一共享组件之中各个独占组件之间的关联属性；
[0045]所述利用各组件的总线接口在组件内和/或组件间传递数据包括:
[0046]当独占组件中的叶子组件被刷新时，通过独占组件总线接口将刷新数据传送到总线.
[0047]总线将所述刷新数据传递到该同一共享组件之中与该独占组件相关联的其它独占组件。
[0048]在一个实施方式中:
[0049]进一步设置共享组件之间的关联属性；
[0050]所述利用各组件的总线接口在组件内和/或组件间传递数据包括:
[0051]当共享组件中的叶子组件被刷新时，通过共享组件总线接口将刷新数据传送到总线.-^4 ，
[0052]总线将所述刷新数据传递到与该共享组件相关联的其它共享组件。
[0053]在一个实施方式中:
[0054]进一步设置共享组件之间的关联属性；
[0055]所述利用各组件的总线接口在组件内和/或组件间传递数据包括:
[0056]当共享组件中的独占组件被刷新时，通过共享组件总线接口将刷新数据传送到总线.
[0057]总线将所述刷新数据传递到与该共享组件相关联的其它独占组件。
[0058]如，参照图2，当用户进行操作时，比如点击广告序列组件202内某一具体广告系列(比如广告组、广告或关键词)，总线感知到广告序列组件202状态变化，进行页面的局部状态更新(即更新广告序列组件内部详细数据)，而且广告序列组件202切换至新的叶子组件，显示特定的广告数据。
[0059]独占组件可以包含多个叶子组件，每个叶子组件的状态标记构成独占组件自身的状态标记集合，独占组件会在总线上注册这些状态标记。当用户在一个页面进行点击操作，系统会触发叶子组件的状态标记，总线可以感知状态标记，并当感知成功则进行页面局部更新，感知失败则不更新。
[0060]更具体地，每个叶子组件设置自己状态集合，而每个组合组件的状态集合是它包含的所有子组件的状态集合。当用户进行操作，系统会触发某个叶子组件的状态，组合组件会感知这个状态，如果该状态在状态集合中，则感知成功，组合组件显示触发的叶子组件状态，进行页面的局部更新。如果不在状态集合中，则感知失败，组合组件不进行处理，页面不更新。
[0061]图3为根据本发明实施方式独占组件状态感知示意图。
[0062]如图3所示，当独占组件的某个叶子组件状态发生变化，则首先共享组件获取该状态，并且将该状态通过组件传送到相关联的其它叶子组件中。
[0063]对于共享组件，实际上页面即是共享组件。共享组件的状态感知构成不同页面的展示切换。每个共享组件由独占组件或者叶子组件构成，独占组件或者叶子组件的状态标记构成共享组件的状态标记结合，共享组件会在总线上注册这些状态标记，并选择一个状态标记作为默认状态。
[0064]当用户由一个页面切换到另外一个页面时，总线会感知目标共享组件的默认状态，感知成功则进行页面局部更新，感知失败则不更新。
[0065]基于上述详细分析，本发明实施方式还提出一种WEB应用的实现装置。
[0066]图4为根据本发明实施方式WEB应用的实现装置结构图。
[0067]如图4所示，该装置包括:功能切分单元401、组件切分单元402和数据传递单元403，其中:
[0068]功能切分单元401，用于按照业务类型对Web应用的前台功能模块进行切分，以生成对应于各个前台功能模块的页面；
[0069]组件切分单元402，用于按照业务逻辑分别在各个页面中切分出预定类型的组件，并且设置各个组件到统一总线的总线接口；
[0070]数据传递单元403，用于利用各组件的总线接口在组件内和/或组件间传递数据。
[0071]在一个实施方式中:
[0072]组件切分单元402，用于将每个页面设置为共享组件，该共享组件包括独占组件和/或叶子组件，其中独占组件包括至少一个叶子组件。
[0073]在一个实施方式中:
[0074]组件切分单元402，进一步设置同一共享组件之中各个独占组件之间的关联属性；
[0075]数据传递单元403，用于当独占组件中的叶子组件被刷新时，通过独占组件总线接口将刷新数据传送到总线；总线将所述刷新数据传递到该同一共享组件之中与该独占组件相关联的其它独占组件。
[0076]在一个实施方式中:
[0077]组件切分单元402，进一步设置共享组件之间的关联属性；
[0078]数据传递单元403，用于当共享组件中的叶子组件被刷新时，通过共享组件总线接口将刷新数据传送到总线；总线将所述刷新数据传递到与该共享组件相关联的其它共享组件。
[0079]在一个实施方式中:
[0080]组件切分单元402，进一步设置共享组件之间的关联属性；
[0081]数据传递单元403，用于当共享组件中的独占组件被刷新时，通过共享组件总线接口将刷新数据传送到总线；
[0082]总线将所述刷新数据传递到与该共享组件相关联的其它独占组件。
[0083]用户可以在各种终端上运行Web应用，这些终端可以包括但是不局限于:功能手机、智能手机、掌上电脑、个人电脑(PC)、平板电脑或个人数字助理(PDA)，等等。
[0084]以上虽然详细罗列了终端的具体实例，本领域人员可以意识到，这些罗列仅是阐述目的，并不用于限定本发明实施方式的保护范围。
[0085]实际上，可以通过多种形式来具体实施本发明实施方式所提出的Web应用的实现方法和装置。
[0086]如，可以遵循一定规范的应用程序接口，将Web应用的实现方法编写为安装到个人电脑、移动终端等中的插件程序，也可以将其封装为应用程序以供用户自行下载使用。当编写为插件程序时，可以将其实施为OCX、dll、cab等多种插件形式。也可以通过Flash插件、RealPlayer插件、MMS插件、MIDI五线谱插件、ActiveX插件等具体技术来实施本发明实施方式所提出的Web应用的实现方法。
[0087]可以通过指令或指令集存储的储存方式将本发明实施方式所提出的Web应用的实现方法存储在各种存储介质上。这些存储介质包括但是不局限于:软盘、光盘、DVD、硬盘、闪存、U盘、CF卡、SD卡、MMC卡、SM卡、记忆棒(Memory Stick)、xD卡等。
[0088]另外，还可以将本发明实施方式所提出的Web应用的实现方法应用到基于闪存(Nand flash)的存储介质中，比如U盘、CF卡、SD卡、SDHC卡、MMC卡、SM卡、记忆棒、xD卡坐寸。
[0089]综上所述，在本发明实施方式中，按照业务类型对Web应用的前台功能模块进行切分，以生成对应于各个前台功能模块的页面；按照业务逻辑分别在各个页面中切分出预定类型的组件，并且设置各个组件到统一总线的总线接口 ；利用各组件的总线接口在组件内和/或组件间传递数据。由此可见，本发明实施方式融合传统HTML页面开发和MVP模式的优点，提出一套基于页面(Page)的组件化机制来实现复杂的Web应用，可以更好地组织逻辑结构，并实现功能复用，尤其适用于GWT应用。
[0090]以上所述，仅为本发明的较佳实施例而已，并非用于限定本发明的保护范围。凡在本发明的精神和原则之内，所作的任何修改、等同替换、改进等，均应包含在本发明的保护范围之内。
【权利要求】
1.一种Web应用的实现方法，其特征在于，该方法包括: 按照业务类型对Web应用的前台功能模块进行切分，以生成对应于各个前台功能模块的页面； 按照业务逻辑分别在各个页面中切分出预定类型的组件，并且设置各个组件到统一总线的总线接口； 利用各组件的总线接口在组件内和/或组件间传递数据。
2.根据权利要求1所述的Web应用的实现方法，其特征在于，所述按照业务逻辑分别在各个页面中切分出预定类型的组件包括: 将每个页面设置为共享组件，该共享组件包括独占组件和/或叶子组件，其中独占组件包括至少一个叶子组件。
3.根据权利要求2所述的Web应用的实现方法，其特征在于，所述叶子组件具有模型-视图-层现器模式。
4.根据权利要求2所述的Web应用的实现方法，其特征在于，进一步设置同一共享组件之中各个独占组件之间的关联属性； 所述利用各组件的总线接口在组件内和/或组件间传递数据包括: 当独占组件中的叶子组件被刷新时，通过独占组件总线接口将刷新数据传送到总线； 总线将所述刷新数据传递到该同一共享组件之中与该独占组件相关联的其它独占组件。
5.根据权利要求2所述的Web应用的实现方法，其特征在于，进一步设置共享组件之间的关联属性； 所述利用各组件的总线接口在组件内和/或组件间传递数据包括: 当共享组件中的叶子组件被刷新时，通过共享组件总线接口将刷新数据传送到总线； 总线将所述刷新数据传递到与该共享组件相关联的其它共享组件。
6.根据权利要求2所述的Web应用的实现方法，其特征在于，进一步设置共享组件之间的关联属性； 所述利用各组件的总线接口在组件内和/或组件间传递数据包括: 当共享组件中的独占组件被刷新时，通过共享组件总线接口将刷新数据传送到总线； 总线将所述刷新数据传递到与该共享组件相关联的其它独占组件。
7.—种Web应用的实现装置，其特征在于，包括功能切分单元、组件切分单元和数据传递单元，其中: 功能切分单元，用于按照业务类型对Web应用的前台功能模块进行切分，以生成对应于各个前台功能模块的页面； 组件切分单元，用于按照业务逻辑分别在各个页面中切分出预定类型的组件，并且设置各个组件到统一总线的总线接口； 数据传递单元，用于利用各组件的总线接口在组件内和/或组件间传递数据。
8.根据权利要求7所述的Web应用的实现装置，其特征在于， 组件切分单元，用于将每个页面设置为共享组件，该共享组件包括独占组件和/或叶子组件，其中独占组件包括至少一个叶子组件。
9.根据权利要求8所述的Web应用的实现装置，其特征在于，组件切分单元，进一步设置同一共享组件之中各个独占组件之间的关联属性； 数据传递单元，用于当独占组件中的叶子组件被刷新时，通过独占组件总线接口将刷新数据传送到总线；总线将所述刷新数据传递到该同一共享组件之中与该独占组件相关联的其它独占组件。
10.根据权利要求8所述的Web应用的实现装置，其特征在于，组件切分单元，进一步设置共享组件之间的关联属性； 数据传递单元，用于当共享组件中的叶子组件被刷新时，通过共享组件总线接口将刷新数据传送到总线；总线将所述刷新数据传递到与该共享组件相关联的其它共享组件。
11.根据权利要求8所述的Web应用的实现装置，其特征在于，组件切分单元，进一步设置共享组件之间的关联属性； 数据传递单元，用于当共享组件中的独占组件被刷新时，通过共享组件总线接口将刷新数据传送到总线； 总线将所述刷新数据传递到与该共享组件相关联的其它独占组件。
【文档编号】G06F17/30GK104346333SQ201310311745
【公开日】2015年2月11日 申请日期:2013年7月23日 优先权日:2013年7月23日
【发明者】唐少刚, 陈俊, 李兆福, 季成城, 章国瑾 申请人:腾讯科技（深圳）有限公司