技術(shù)應(yīng)用方案和開發(fā)指南_第1頁
技術(shù)應(yīng)用方案和開發(fā)指南_第2頁
技術(shù)應(yīng)用方案和開發(fā)指南_第3頁
技術(shù)應(yīng)用方案和開發(fā)指南_第4頁
技術(shù)應(yīng)用方案和開發(fā)指南_第5頁
已閱讀5頁,還剩2頁未讀 繼續(xù)免費閱讀

下載本文檔

版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進(jìn)行舉報或認(rèn)領(lǐng)

文檔簡介

1、AJAX技術(shù)應(yīng)用方案和開發(fā)指南修訂歷史記錄日期版本說明作者2006/02/240.5新建徐建評審記錄角色簽名日期說明吳志平2006-03-02張敬平2006-03-02楊震2006-03-02徐建2006-03-02蔣建波2006-03-02徐明杰2006-03-02評審結(jié)果:AJAX應(yīng)用方案可與STRUT幼案弁存,具體用在哪些方面®J詳細(xì)設(shè)計階段再具體討論,一般用在對頁面進(jìn)行無刷新操作時。對AJAX方案,要進(jìn)行組件封裝。汴意兩套方案的整合,以及系統(tǒng)的性能與開發(fā)規(guī)范。具體詳細(xì)設(shè)計方面要充分考慮對各種頁向布局的支持。AJAX技術(shù)應(yīng)用1修訂歷史記錄21 AJAX技術(shù)應(yīng)用41.1 什么是A

2、JAX41.2 AJAX架構(gòu)與系統(tǒng)架構(gòu)的集成41.2.1 AJAX架構(gòu)41.2.2 系統(tǒng)架構(gòu)41.2.3 架構(gòu)整合說明41.3 AJAX的應(yīng)用范疇52 AjAX的開發(fā)指南52.1 后臺開發(fā)62.1.1 服務(wù)層(M)62.2 前臺開發(fā)62.2.1 控制層(C)62.2.2 顯示層(V)62.3 前后臺交互配置71AJAX技術(shù)應(yīng)用方案1.1什么是AJAXAJAX是AsynchronousJavaScript+XML的簡稱,AJAX其實不是一不新的技術(shù),只是W3C中的一些技術(shù)與javascript的結(jié)合體,其實包含的技術(shù)有:1. .XHTML+CSS:用于界面的展現(xiàn);2. DOM(DocumentO

3、bjectModel):用于界面的動態(tài)顯示及交互;3. XMLHttpRequest:進(jìn)行異步數(shù)據(jù)傳輸;4. XML:進(jìn)行異步數(shù)據(jù)傳輸?shù)臄?shù)據(jù)載體;5. JAVASCRIPT:作為粘合劑將上述所有的東西綁定在一起。1.2AJAX架構(gòu)與系統(tǒng)架構(gòu)的集成1.2.1 AJAX架構(gòu)AJAX架構(gòu)采用開源的DWR+JAVASCRIPT+DOM+XHTML1.2.2 系統(tǒng)架構(gòu)系統(tǒng)架構(gòu)采用STRUTS+SPRING+HIBERNATE1.2.3 架構(gòu)整合說明整合后的架構(gòu)采用STRUTS(DWR)+SPRING+HIBERNATE,也就是說對于系統(tǒng)可以走兩條路線,一條是走STRUTS路線,通過STRUTS調(diào)用后臺的

4、SPRING服務(wù),一條是走DWR路線,通過DWR提供的規(guī)范調(diào)用后臺的SPRING服務(wù),見圖一整合后的系統(tǒng)架構(gòu)STRUTS架構(gòu)路線服務(wù)層(M)控制層(C)顯示層(V)DWR架構(gòu)路線Spring+HibernateSTRUTSJsp+JSTL端務(wù)服2 端戶客Javascript+DWRJavascript+dom+xhtml(圖一)兩個架構(gòu)的整合說明1 將dwr.jar拷貝到系統(tǒng)項目的lib目錄2 將dwr.xml文件拷貝到WEB-INF目錄3 修改系統(tǒng)的web.xml文件,在其中增加<servlet><servlet-name>dwr-invoker</servle

5、t-name><display-name>DWRServlet</display-name><servlet-class>uk.ltd.getahead.dwr.DWRServlet</servlet-class><init-param><param-name>debug</param-name><param-value>true</param-value></init-param><load-on-startup>1</load-on-startup

