基于ASP.NET的Web表單自動生成引擎

李維佳　汪洪江

（1中國電子科技集團(tuán)公司第五十四研究所，河北　石家莊　050002）

（2遼寧省高中等教育考試招生委員會辦公室，遼寧　沈陽　110031）

基于ASP.NET的Web表單自動生成引擎

李維佳1汪洪江2

（1中國電子科技集團(tuán)公司第五十四研究所，河北石家莊050002）

（2遼寧省高中等教育考試招生委員會辦公室，遼寧沈陽110031）

針對信息系統(tǒng)開發(fā)中Web表單頁面開發(fā)工作量大、重復(fù)性高和內(nèi)容結(jié)構(gòu)相似的特點(diǎn)，提出了一種基于ASP.NET的自定義頁面生成引擎。該引擎基于XML格式的配置文件動態(tài)生成Web表單頁面，同時提供對表單的設(shè)計、展示、讀取和操作的支持。在實際應(yīng)用中，該引擎有效降低了信息系統(tǒng)開發(fā)和維護(hù)成本，且由于引擎表單元素重用的特點(diǎn)，引擎生成的Web表單頁面具有很高的穩(wěn)定性。

ASP.NET 自定義頁面 自動生成引擎

1　引言

在企業(yè)信息化飛速發(fā)展的進(jìn)程中，企業(yè)對于信息系統(tǒng)的功能要求越來越高。信息系統(tǒng)開發(fā)中通常會遇到一個令開發(fā)者頭疼的問題，就是需求是不斷變化的，而最常見的是對表單數(shù)據(jù)項的更改。傳統(tǒng)的表單開發(fā)方法，是將定制好的表單以硬編碼的方式固化在系統(tǒng)中。當(dāng)業(yè)務(wù)需求發(fā)生變更時，必須對原來系統(tǒng)的數(shù)據(jù)結(jié)構(gòu)及功能進(jìn)行代碼級的改動。每次需求變化都要更改程序，更改數(shù)據(jù)庫表結(jié)構(gòu)，重新對程序進(jìn)行測試，工作量大，導(dǎo)致系統(tǒng)不易維護(hù)［1］。如果表單數(shù)據(jù)項變化，只更改表單配置文件，而不更改底層代碼和數(shù)據(jù)底表，系統(tǒng)會變得更易維護(hù)。因此本文設(shè)計和實現(xiàn)了基于ASP.NET的Web表單自動生成引擎。該引擎首先解析XML格式的Web表單內(nèi)容配置文件，動態(tài)生成表單元素并將其添加到Web表單中。實際應(yīng)用表明，該引擎有效降低了信息系統(tǒng)開發(fā)和維護(hù)成本。

2　相關(guān)技術(shù)介紹

2.1Asp.NET技術(shù)

ASP.NET是由微軟在.NET框架中提供，用來開發(fā)Web應(yīng)用程序的類庫，包含在System.Web命名空間中，并提供網(wǎng)頁處理、擴(kuò)充以及HTTP通道的應(yīng)用程序和通信處理等工作［2］。嚴(yán)格意義上講，ASP.NET并不是一門編程語言，是有.NET提供的開發(fā)平臺。

在ASP.NET運(yùn)行的時候，經(jīng)常會有網(wǎng)頁的來回動作（round-trip），在ASP.NET中稱為PostBack。開發(fā)人員可以用Page.IsPostBack來判斷是否為第一次運(yùn)行，它可以保證ASP. NET的控件事件只會運(yùn)行一次，客戶端和服務(wù)器之間的通訊是無狀態(tài)的和斷續(xù)的［3］。但是為了保證用戶體驗，需要使用戶感覺到這是一個連續(xù)執(zhí)行的過程。為了獲得連續(xù)性效果，頁面開發(fā)人員必須知道頁面的執(zhí)行順序。開發(fā)人員需要了解：在頁面生命周期的各個階段，可以進(jìn)行哪些操作，頁面生命周期中各階段的概述如表1所示。

表1　ASP.NET頁面生命周期

