摘 要 針對某高職院校要求開發具有良好用戶體驗和可維護性的網上科研項目申報及評審系統的需要,闡述了基于ExtJS+Servlet+MyBatis的網上科研項目申報及評審系統的設計與實現。詳述系統所使用的關鍵技術。分析了系統所采用的架構并給出了核心功能的實現。應用實踐表明,ExtJS框架可以作為開發具有良好用戶體驗的Web應用的另一選擇。
【關鍵詞】ExtJS 項目申報與評審 AJAX B/S架構
隨著網絡技術的普及以及管理模式的變革,高職院校的科研項目申報及評審工作,大多由傳統的手工處理方式提升為由計算機軟件系統輔助管理。而且,高職院校在選購管理軟件時,也傾向于由原來行業內統一,標準化的軟件系統,向個性化訂制服務軟件系統的轉變。
Web應用中基于B/S(瀏覽器/服務器)多層體系架構以其客戶端和服務器端分離的優點而受到廣泛的關注。然而,傳統的B/S架構沒有采用良好的軟件設計模式和開發框架,開發的JSP、ASPX頁面中通常既包含表示層的數據又嵌入了業務邏輯的程序代碼,存在系統維護難度高、頁面交互性和表現能力差的不足。本文針對某高職院校對網上科研項目申報及評審系統的實際需求,采用ExtJS框架,綜合運用Ajax技術、Servlet技術和MyBatis持久化框架,設計并實現網上科研項目申報及評審系統。
1 采用關鍵技術
1.1 Ajax技術
Ajax(Asynchronous JavaScript and XML,異步JavaScript和XML)是一種創建交互式網頁應用的網頁開發技術,Ajax技術的核心是XMLHttpRequest對象。使用XMLHttpRequest對象,客戶端應用程序向服務器發送請求,并處理服務器的響應,在處理過程中,可以避免阻塞客戶端用戶操作,Web頁面也不需要頻繁重新加載,就能產生局部刷新的效果,從而使用戶具有良好操作體驗。
1.2 ExtJS框架
ExtJS是一個用JavaScript編寫的,與后臺開發技術無關的前端Ajax框架,可以直接應用到Java、.Net、Php開發語言中,前后臺之間通過JSON/XML實現數據傳遞。
ExtJS技術主要用于構建UI(User Interface,用戶界面),也可用來開發RIA(Rich Internet Application,富客戶端)應用程序。ExtJS擁有豐富的表單控件,它整合CSS,XML等多項技術,從實現的界面效果到數據解析及異常處理都非常出色,并且能夠兼容不同的瀏覽器。ExtJS不需要在客戶端安裝任何插件,使用ExtJS構建的RIA應用可與桌面程序媲美,它正逐步成為開發擁有良好用戶體驗的Web應用的新選擇。
1.3 JSON技術
JSON(JavaScript Object Notation,JS對象標記)是一種輕量級的數據交換格式。它采用完全獨立于語言的文本格式,易于人閱讀和編寫,也易于機器解析和生成。JSON語法極其簡單,對于那些輕量級的AJAX應用,相對與XML數據而言,JSON得到了更廣泛的使用,成為理想的數據交換格式。
1.4 MyBatis框架
MyBatis是J2EE應用開發中的一個持久化框架,它通過配置的XML文件或注解實現對象與存儲過程,SQL語句的關聯,并可實現動態生成SQL語句。MyBatis與JDBC相比,簡化了相關代碼的實現,讓程序將主要精力放在SQL語句上,通過其提供的映射方式,自由靈活生產(或半自動化)滿足需要的SQL語句,修改也比較容易。
2 系統設計
2.1 架構設計
系統架構采用MVC模型設計,該模型由表現層、控制層和模型層構成,每一層采用不同的技術實現,層與層之間使用不同技術進行數據交互。系統架構由ExtJS+Servlet+JSON+MyBatis技術構成,如圖1所示。
架構詳細描述:表示層使用ExtJS實現用戶界面及用戶請求。服務層使用Servlet實現用戶請求及響應。實現層使用Java技術實現系統業務的處理。數據訪問層使用MyBatis實現數據持久化。數據庫使用MySql5.5實現業務數據的存儲。
處理主流程:用戶從瀏覽器發出的請求(異步請求)至服務層;服務層根據請求調用實現層業務處理模塊進行業務處理;業務處理完成后,一方面通過數據訪問層接口與數據庫管理系統對數據進行持久化處理;另一方面,實現層將用戶請求結果回傳給服務層,并經由服務層規范化后,返回給瀏覽器并呈現給用戶。
2.2 功能設計
科研項目申報及評審系統由系統管理、申報子系統和評審子系統三個部分組成,功能結構如圖2所示。
(1)系統管理,實現用戶—角色—權限的安全管理策略,一個用戶可以擁有多個角色,一個角色也可以包含多個權限。以此實現用戶—權限的最大靈活性。
(2)申報子系統,由項目申報、項目修改及項目瀏覽三個部分組成,用于科研工作者與科研管理者用戶通過瀏覽器便利地實現科研項目的申報、修改、查詢瀏覽、統計以及申報書導出等功能。
(3)評審子系統,由專家管理、項目分配、項目評審和評審管理四個部分組成。主要用于科研管理者用戶將待評審的科研項目分配給指定的評審專家,以及評審專家對分配的科研項目實施評審??蒲泄芾碚哂脩艨梢怨芾?、查詢和統計各評審專家評審的評審情況。
3 核心功能模塊實現
3.1 前后端數據通信
本系統利用ExtJS已經封裝的Ajax特性,可以無需刷新瀏覽器頁面,直接通過異步方式將客戶端的請求提交給服務層,并處理服務層的響應。ExtJS的Ajax組件支持JSON或XML等數據格式。與采用XML格式的數據相比較,JSON格式數據具有數據規模小,編程簡單等優點,故本系統采用JSON格式數據進行通信。表示層使用Ext.Ajax.request組件,請求代碼如下:endprint
編程實現時,使用ExtJS的Ext.define組件,將上述代碼封裝在一個名稱為exRequest類中成獨立的模塊。并利用組合技術,將exRequest組合到應用類(如:登錄管理)中,并注冊對事件“completed”的響應,以達到利用ExtJS的事件處理機制,實現頁面編碼與Ajax請求的分離。
3.2 服務層的接口實現
服務層是聯系表示層和模型層的紐帶,服務層調用模型層的業務邏輯處理接口,實現對系統業務數據的增加、修改、刪除、查詢、統計、打印及導出等處理功能。請求服務(ServiceAction)抽象類與部分業務請求實現類(HdPmpProjectApply[項目申報服務]和HdPmpProjectEvalute[項目評審])關系,如圖3所示。
方法request()是頁面請求執行引擎,而response()是服務層響應執行引擎,這兩個方法不能被重寫,其它抽象方法(doSeek,doModify,doDelete,…),在不同的業務實現類中被重寫。采用這中接口方式,進一步達到規范服務層操作,重點關注業務邏輯處理以及降低重復代碼編寫的目的。
3.3 數據持久化實現
系統采用MyBatis框架實現數據的持久化。MyBatis應用程序首先創建SqlSessionFactory實例,其作用相當于一個數據庫連接池;然后SqlSessionFactory通過配置的XML文件獲取一個SqlSession,請求執行SQL語句;執行完成后需要釋放SqlSession。實現核心代碼如下:
4 結束語
經實際應用測試,科研項目申報及評審系統能達到預期功能和性能目標,滿足用戶管理工作的需要,具有較好的實際應用價值。實踐表明,采用ExtJS技術實現基于B/S模式的Web應用系統,能縮短開發周期,提高Web應用系統的可維護性和可擴展性,可以作為開發擁有良好用戶體驗的Web應用的另一新選擇。
參考文獻
[1]魏焱,李邈.基于ExtJS的VPN管理系統的設計與實現[J].通信技術,2017(06):1323-1327.
[3]鄧源清,石智偉.售票網站后臺管理系統架構設計與實現[J].軟件導刊,2017(05):96-98.
[4]張小龍,孔勇強等.基于Extjs+SSH框架的電子商務系統[J].中國科技信息,2017(10):65-67.
[5]周珅.基于ExtJS的通用層級關系組件的設計和實現[J].數字通信世界,2017(05):261-262.
[6]Brett McLaughlin著,OReilly Taiwan公司編譯.深入淺出Ajax[M].南京:東南大學出版社,2008:28-40.
[7]張旗.淺析Ajax框架在Web系統中開發與應用[J].科技廣場,2008(08):223-225.
[8]趙俊昌,祝紅濤,吳越人.精通JS之ExtJS框架[M].北京:化學工業出版社,2011.
[9]http://json.org/json-zh.html.
[10]文歡歡等.基于Mybatis和JDBC的分頁查詢研究[J].電腦知識與技術,2015(25):165-167.
[11]榮艷冬.關于Mybatis持久層框架的應用研究[J].信息安全與技術,2015(12):86-88.
[12]姜娜,孔浩,張子鋒.高校業務系統中基于MyBatis實現可復用的DAO模型[J].昭通師范高等專科學校學報,2012(05):31-34.
[13]陳玲,夏汛.利用Mybatis的動態SQL實現物理分頁[J].數字技術與應用,2011(11):227.
作者簡介
彭春富(1970-),男,湖南省澧縣人。碩士學位。高級工程師。主要研究方向為軟件工程。
作者單位
常德職業技術學院 湖南省常德市 415000endprint