CN103309806B

CN103309806B - 一种快速开发测试的装置及方法

Info

Publication number: CN103309806B
Application number: CN201310161581.2A
Authority: CN
Inventors: 林丽丽; 武剑锋; 王泊; 张涛; 万阳; 李沁; 白硕
Original assignee: Shanghai Stock Exchange
Current assignee: Shanghai Stock Exchange Technology Co., Ltd.
Priority date: 2013-05-03
Filing date: 2013-05-03
Publication date: 2016-06-01
Anticipated expiration: 2033-05-03
Also published as: CN103309806A

Abstract

本发明提供一种快速开发测试的装置及方法，快速开发测试的装置包括开发配置模块、结构加载模块、数据操作模块和网页渲染模块。其中开发配置模块用于生成页面代码和配置数据源，结构加载模块能够将所述页面代码解析成显示部分和数据信息部分，数据操作模块能根据页面代码与数据源的关联关系生成数据操作代码，能将数据信息部分中的数据存储到数据源中，或者将数据源中的数据填入数据信息部分中。网页渲染模块用于生成网页。各模块生成的代码均不需要编译，节省了时间。开发测试都可以在同一框架下进行，避免了系统迁移过程中可能碰到的各种问题。并且各模块都工作在框架的运行时状态下，所以对代码的变动可以实时地显示。

Description

一种快速开发测试的装置及方法

技术领域

本发明涉及一种快速开发测试的装置及方法，特别是涉及一种BS架构（浏览器/服务器架构）下，系统运行时可视化实时快速开发测试的装置及方法。

背景技术

目前，对于BS架构的项目，开发测试多采用开发、测试相分离的模式，由程序员开发页面，并用高级语言开发后台的处理模块，开发完成后，需要将页面、处理模块等进行编译、部署到测试环境中才能进行测试，即使是代码部分的变动极小，也需要对整个项目进行重新编译并重新部署，才能集成测试。这种开发测试方式存在一个问题，就是对于代码量较大的项目而言，整个项目的编译、部署其时间花费非常可观，并且由于开发测试环境分离，在测试时还会遇到代码迁移的问题，大大增加了开发测试人员调试的时间，所以这样的开发测试方法不够高效。

发明内容

鉴于以上所述现有技术的缺点，本发明的目的在于提供一种快速开发测试的装置和方法，用于解决现有技术中开发测试效率不高问题。

为实现上述目的及其他相关目的，本发明提供一种快速开发测试的装置，其包括开发配置模块、结构加载模块、数据操作模块和网页渲染模块。其中开发配置模块用于生成页面代码和配置数据源，并使得生成的页面代码与数据源关联（绑定），结构加载模块能够将所述页面代码解析成显示部分和数据信息部分，数据操作模块能根据页面代码与数据源的关联关系生成数据操作代码，能将数据信息部分中的数据存储到数据源中，或者将数据源中的数据填入数据信息部分中。网页渲染模块能根据所述的显示部分和所述的数据信息部分生成网页。其中，各模块生成的代码均能被快速开发装置直接解析，不需要编译。

优选地，上述开发配置模块利用操作可视化控件的方式生成页面代码并配置数据源。

更优选地，上述装置作为web应用事先被部署到服务器，从而各模块的均在上述装置运行时状态下工作。

更优选地，上述装置中，网页渲染模块采用异步渲染方式。

如上所述，本发明的快速开发测试的装置，其开发配置模块生成的页面代码和数据操作模块生成的数据访问代码均能被装置直接解析，因此不需要编译，对于代码量较多的项目而言，大大节省了时间。并且，由于开发测试均在上述装置中完成，避免了环境迁移中可能出现的问题。

另外，根据本发明的优选实施例，开发配置模块利用可视化控件生成页面代码和配置数据源，简化了开发的难度并进一步节省时间。

另外，根据本发明更优选的实施例，装置被作为web应用事先部署到服务器，对各模块的操作都在运行时完成，所以对系统的修改是可以实时生效的。

另外，根据本发明更优选的实施例，采用异步渲染方式，能获得更好的用户体验。