2.2Web表單

Web表單相當(dāng)于傳統(tǒng)Web頁面，二者之間的區(qū)別在于Web表單的所有頁面元素是由表單元素構(gòu)成的，可以說Web表單是由表單元素所構(gòu)成的集合［4］。在企業(yè)信息系統(tǒng)中，Web表單與企業(yè)的業(yè)務(wù)流程相關(guān)，是企業(yè)中的紙質(zhì)流程單的電子化表現(xiàn)，一般用于收集和展示用戶填寫的各種數(shù)據(jù)［5］，如圖1所示。Web表單通常由兩部分組成：表頭和列表。表頭用來描述該表單的總體信息，例如：名稱、編號和負(fù)責(zé)人等信息。列表用來展示表單細(xì)節(jié)，例如：處理流程及每步流程的處理細(xì)節(jié)。表單元素是組成Web表單的基本單元，它是一個抽象的概念，用于描述用戶填寫的一個數(shù)據(jù)項，而具體的實現(xiàn)是通過ASP.NET中的Web服務(wù)器控件來表示的。

圖1　Web表單示例

3　解決方案

3.1設(shè)計思想

通過總結(jié)企業(yè)信息系統(tǒng)開發(fā)經(jīng)驗可以發(fā)現(xiàn)，Web表單是系統(tǒng)開發(fā)的核心。Web表單主要有2個用途：收集和展示數(shù)據(jù)。B/S架構(gòu)的系統(tǒng)中：數(shù)據(jù)收集通過HTML頁面輸入元素（例如：文本框和下拉列表）并配合彈窗等動作完成；數(shù)據(jù)展示則通過HTML頁面元素配合表格（例如：Table和GridView）的方式；Web表單還需要支持對數(shù)據(jù)的增刪改等操作。信息系統(tǒng)中包含大量的Web表單，對這些表單內(nèi)容進(jìn)一步分析發(fā)現(xiàn)：不同的Web表單在數(shù)據(jù)內(nèi)容和結(jié)構(gòu)上具有很高的相似度，只是在某些屬性上有所取舍而形成了不同的表單。

現(xiàn)有的開發(fā)方式是為這些大體相同的表單開發(fā)不同的Web頁面。在實際應(yīng)用中，系統(tǒng)的需求和數(shù)據(jù)的結(jié)構(gòu)會較為頻繁的變化。Web表單是根據(jù)數(shù)據(jù)表的列來設(shè)計和實現(xiàn)的，用戶要填寫對應(yīng)于數(shù)據(jù)表列的信息，所以數(shù)據(jù)結(jié)構(gòu)的變化，必然導(dǎo)致Web表單的改變。這些變化為系統(tǒng)開發(fā)和維護(hù)人員帶來了大量的重復(fù)性勞動。為了減少這種重復(fù)低效的工作，設(shè)計和實現(xiàn)了基于ASP.NET的Web表單自動生成引擎。該引擎在統(tǒng)一的Web表單框架的基礎(chǔ)上，通過讀取不同的配置文件，生成不同的Web表單。另外Web表單是信息系統(tǒng)的重要組成部分，所以引擎考慮了與現(xiàn)有開發(fā)環(huán)境的集成，可以方便快捷地嵌入ASP.NET環(huán)境中，最后引擎還可以靈活調(diào)整以適應(yīng)實際應(yīng)用中的復(fù)雜情景。

3.2設(shè)計方案

Web表單的用途是對數(shù)據(jù)的收集和展示，因此引擎在整體設(shè)計上借鑒了信息系統(tǒng)的設(shè)計思路采用經(jīng)典MVC（Model、View和Control）三層架構(gòu)，如圖2所示。

圖2　引擎架構(gòu)示意圖