6、></servlet><servlet-mapping><servlet-name>dwr-invoker</servlet-name><url-pattern>/dwr/*</url-pattern></servlet-mapping>4 .3AJAX的應(yīng)用范疇客戶端需要通過無刷新和后臺進(jìn)行交互,進(jìn)行數(shù)據(jù)動態(tài)的CRUD操作系統(tǒng)中應(yīng)用的場景分析:1、 動態(tài)的內(nèi)容選擇2、 用戶的快速錄入3、 局部數(shù)據(jù)的動態(tài)更新和維護(hù)2AjAX的開發(fā)指南在圖一中可以看出基于ajax開發(fā)與傳統(tǒng)mvc開發(fā)不同的是,ajax開發(fā)的

7、顯示層和控制層是在客戶端通過js+dom+xhtml+xmlHttpRequest來實現(xiàn),而傳統(tǒng)的struts等mvc架構(gòu)的顯示層和控制層是通過服務(wù)端的struts+jsp等來實現(xiàn)的,對比如下:struts架構(gòu)M服務(wù)層serviceC控制層actionV 顯示層jsp+taglibAjax架構(gòu)M服務(wù)層serviceC控制層javascriptV 顯示層javascript+dom+xhtml從上面的比較我們就可以很清楚的看出,Ajax架構(gòu)和Struts架構(gòu)相同點是服務(wù)層結(jié)構(gòu)完全相同,而不同的是控制層和顯示層結(jié)構(gòu),下面以一個簡單的CRUD例子介紹AJAX開發(fā)規(guī)2.1 后臺開發(fā)后臺開發(fā):指的就是服

8、務(wù)層(M)的開發(fā)2.1.1 服務(wù)層(M)以投保單的維護(hù)作為例子,向外提供接口ApplicationFormService,其中提供四個業(yè)務(wù)方法:/新增投保單publicvoidcreateApplicationForm(ApplicationFormobj);/獲取投保單publicApplicationFormreadApplicationForm(Stringid);/修改投保單publicvoidupdateApplicationForm(ApplicationFormobj);/刪除投保單publicvoiddeleteApplicationForm(Stringid);/其他的業(yè)務(wù)操

9、作2.2 前臺開發(fā)前臺開發(fā):包含控制層(C)和顯示層(V)的開發(fā)2.2.1 控制層(C)根據(jù)請求訪問服務(wù)層的業(yè)務(wù)方法,并調(diào)用顯示層對返回的結(jié)果進(jìn)行展現(xiàn)/*新增投保單*/functioncreateApplicationForm()/通過顯示層獲取數(shù)據(jù)對象varapplicationForm=getApplicationForm();/調(diào)用服務(wù)層的業(yè)務(wù)方法,并將結(jié)果傳給回調(diào)方法callBack進(jìn)行數(shù)據(jù)填充ApplicationFormService.createApplicationForm(applicationForm,callBack);/*對返回的結(jié)果進(jìn)行數(shù)據(jù)填充*/functionca

10、llback()/對返回的結(jié)果進(jìn)行數(shù)據(jù)填充,由于是新增操作,所以只是提示一個成功失敗信息alert(“新增成功”);2.2.2 顯示層(V)對頁面中的數(shù)據(jù)進(jìn)行封裝和對頁面進(jìn)行數(shù)據(jù)填充/*投保單的數(shù)據(jù)對象*/functionApplicationForm()this.applicationFormId=null;this.applicationFormNo=null;/*封裝投保單的數(shù)據(jù)對象*/functiongetApplicationForm()/通過js+dom獲取用戶錄入的數(shù)據(jù),并封裝成數(shù)據(jù)對象ApplicationFormvarapplicationForm=newApplicatio

11、nForm();applicationForm.applicationFormId=document.getElementById(“applicationFormId”).value;applicationForm.applicationFormNo=document.getElementById(“applicationFormNo”).value;returnapplicationForm;/*填充投保單的數(shù)據(jù)對象*/functionsetApplicationForm(applicationForm)/通過js+dom將數(shù)據(jù)對象applicationForm的數(shù)據(jù)填充到界面中docum

12、ent.getElementById(“applicationFormId”).value=applicationForm.applicationFormId;document.getElementById(“applicationFormNo”).value=applicationForm.applicationFormNo;2.3 前后臺交互配置看前臺控制層代碼中的紅色部分,客戶端通過javascript可以調(diào)用服務(wù)層的業(yè)務(wù)方法,那么這里面的通信和數(shù)據(jù)傳輸都是通過DWR來實現(xiàn)的,服務(wù)層的接口ApplicationFormService會映射成前臺的javascript對象ApplicationFormService,其中的映射關(guān)系是通過dwr.xml配置文件完成。<createcreator="new"javascript="ApplicationFormService"><paramname="class"value="com.longri

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

最新文檔

評論

0/150

提交評論