本发明还提供一种快速开发测试的方法，其包括生成页面代码并配置数据源，使所述页面代码与所述数据源关联，然后将页面代码解析成和数据信息部分，接着将所述数据信息部分中的数据存储到所述数据源中，或者将所述数据源中的数据填入所述数据信息部分，最后根据所述显示部分和数据信息部分生成网页。

附图说明

图1显示了本发明快速开发测试装置实施例的逻辑结构图。

图2显示了本发明快速开发测试方法实施例的流程图。

图3显示了采用了异步渲染方式的本发明快速开发测试方法实施例流程图。

具体实施方式

以下通过特定的具体实施例说明本发明的实施方式，本领域技术人员可由本说明书所揭露的内容轻易地了解本发明的其他优点与功效。本发明还可以通过另外不同的具体实施方式加以实施或应用，本说明书中的各项细节也可以基于不同观点与应用，在没有背离本发明的精神下进行各种修饰或改变。

请参阅图1。需要说明的是，本实施例中所提供的图示仅以示意方式说明本发明的基本构想，遂图式中仅显示与本发明中有关的组件而非按照实际实施时的组件数目绘制，其实际实施时各组件的数量及比例可随意的改变，且其组件布局型态也可能更为复杂。

图1中。标记1表示本发明的快速开发测试装置实施例（以下简称框架1），框架1可以以web应用的方式实现，也可以以桌面应用的方式实现。本例中，框架1以web应用的方式实现。标记2代表开发测试环境，其可以表示任何适合于框架1运行的平台，比如，如果框架1以桌面应用方式实现，则标记2代表操作系统；如果框架1以web应用方式实现，则标记2代表web应用服务器。本例中，标记2可以是任何一种web应用服务器，比如Tomcat、weblogic等。标记3、4、5和6分别表示框架1的开发配置模块、结构解析模块、数据操作模块和网页渲染模块，框架1作为web应用，运行在环境2中。下面对框架1的各模块做详细介绍。

开发配置模块3用于生成页面代码和配置数据源，并且将数据源与页面代码关联或绑定。本实施例中，配置模块3集成了网页可视化开发和数据库的可视化开发技术，网页可视化开发和数据库可视化开发技术为本领域技术人员所公知。开发人员通过拖拽可视化控件自动生成页面代码和数据源配置代码，使得页面代码与数据源关联或绑定，且这些生成的代码可以在运行时直接被框架1解析，无需编译。

框架上单个控件的源代码设计成包含三个部分，分别是样式（S）、控件（C）和数据源（D），其中S表示控件所在的页面布局，例如可以是DIV或Table等；C表示该控件以及其属性，属性可以是控件ID，宽度，高度，样式，只读，隐藏等等；D表示该控件与数据源的关联关系或者叫绑定关系，通过D，就可以知道该控件绑定的是数据库的什么表的什么字段（集）。由于一个页面是由控件构成，所以整个页面的相关信息可以表示为{SCD₁,SCD₂,SCD₃,…SCD_N}。生成的页面代码可以存储到后台数据库，该数据库可以包含如下字段：

页面id	页面代码	…
			id	{SCD₁,SCD₂,SCD₃,…SCD_N}	…

其中页面id是页面的唯一标识，页面代码中，SCD_N表示组成该页面的各个控件的代码。

为了提高扩展性，模块3除了提供可视化控件之外，还可以提供控件开发接口，用户可以根据自己的需要对提供的控件进行编辑，甚至开发自己的控件。

结构加载模块4用于对页面代码进行解析，将页面代码解析成用于显示的部分S、C和数据信息部分D。

当框架1收到来自浏览器对某个页面的访问请求时，由模块4先根据页面id可以得到该页面的页面代码，也就是{SCD₁,SCD₂,SCD₃,…SCD_N}部分，并对其解析，解析出用于显示的S、C部分，转换为标准化网页代码（比如HTML），这样，整个网页的布局和控件已经可以通过浏览器直接查看了。而解析出来的数据信息部分D需要数据操作模块进行处理。

数据操作模块5用于生成数据访问代码，从数据库里获取数据显示到网页中，或者将网页上的数据保存到数据库中。