Model層負(fù)責(zé)解析表單配置文件，并將配置信息提供給View層和Control層。每個Web表單對應(yīng)2個XML格式的配置文件（SheetHeader和SheetDetail），分別描述表單的表頭和列表部分。SheetHeader將具有數(shù)據(jù)采集功能的表單元素（文本框、下拉列表和彈出選擇窗口等）與數(shù)據(jù)庫中對應(yīng)表的字段建立聯(lián)系。SheetDetail將列Table中的列與數(shù)據(jù)庫中對應(yīng)的字段建立聯(lián)系。Control層負(fù)責(zé)表單元素的動態(tài)生成及操作。Web表單的表頭和列表分別動態(tài)生成：在生成表頭時，根據(jù)Model層提供的表單元素詳細(xì)信息，動態(tài)生成表單元素并添加到Web頁面中；生成列表時引擎將從數(shù)據(jù)庫中獲取的數(shù)據(jù)添加到網(wǎng)頁Table中對應(yīng)的字段。Control層對表單元素的操作包括讀取用戶輸入和將數(shù)據(jù)庫中的值賦值到對應(yīng)的表單元素中。

View層負(fù)責(zé)將引擎生成的Web表單頁面調(diào)整到用戶最終見到的效果。Control層生成的Web表單沒有格式，只是將Web表單所需的元素羅列到頁面中。View層按照配置文件的描述對表單元素進(jìn)行排序和格式化，并添加用戶輸入驗證。最后再根據(jù)信息系統(tǒng)的界面風(fēng)格，采用對應(yīng)的布局文件美化頁面，提高用戶體驗。View層處理前后如圖3所示。

圖3　View層處理前后對比

4　引擎關(guān)鍵技術(shù)

4.1表單對象抽象

圖4　Workitem和Worksheet E-R圖

目前信息系統(tǒng)開發(fā)在數(shù)據(jù)層通常采用ORM工具來建立程序操作的對象和數(shù)據(jù)庫中的表之間的應(yīng)關(guān)系。同時引擎的目的是通過修改配置文件的方式來滿足系統(tǒng)需求的更改，從而降低甚至避免修改數(shù)據(jù)庫表結(jié)構(gòu)、程序代碼和重新測試所帶來的高昂成本。因此結(jié)合數(shù)據(jù)庫和信息系統(tǒng)的實際應(yīng)用特點(diǎn)，對所有的類型的表單進(jìn)行分析，抽象并建立統(tǒng)一的表單對象，并以此為依據(jù)在數(shù)據(jù)庫中創(chuàng)建實體對象表。以制造執(zhí)行系統(tǒng)中的Web表單（圖1所示）為例，結(jié)合Model層的設(shè)計方式，表單對象也由Worksheet（表頭對象）和Workitem（列表對象）兩部分組成。綜合分析在實際中各種場景下的應(yīng)用對2個對象進(jìn)行建模，同時為后期需求或某些特殊應(yīng)用預(yù)留若干屬性。該表單對象對應(yīng)的數(shù)據(jù)庫E-R圖如圖4所示。

4.2配置文件設(shè)計

表單的生成和最終頁面的展現(xiàn)都基于配置文件，同時表單是由表單元素組成，因此配置文件需要能夠準(zhǔn)確和完整地描述Web表單中的表單元素，其中幾個常用關(guān)鍵屬性如表2所示。一個表單由Worksheet和Workitem兩種對象組成。2種對象通過對同一配置文件采用不同的解析方式可以得到不同的表單對象，增加了表單的復(fù)用性，減少了配置文件數(shù)量，提高了利用率。

表2　表單元素關(guān)鍵屬性

4.3信息采集表單元素實現(xiàn)

信息采集是Web表單的一項重要功能。根據(jù)業(yè)務(wù)需求不同，數(shù)據(jù)錄入形式多種多樣。通過分析信息系統(tǒng)中的表單數(shù)據(jù)錄入的方式和特點(diǎn)，總結(jié)出了5種常用的信息采集表單元素。針對這5種表單元素引擎采用設(shè)計模式中的抽象工廠方式［6］，根據(jù)配置文件向頁面動態(tài)創(chuàng)建并添加到Web表單中，設(shè)計UML圖，如圖5所示。IFormElement包含了表單對象的創(chuàng)建、賦值和取值等操作，各表單元素類實現(xiàn)該接口，并通過反射+配置文件的方式向IFormElement接口編程。通過該方式可以在后續(xù)開發(fā)中靈活的增加表單元素類型，逐步完善該引擎。

圖5　表單元素UML圖

4.4頁面排版

頁面排版用JavaScript實現(xiàn)，引擎所生成Web表單元素是以HTML格式呈現(xiàn)給系統(tǒng)用戶。引擎對HTML中的元素ID是按照預(yù)先定義好的規(guī)則命名。根據(jù)不同信息系統(tǒng)的界面和排版風(fēng)格，在瀏覽器端對符合規(guī)則的HTML元素進(jìn)行排版。這種處理方式使引擎具有如下優(yōu)點(diǎn)：降低了實現(xiàn)難度和代碼復(fù)雜度、保證了引擎的適應(yīng)性及提高系統(tǒng)運(yùn)行效率。

4.5數(shù)據(jù)操作策略

引擎對Web表單的操作分為4種類型：添加表單元素、設(shè)置表單元素數(shù)據(jù)、讀取表單元素數(shù)據(jù)和修改表單元素數(shù)據(jù)。結(jié)合表單操作類型和ASP.NET頁面生命周期特點(diǎn)，引擎采用不同的策略：①添加表單元素在Web表單所在頁面的OnInit（）方法中完成；②設(shè)置表單元素數(shù)據(jù)在頁面的OnLoad（）方法中完成；③讀取表單元素數(shù)據(jù)在頁面對應(yīng)的動作事件（如按鈕點(diǎn)擊等）中完成；④修改表單元素數(shù)據(jù)在頁面動作事件結(jié)合彈窗操作來完成。

5　結(jié)束語

目前該引擎已經(jīng)應(yīng)用到某制造執(zhí)行系統(tǒng)的開發(fā)中，通過引擎+配置文件的方式，滿足了該系統(tǒng)6種類型表單的創(chuàng)建、編輯、錄入和展示的功能需求。同時該引擎也可以靈活應(yīng)對客戶需求不確定的特點(diǎn)，大大縮短了Web表單開發(fā)時間，在后續(xù)工作中會不斷增加引擎所支持的表單元素類型，以滿足更多的系統(tǒng)需求。

［1］吳賀，及俊川，李新，等.基于XML的動態(tài)表單快速生成技術(shù)［J］.計算機(jī)系統(tǒng)應(yīng)用，2010（9）：60-63.

［2］Worley S.ASP.NET技術(shù)內(nèi)幕［M］.北京：人民郵電出版社，2002.

［3］李明剛，肖建.ASP.NET Web站點(diǎn)高級編程范例［M］.北京，清華大學(xué)出版社，2004.

［4］林向.Web表單可視化定制原理研究［J］.電腦開發(fā)與應(yīng)用. 2013（6）：34-36.

［5］徐鵬，王克宏.基于Browser/Webserver模式的電子表單系統(tǒng)［J］.計算機(jī)科學(xué).2001（1）：106-110.

［6］程杰.大話設(shè)計模式［M］.北京：清華大學(xué)出版社，2008.

An Automatic Generation Engine for Web Form Based on ASP. NET

LI Wei-jia1，WANG Hong-jiang2
（1 The 54th Research Institute of CETC，Shijiazhuang Hebei 050081，China）
（2 Office，Liaoning Enrollment and Examination Commission of Higher and Secondary Education，Shenyang Liaoning 110031，China）

Aiming at the characteristics of high workload，high repeatability and similar structure in web forms development，this paper puts forward an automatic generation engine for web form based on ASP.Net.This engine generates web form page dynamically based on XML configuration file.At the same time it provides such capabilities as form design，display，read and operation.In practical applications，the engine can significantly reduce the cost of development and maintenance for information system.Besides，because of the characteristic of reuse，the web forms generated by the engine have higher stability.

ASP.NET；custom webpage；automatic generation engine

TP311

A

1008-1739（2015）17-60-4

定稿日期：2015-08-12