由于数据信息部分D部分表示的是各控件与数据源的关联关系，数据操作模块就可以根据数据信息部分D生成数据操作语言，从而将需要显示的数据从数据库查询出来或者将需要存储的数据写入数据库中。以数据显示为例，数据操作模块将根据数据信息部分D生成数据查询语句，从各控件绑定的数据库表、字段里获取出各控件对应的数据，写回到数据信息部分D中。对于数据的其它操作，比如编辑、添加、删除，原理与数据显示类似，只是生成的数据操作语句不同。

网页渲染模块6用于根据结构加载模块4生成的网页代码和数据操作模块5处理后的数据信息部分D生成最终的显示网页。由于数据操作所用的时间通常多于结构加载模块生成网页代码的时间，为了提高用户体验，网页渲染模块可以采用异步渲染的方式，即结构加载模块4生成网页代码后，网页渲染模块6先根据网页代码渲染网页中静态的部分；等数据操作模块处理完数据信息部分D后，网页渲染模块再根据数据信息部分D渲染网页中动态的部分。

从上述介绍中可以理解，由于各模块生成的代码都可以被框架1直接解析，所以整个开发测试过程不需要编译代码，大大节省了时间；另外，由于开发测试环境都在框架1中进行，避免了迁移中出现的问题；再者，由于各模块都在框架1的运行时状态下工作，所以对代码的修改都是实时生效的。

为使本发明原理更容易理解，下面结合图2介绍如何利用框架1开发、测试一个简单的人员信息管理系统，该系统包括人员信息的显示、编辑页面，使用关系型数据库，并包含people(id,name,age，sex，school_id)及school(id,s_name,address)两张数据库表。

开发时，开发人员可以利用数据库可视化开发控件配置数据库，开发人员再利用页面可视化开发控件，创建代表人员名称、年龄等的控件，并用这些控件搭出人员信息显示、编辑页面。并将各控件与数据库中对应的表、字段关联起来。配置数据库和用控件搭建页面的操作没有选择顺序限制。

框架1调用开发配置模块3，根据开发人员对数据库可视化开发控件的操作自动生成数据定义语言（DDL）完成people和school表的创建并将people表的school_id与school表的id字段关联起来。

框架1调用开发配置模块3根据开发人员对页面可视化控件的操作，及开发人员把各控件与数据库关联的操作，生成各控件的源代码如下：

上面的隐藏域是记录页面属性信息的控件。本例中，由于用户信息显示页面和编辑页面的控件相同，所以只需要制作一张页面即可，隐藏域控件的“页面功能”部分代表本页面是编辑页面还是显示页面。当“页面功能=编辑”时，本页面的输入框是可输入的，输入完成后，保存页面，输入框里的输入信息将保存到数据库的对应表中去。当“页面功能=显示”，那就根据控件代码中数据源绑定部分，创建数据查询语句将数据从数据库里搜索出来，并显示到页面上。这时，输入框自动转化为只读框。

需要说明的是，控件源代码具体包括哪些内容，是框架1提供的。用户可以根据需求，通过框架的控件开发接口对控件属性进行自定义。

根据各控件源代码，框架1调用模块3自动生成整个页面的源代码，本例中，页面的源代码保存在关系数据库里，一张页面作为一条记录，内容如下：

容易理解的是，页面源代码的存储方式有多种变化，比如以普通文本、XML文件，或者分表存储等等，本领域技术人员很容易根据需要选择合适的变化。

至此，页面的开发已经完成。并且由于开发过程中，框架1是运行时状态，开发生成的源代码被实时地保存到系统中，并且可以实时生效。

测试显示功时，用户向框架1发送页面请求，请求中包含有页面id关联的信息，该信息可以是页面id本身，也可以是计算页面id的条件。

框架1调用结构加载模块4，根据请求中的页面id信息查出页面代码，解析出其中的S、C和D部分，并且将S和C部分转换成HTML代码。

框架1调用数据操作模块5，根据解析出的D部分，自动生成数据库查询语句，从数据库中查出各控件对应的数据。本例中，查询得到一个字符串，内容如下：

“id=1006,value=张三|||id=1007,value=20|||id=1008,value=某学校|||id=1009,value=某地址”

这里“|||”指分隔符，实际应用中可以自定义为任何合适的符号。每个部分的id号与其所在的控件对应

最后，框架1调用网页渲染模块6根据生成的HTML语言和查出的数据，生成可供显示的网页。

网页渲染模块6也可以采用异步渲染的方式，当结构加载模块4将S和C部分转换成HTML代码后，网页渲染模块6可以先根据HTML代码渲染网页的静态部分，等数据操作模块5处理完数据信息部分D后，再渲染网页中动态部分。

测试编辑功能时，方法与测试显示功能类似，差别在于框架1调用数据操作模块5时，自动生成的是数据库更新语句而不是查询语句。

上述实施例仅例示性说明本发明的原理及其功效，而非用于限制本发明。任何熟悉此技术的人士皆可在不违背本发明的精神及范畴下，对上述实施例进行修饰或改变。比如，对于控件代码及页面代码的内容可以自定义；框架1的实现形式可以是web应用、桌面应用甚至手机应用等等。因此，举凡所属技术领域中具有通常知识者在未脱离本发明所揭示的精神与技术思想下所完成的一切等效修饰或改变，仍应由本发明的权利要求所涵盖。

Claims

1.一种快速开发测试装置，包括：

开发配置模块，用于生成页面代码和配置数据源，使所述页面代码与所述数据源关联；

结构加载模块，用于将所述页面代码解析成显示部分和数据信息部分；

数据操作模块，用于根据所述数据信息部分生成数据访问代码，再根据所述数据访问代码将所述数据信息部分中的数据存储到所述数据源中或者将所述数据源中的数据填入所述数据信息部分中；

网页渲染模块，用于根据所述显示部分和所述数据信息部分生成网页；

所述开发配置模块、所述结构加载模块、所述数据操作模块和所述网页渲染模块生成的代码均为非编译型语言的代码，并能被所述快速开发装置直接解析，无需编译。

2.根据权利要求1所述的快速开发测试装置，其特征在于，所述开发配置模块提供可视化控件，通过操作所述可视化控件配置所述数据源、自动生成所述页面代码，且使所述页面代码与所述数据源关联。

3.根据权利要求1所述的快速开发测试装置，其特征在于，所述页面代码包括若干控件代码，所述控件代码包括样式子部S、控件子部C和数据信息子部D；

其中，所述样式子部S表示控件所在的页面部局，控件子部C表示控件的显示属性；数据信息子部D表示控件与数据源的关联信息。

4.根据权利要求1所述的快速开发测试装置，其特征在于，所述网页渲染模块采用异步渲染方式。

5.根据权利要求1所述的快速开发测试装置，其特征在于，所述快速开发测试装置作为web应用部署在服务器中，所述开发配置模块，所述结构加载模块，所述数据操作模块和所述网页渲染模块均在所述快速开发测试装置运行时状态下工作，从而所述开发配置模块，所述结构解析模块，所述数据操作模块和所述网页渲染模块对所述页面代码或数据访问代码的任何改动，其效果都能实时显示。

6.一种快速开发测试的方法，包括：

步骤a，生成页面代码并配置数据源，使所述页面代码与所述数据源关联；

步骤b，将所述页面代码解析成显示部分和数据信息部分；

步骤c，根据所述数据信息部分生成数据访问代码，将所述数据信息部分中的数据存储到所述数据源中，或者将所述数据源中的数据填入所述数据信息部分；

步骤d，根据所述显示部分和数据信息部分生成网页；

其中，所述步骤a-d中生成的所有代码均为非编译型语言的代码，能被直接解析，不需要编译。

7.根据权利要求6所述的快速开发测试方法，其特征在于，所述步骤a通过操作可视化控件完成。

8.根据权利要求6所述的快速开发测试方法，其特征在于，所述页面代码包括样式子部S，控件子部C和数据信息子部D，其中样式子部S表示控件所在的页面部局，控件子部C表示控件的显示属性；数据信息子部D表示控件与数据源的关联信息。

9.根据权利要求6-8任一所述的快速开发测试方法，其特征在于，所述步骤d中对所述显示部分和所述数据信息部分采用异步渲染技术。

10.根据权利要求9所述的快速开发测试方法，其特征在于，所述步骤a-d均在运行时完成。