畢業(yè)論文---ajax技術(shù)在信息發(fā)布系統(tǒng)中的應(yīng)用_第1頁(yè)
已閱讀1頁(yè),還剩16頁(yè)未讀, 繼續(xù)免費(fèi)閱讀

下載本文檔

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

文檔簡(jiǎn)介

1、<p><b>  目 錄</b></p><p><b>  1.選題背景1</b></p><p>  1.1背景以及課題目的和意義1</p><p>  1.2國(guó)內(nèi)外發(fā)展現(xiàn)狀1</p><p>  2.相關(guān)基礎(chǔ)及技術(shù)2</p><p>  2.1意義A

2、JAX概念和技術(shù)的出現(xiàn)以及AJAX關(guān)鍵技術(shù)2</p><p>  2.1.1JavaScript2</p><p>  2.1.2CSS2</p><p>  2.1.3文檔對(duì)象模型DOM2</p><p>  2.1.4XHTML2</p><p>  2.2AJAX與傳統(tǒng)Web服務(wù)的比較2</p&

3、gt;<p>  2.2.1傳統(tǒng)的Web應(yīng)用3</p><p>  2.2.2集成AJAX技術(shù)的Web應(yīng)用3</p><p>  2.2.3使用AJAX的優(yōu)勢(shì)3</p><p>  3.應(yīng)用實(shí)例設(shè)計(jì)與分析4</p><p><b>  3.1設(shè)計(jì)思想4</b></p><p&g

4、t;  3.2系統(tǒng)的開(kāi)發(fā)測(cè)試環(huán)境4</p><p>  3.3系統(tǒng)功能設(shè)計(jì)4</p><p>  3.4系統(tǒng)總體Web框架5</p><p>  3.4.1系統(tǒng)的分層架構(gòu)設(shè)計(jì)5</p><p>  3.4.2結(jié)合AJAX的MVC模式5</p><p>  3.5系統(tǒng)動(dòng)態(tài)模型分析6</p>&l

5、t;p>  3.5.1基于AJAX的操作協(xié)議圖6</p><p>  3.6 AJAX與Servlet交互代碼的主要實(shí)現(xiàn)7</p><p>  3.7系統(tǒng)類結(jié)構(gòu)設(shè)計(jì)9</p><p>  3.8系統(tǒng)數(shù)據(jù)庫(kù)結(jié)構(gòu)設(shè)計(jì)9</p><p>  3.9系統(tǒng)的主要功能實(shí)現(xiàn)10</p><p>  3.9.1基于AJ

6、AX技術(shù)的查詢?yōu)g覽模塊,即用戶模塊10</p><p>  3.9.2管理模塊10</p><p>  4.系統(tǒng)測(cè)試運(yùn)行效果及結(jié)果分析11</p><p>  4.1管理模塊11</p><p>  4.2用戶瀏覽模塊12</p><p>  5.系統(tǒng)性能和安全分析13</p><p&g

7、t;  5.1性能問(wèn)題13</p><p>  5.2解決方案14</p><p>  5.3安全性分析14</p><p><b>  參考文獻(xiàn):14</b></p><p>  Ajax技術(shù)在信息發(fā)布系統(tǒng)中的應(yīng)用</p><p>  摘要: 信息的發(fā)布和傳播是指信息從發(fā)送者到接收者的傳

8、遞過(guò)程,這個(gè)過(guò)程有三個(gè)基本要素:發(fā)送者、接收者和傳播渠道。隨著網(wǎng)絡(luò)通信與計(jì)算機(jī)技術(shù)的飛速發(fā)展,將信息以網(wǎng)絡(luò)的形式進(jìn)行傳播已經(jīng)成為現(xiàn)代信息發(fā)布系統(tǒng)的主流模式,Web服務(wù)的形式也逐漸多樣化。傳統(tǒng)的Web技術(shù)由于互動(dòng)性和實(shí)時(shí)性的缺陷,已經(jīng)無(wú)法滿足現(xiàn)實(shí)的需要。本文對(duì)傳統(tǒng)的Web應(yīng)用與Ajax模式的Web應(yīng)用進(jìn)行了比較,詳細(xì)分析了Ajax與綜合信息發(fā)布系統(tǒng)的集成設(shè)計(jì)模式。通過(guò)具體的設(shè)計(jì)說(shuō)明了這種應(yīng)用的可行性以及更加強(qiáng)大的交互性。</p>

9、;<p>  關(guān)鍵詞: Ajax 異步傳輸 Web應(yīng)用 信息發(fā)布系統(tǒng) JavaScript</p><p><b>  1.選題背景</b></p><p>  1.1背景以及課題目的和意義</p><p>  從2003年多媒體信息發(fā)布系統(tǒng)出現(xiàn),到2007多媒體信息發(fā)布系統(tǒng)得到人們的認(rèn)可,發(fā)展到現(xiàn)在,其已經(jīng)成為建筑智能化

10、領(lǐng)域不可缺少的一個(gè)子系統(tǒng),多媒體信息發(fā)布系統(tǒng)在現(xiàn)代信息化社會(huì)應(yīng)用的行業(yè)和地點(diǎn)越來(lái)越廣泛?!岸嗝襟w”是指能夠同時(shí)獲取、處理、編輯、存儲(chǔ)和展示兩個(gè)以上不同類型信息媒體的技術(shù),也稱多媒體信息發(fā)布系統(tǒng)?,F(xiàn)在多媒體技術(shù)往往與計(jì)算機(jī)聯(lián)系起來(lái),這是由于計(jì)算機(jī)的數(shù)字化及交互處理能力,極大地推動(dòng)了多媒體技術(shù)的進(jìn)一步發(fā)展。通常可以把多媒體看成是先進(jìn)的計(jì)算機(jī)技術(shù)與視頻、音頻和通信等技術(shù)融為一體而形成的新技術(shù)或新產(chǎn)品。因此可以認(rèn)為多媒體是計(jì)算機(jī)綜合處理文本、圖

11、形、圖像、音頻、視頻等多媒體信息,使多種信息可以快速的綜合的發(fā)展。它是一種迅速發(fā)展的綜合性電子信息技術(shù),給人們的工作、生活、休閑和娛樂(lè)帶來(lái)了深刻的影響。利用AJAX來(lái)實(shí)現(xiàn)信息的實(shí)時(shí)更新,加強(qiáng)對(duì)系統(tǒng)數(shù)據(jù)庫(kù)的監(jiān)測(cè),是得到最新信息的一種非常有效的方式。</p><p>  1.2國(guó)內(nèi)外發(fā)展現(xiàn)狀</p><p>  AJAX作為一個(gè)技術(shù)組合,除了在瀏覽器中引入了XMLHttpRequest對(duì)象以外

12、,并沒(méi)有增加其他的新技術(shù)。但AJAX卻顛覆了傳統(tǒng)Web應(yīng)用的理論,模式和方法,AJAX技術(shù)的潛力還有待進(jìn)一步挖掘,AJAX應(yīng)用的理論,模式和方法還需要繼續(xù)發(fā)展和完善。AJAX技術(shù)目前還處于成長(zhǎng)期,雖然AJAX技術(shù)得到越來(lái)越多的應(yīng)用,但像Google這樣把AJAX技術(shù)的使用發(fā)揮到極至的例子還是很少,AJAX在大多數(shù)情況下還是作為一種補(bǔ)充技術(shù)出現(xiàn),AJAX成為web應(yīng)用的主流技術(shù)還是需要一定時(shí)間的。</p><p>

13、  最有名的AJAX應(yīng)用幾乎都是Google的大作,包括Gmail, Google Suggest, Google Maps,可以說(shuō)這是最廣為人知的幾個(gè)AJAX應(yīng)用,比如Google推出的Gmail服務(wù),Gmail最出色的地方是它的UI,它允許用戶一次打開(kāi)多個(gè)郵件,并且即使用戶在編寫(xiě)郵件時(shí),郵件列表也能夠自動(dòng)更新,與其他的傳統(tǒng)的Web郵件系統(tǒng)相比,這是一個(gè)巨大的進(jìn)步,再比如Google Suggest在提供更加豐富的交互性方面,Goog

14、le走得更遠(yuǎn),例如,當(dāng)用戶鍵入字符時(shí),Google Suggest可以為用戶提供與輸入字符相符的提示,幫助他們完成想要鍵入的搜索字符串,Google Maps可以執(zhí)行交互式的,可動(dòng)態(tài)縮放而不需要刷新整個(gè)頁(yè)面的搜索,如今,隨著Gmail, Google Maps的應(yīng)用和各種瀏覽器的支持,AJAX正逐漸壯大起來(lái),使得人們更加關(guān)注于他。而這些應(yīng)用都只算是初步的嘗試,同時(shí)也表明,AJAX正在快速的壯大,因?yàn)橄窆雀?,雅虎和微軟這樣的IT界領(lǐng)軍人物

15、只有在看到了可觀的商業(yè)前景之后才會(huì)大量運(yùn)用特定的新技術(shù) 。 </p><p><b>  2.相關(guān)基礎(chǔ)及技術(shù)</b></p><p>  2.1意義AJAX概念和技術(shù)的出現(xiàn)以及AJAX關(guān)鍵技術(shù)</p><p>  2.1.1JavaScript</p><p>  JavaScript是一種基于對(duì)象和事件驅(qū)動(dòng)并具有較高安

16、全性能的腳本語(yǔ)言,其目的是與HTML超文本標(biāo)記語(yǔ)言、Java腳本語(yǔ)言(Java小程序)一起實(shí)現(xiàn),并在一個(gè)Web頁(yè)面中連接多個(gè)對(duì)象,與Web客戶交互作用,從而可以開(kāi)發(fā)客戶端的應(yīng)用程序等。JavaScript通過(guò)嵌入或調(diào)入到標(biāo)準(zhǔn)的HTML語(yǔ)言中實(shí)現(xiàn),它的出現(xiàn)彌補(bǔ)了HTML語(yǔ)言的缺陷,是Java與HTML折中的選擇。JavaScript曾一直被定位為客戶端腳本語(yǔ)言,應(yīng)用最多的地方是表單數(shù)據(jù)的校驗(yàn)。</p><p>&l

17、t;b>  2.1.2CSS</b></p><p>  級(jí)聯(lián)樣式表(Cascading Style Sheets,CSS),是1996年作為把有關(guān)樣式屬性信息如字體和邊框加到HTML文檔中的標(biāo)準(zhǔn)方法而提出來(lái)的。但是CSS與XML結(jié)合的確比與HTML結(jié)合得更好,因?yàn)镠TML承擔(dān)著CSS標(biāo)志和HTML標(biāo)志之間向后兼容的任務(wù)。例如,要正確地支持CSS和NOWRAP屬性,就要求廢除HTML中非標(biāo)準(zhǔn)的但

18、又是經(jīng)常使用的NOWRAP元素。由于XML元素沒(méi)有任何預(yù)定義的格式規(guī)定,所以不會(huì)限制何種CSS樣式只能用于何種元素。一個(gè)CSS樣式表就是一組規(guī)則。每個(gè)規(guī)則給出此規(guī)則所適用的元素的名稱,以及此規(guī)則要應(yīng)用于哪些元素的樣式。</p><p>  2.1.3文檔對(duì)象模型DOM</p><p>  DOM(Document Object Model)是提供給HTML和XML使用的一組API,提供了文

19、件的表述結(jié)構(gòu),并可以利用它改變其中的內(nèi)容和可見(jiàn)物。腳本語(yǔ)言通過(guò)DOM才可以跟頁(yè)面進(jìn)行交互。Web開(kāi)發(fā)人員可操作及建立文件的屬性、方法以及事件具都以對(duì)象來(lái)展現(xiàn),如document就代表頁(yè)面對(duì)象本身。</p><p>  2.1.4XHTML</p><p>  2000年底,國(guó)際W3C(World Wide Web Consortium)組織公布發(fā)行了XHTML1.0版本。XHTML1.0是

20、一種在HTML4.0基礎(chǔ)上優(yōu)化和改進(jìn)的新語(yǔ)言,目的是基于XML開(kāi)發(fā)應(yīng)用。XHTML扮演著類似于HTML角色的XML。所以,本質(zhì)上講,XHTML是一種過(guò)渡技術(shù),結(jié)合了XML(有幾分)的強(qiáng)大功能及HTML(大多數(shù))的簡(jiǎn)單特性,它的可擴(kuò)展性和靈活性將適應(yīng)未來(lái)網(wǎng)絡(luò)應(yīng)用更多的需求。</p><p><b>  2.1.5XML </b></p><p>  通過(guò)XML(eXte

21、nsible Markup Language)可以規(guī)范地定義結(jié)構(gòu)化數(shù)據(jù),使網(wǎng)上傳輸?shù)臄?shù)據(jù)和文檔符合統(tǒng)一標(biāo)準(zhǔn)。用XML表述的數(shù)據(jù)和文檔,可以很容易地讓所有程序共享。DOM以分層次對(duì)象模型來(lái)訪問(wèn)儲(chǔ)存在XML文檔中的信息,生成一棵節(jié)點(diǎn)樹(shù)(以XML文檔的結(jié)構(gòu)和信息為基礎(chǔ)),可以通過(guò)該樹(shù)來(lái)訪問(wèn)所需信息。</p><p>  2.2AJAX與傳統(tǒng)Web服務(wù)的比較</p><p>  AJAX確切地說(shuō),

22、不是一種新的技術(shù),而是一種技巧,這種技巧是以JavaScript為粘著劑,綜合XHTML,CSS,DOM,XML,XSTL,XMLHttpRequest等已存在的Web開(kāi)發(fā)技術(shù)而形成的協(xié)作開(kāi)發(fā)平臺(tái)。</p><p>  這個(gè)平臺(tái)主要是連接傳統(tǒng)的客戶端和Web服務(wù)器的一種引擎,上述的諸多技術(shù)都是為了保證這個(gè)引擎能夠?qū)崿F(xiàn)Web訪問(wèn)時(shí)客戶端和服務(wù)器端的異步數(shù)據(jù)傳輸。AJAX技術(shù)在新的Web開(kāi)發(fā)程序中所處的位置,如圖1所

23、示:</p><p>  圖1:AJAX與傳統(tǒng)Web服務(wù)的比較</p><p>  2.2.1傳統(tǒng)的Web應(yīng)用</p><p>  傳統(tǒng)的Web工作模式非常簡(jiǎn)單,就是瀏覽器發(fā)送HTTP請(qǐng)求,然后服務(wù)器接收到請(qǐng)求之后進(jìn)行處理,處理完畢服務(wù)器再傳回一個(gè)HTML/XHTML頁(yè)面到客戶端瀏覽器上顯示給用戶,簡(jiǎn)單的說(shuō),傳統(tǒng)Web的工作原理就是“提交請(qǐng)求——執(zhí)行操作——頁(yè)面重載

24、”的同步過(guò)程,這種工作方式難免會(huì)出現(xiàn)用戶等待的情況,得到返回結(jié)果前一直處于等待狀態(tài),無(wú)法滿足用戶對(duì)系統(tǒng)快速響應(yīng)的要求。</p><p>  2.2.2集成AJAX技術(shù)的Web應(yīng)用</p><p>  AJAX與傳統(tǒng)Web的不同之處在于服務(wù)應(yīng)答的異步性,AJAX就是在客戶端的瀏覽器與Web服務(wù)器之間新增了一層引擎,將用戶操作與服務(wù)器響應(yīng)異步化,使客戶端 向服務(wù)器發(fā)出的部分請(qǐng)求不需要等待返回結(jié)

25、果就可以繼續(xù)向服務(wù)器發(fā)出請(qǐng)求,同時(shí)這個(gè)引擎是在瀏覽器第一次與服務(wù)器進(jìn)行通信時(shí)就下載到客戶端的瀏覽器中,直到客戶端與服務(wù)器端通信完畢。</p><p>  2.2.3使用AJAX的優(yōu)勢(shì)</p><p>  AJAX全稱“Asynchronous JavaScript and XML”(異步JavaScript和XML),是指一種創(chuàng)建交互式網(wǎng)頁(yè)應(yīng)用的網(wǎng)頁(yè)開(kāi)發(fā)技術(shù)。借助于Ajax,可以在用戶單擊

26、按鈕時(shí),使用JavaScript和DHTML立即更新界面,并向服務(wù)器發(fā)出異步請(qǐng)求,以執(zhí)行更新或查詢數(shù)據(jù)庫(kù)。當(dāng)請(qǐng)求返回時(shí),就可以使用JavaScript和CSS來(lái)相應(yīng)地更新界面,而不是刷新整個(gè)界面。最重要的是,用戶甚至不知道瀏覽器正在與服務(wù)器通信,看起來(lái)就像是即時(shí)響應(yīng)的。</p><p>  3.應(yīng)用實(shí)例設(shè)計(jì)與分析</p><p><b>  3.1設(shè)計(jì)思想</b>&l

27、t;/p><p>  AJAX 不是一種新的編程語(yǔ)言,而是一種用于創(chuàng)建更好更快以及交互性更強(qiáng)的 Web 應(yīng)用程序的技術(shù)。通過(guò)JavaScript 中的XMLHttpRequest 對(duì)象就可以直接與服務(wù)器進(jìn)行通信。通過(guò)這個(gè)對(duì)象,可在不重載頁(yè)面的情況下與 Web 服務(wù)器交換數(shù)據(jù)。AJAX 在瀏覽器與 Web 服務(wù)器之間使用異步數(shù)據(jù)傳輸(HTTP 請(qǐng)求),這樣就可使網(wǎng)頁(yè)從服務(wù)器請(qǐng)求少量的信息,而不是整個(gè)頁(yè)面。本系統(tǒng)只抽取了

28、多媒體信息中的圖片,音樂(lè),文本,視頻來(lái)模擬AJAX在信息發(fā)布系統(tǒng)中是如何對(duì)信息進(jìn)行異步刷新,而實(shí)現(xiàn)對(duì)信息的實(shí)時(shí)更新。</p><p>  3.2系統(tǒng)的開(kāi)發(fā)測(cè)試環(huán)境</p><p>  系統(tǒng)開(kāi)發(fā)采用目前流行的AJAX技術(shù)。JavaScript具有跨平臺(tái)的特性,能確保系統(tǒng)在各種操作系統(tǒng)上運(yùn)行,具體開(kāi)發(fā)環(huán)境如下:</p><p>  開(kāi)發(fā)平臺(tái):MyEclipse8.6,D

29、reamweaver CS4</p><p>  Web服務(wù)器:Tomcat6.0.35</p><p>  編程語(yǔ)言:JavaScript,Java</p><p>  數(shù)據(jù)庫(kù):Oracle11g</p><p>  瀏覽器:IE8.0,firefox</p><p><b>  3.3系統(tǒng)功能設(shè)計(jì)<

30、/b></p><p>  系統(tǒng)的主要功能是在于用Ajax實(shí)現(xiàn)對(duì)信息的實(shí)時(shí)刷新,使得客戶端能夠隨時(shí)得到更新的數(shù)據(jù)。為實(shí)現(xiàn)此功能,系統(tǒng)設(shè)計(jì)了兩大模塊,即用戶和管理員模塊,管理員可以向數(shù)據(jù)庫(kù)上傳數(shù)據(jù),刪除數(shù)據(jù),用戶模塊主要是用來(lái)瀏覽系統(tǒng)的數(shù)據(jù),對(duì)由管理員上傳到數(shù)據(jù)庫(kù)的數(shù)據(jù)可以做到隨時(shí)更新隨時(shí)查看。這主要是通過(guò)在主頁(yè)面上注冊(cè)onclick事件來(lái)向后臺(tái)發(fā)送AJAX請(qǐng)求得到數(shù)據(jù)。系統(tǒng)功能模塊如圖2所示:</p&

31、gt;<p><b>  圖2:系統(tǒng)功能模塊</b></p><p>  3.4系統(tǒng)總體Web框架</p><p>  3.4.1系統(tǒng)的分層架構(gòu)設(shè)計(jì)</p><p>  系統(tǒng)層次采用三層結(jié)構(gòu),這三個(gè)結(jié)構(gòu)相互獨(dú)立且又緊密聯(lián)系:</p><p>  第一層表示層:Web瀏覽器</p><p&

32、gt;  在表示層中包含系統(tǒng)的顯示邏輯,位于客戶端。它的任務(wù)是由Web瀏覽器向網(wǎng)絡(luò)上的Web服務(wù)器提出服務(wù)請(qǐng)求,Web服務(wù)器對(duì)用戶身份進(jìn)行驗(yàn)證后用HTTP協(xié)議把所需的主頁(yè)傳給客戶端,客戶機(jī)接受傳過(guò)來(lái)的主頁(yè)文件,并把它顯示在瀏覽器上。</p><p>  第二層業(yè)務(wù)邏輯層:具有應(yīng)用程序擴(kuò)展功能的Web服務(wù)器</p><p>  在功能層中包含系統(tǒng)的事務(wù)處理邏輯,位于Web服務(wù)器端,它的任務(wù)是

33、接受用戶的請(qǐng)求,首先需要執(zhí)行相應(yīng)的擴(kuò)展應(yīng)用程序與數(shù)據(jù)庫(kù)進(jìn)行連接,通過(guò)SQL等方式向數(shù)據(jù)庫(kù)服務(wù)器提出數(shù)據(jù)處理申請(qǐng),而后等數(shù)據(jù)庫(kù)服務(wù)器將數(shù)據(jù)處理的結(jié)果提交給Web服務(wù)器,再由Web服務(wù)器傳回客戶端,在業(yè)務(wù)層運(yùn)用MVC設(shè)計(jì)模式,具有松散的耦合、并行的開(kāi)發(fā),可擴(kuò)展性和可重用性良好等眾多優(yōu)點(diǎn)。</p><p>  第三層數(shù)據(jù)訪問(wèn)層:數(shù)據(jù)庫(kù)服務(wù)器</p><p>  在數(shù)據(jù)層中包含系統(tǒng)的數(shù)據(jù)處理邏輯,

34、位于數(shù)據(jù)庫(kù)服務(wù)器端,它的任務(wù)是接受Web服務(wù)器對(duì)數(shù)據(jù)庫(kù)操縱的請(qǐng)求,實(shí)現(xiàn)對(duì)數(shù)據(jù)庫(kù)查詢,修改,更新等功能,把運(yùn)行結(jié)果提交給Web服務(wù)器。</p><p>  系統(tǒng)整體交互圖,如圖3所示:</p><p>  圖3:系統(tǒng)整體交互圖</p><p>  3.4.2結(jié)合AJAX的MVC模式</p><p>  MVC(Model—View—Contro

35、ler,模型—視圖—控制器)至今已經(jīng)被廣泛使用,并被推薦為SUN公司J2EE平臺(tái)的設(shè)計(jì)模式,其為開(kāi)發(fā)交互式應(yīng)用系統(tǒng)提供了一個(gè)優(yōu)秀的設(shè)計(jì)模式,受到越來(lái)越多開(kāi)發(fā)者的歡迎。 MVC結(jié)構(gòu)框架的組成部分包括以下的內(nèi)容:</p><p>  (1)模型(Model)</p><p>  模型包含了應(yīng)用程序的核心,它封裝了應(yīng)用程序的數(shù)據(jù)結(jié)構(gòu)和事務(wù)邏輯,集中體現(xiàn)了應(yīng)用程序的狀態(tài)。有時(shí)候僅包含狀態(tài)信息,因?yàn)?/p>

36、它并不了解視圖或控制器的信息。JavaBean很適合扮演這個(gè)角色,因?yàn)槠淠軌蛱幚斫^大部分事務(wù)邏輯和數(shù)據(jù)結(jié)構(gòu),還能與數(shù)據(jù)庫(kù)或文件系統(tǒng)進(jìn)行交到,承擔(dān)維護(hù)應(yīng)用程序數(shù)據(jù)的責(zé)任。</p><p> ?。?)視圖(View)</p><p>  視圖實(shí)現(xiàn)模塊的外觀,它是應(yīng)用程序的外在表現(xiàn)。它可以訪問(wèn)模型的數(shù)據(jù),卻不了解模型的情況,同時(shí)它也不了解控制的情況 。當(dāng)模型發(fā)生改變時(shí),視圖會(huì)得到通知,它可以訪問(wèn)

37、模型的數(shù)據(jù),但不能改變這些數(shù)據(jù)。</p><p> ?。?)控制(Controller)</p><p>  可以理解為從用戶接收請(qǐng)求,將模型與視圖匹配在一起,共同完成用戶的請(qǐng)求。劃分控制層的作用也很明顯,它清楚地告訴你,它就是一個(gè)分發(fā)器,選擇什么樣的模型,選擇什么樣的視圖,可以完成什么樣的用戶請(qǐng)求??刂茖硬⒉蛔鋈魏蔚臄?shù)據(jù)處理。AJAX在視圖中通過(guò)Onreadystatechange事件監(jiān)

38、聽(tīng)來(lái)自模型或控制器的數(shù)據(jù)更新。</p><p>  3.5系統(tǒng)動(dòng)態(tài)模型分析</p><p>  3.5.1基于AJAX的操作協(xié)議</p><p>  AJAX操作協(xié)議如圖4所示:</p><p>  圖4:基于AJAX的操作協(xié)議圖</p><p>  3.6 AJAX與Servlet交互代碼的主要實(shí)現(xiàn)</p>

39、;<p> ?。?)AJAX對(duì)象的創(chuàng)建:</p><p>  //創(chuàng)建AJAX對(duì)象,主要把瀏覽器分成兩種,IE和非IE瀏覽器</p><p>  createXMLHttpRequest : function() {</p><p>  var xmlHttp = null; //http請(qǐng)求對(duì)象</p><p><b&g

40、t;  try {</b></p><p>  if (window.ActiveXObject) {</p><p>  //IE提供xmlhttprequest對(duì)象的應(yīng)用程序</p><p>  var versions = [ "MSXML2.XMLHttp.5.0", "MSXML2.XMLHttp.4.0"

41、;,</p><p>  "MSXML2.XMLHttp.3.0", "MSXML2.XMLHttp", "Microsoft.XMLHttp" ];</p><p>  for ( var i = 0; i < versions.length; i++) {</p><p><b>  t

42、ry {</b></p><p>  xmlHttp = new ActiveXObject(versions[i]);</p><p><b>  break;</b></p><p>  } catch (onError) {</p><p>  //此處什么也不做,繼續(xù)循環(huán)</p><

43、;p><b>  }</b></p><p><b>  }</b></p><p>  //表示當(dāng)前瀏覽器不是IE,如ns,firefox,xmlHttp是內(nèi)置對(duì)象</p><p>  } else if (window.XMLHttpRequest) {</p><p>  xmlHttp

44、 = new XMLHttpRequest();</p><p><b>  }</b></p><p>  } catch (er) {</p><p>  throw new Error("XMLHttp object could not be created.");</p><p><b&

45、gt;  }</b></p><p>  return xmlHttp;</p><p><b>  }</b></p><p> ?。?)發(fā)送AJAX請(qǐng)求:</p><p>  AJAX請(qǐng)求發(fā)送的方式有兩種GET和POST,與POST相比,GET更簡(jiǎn)單也更快,并具在大部分情況下都能用。但有些情況卻是不能使用

46、GET來(lái)發(fā)送請(qǐng)求,如下所示:</p><p>  ①無(wú)法使用緩存文件(更新服務(wù)器上的文件或數(shù)據(jù)庫(kù))</p><p> ?、谙蚍?wù)器發(fā)送大量數(shù)據(jù)(POST沒(méi)有數(shù)據(jù)量的限制)</p><p>  ③發(fā)送包含未知字符的用戶輸入時(shí),POST比GET更穩(wěn)定也更可靠</p><p>  xmlHttp.open(“get”,url,true);</

47、p><p>  xmlHttp.send(null);</p><p>  open(method,url,async)中的參數(shù)method為請(qǐng)求的類型,GET或POST,url為文件在服務(wù)器上的位置,即要請(qǐng)求的目的地。Async是設(shè)置請(qǐng)求是異步或是同步,true(異步)或false(同步),一般情況下都會(huì)將async設(shè)置為true,因?yàn)锳JAX的目的就是異步請(qǐng)求數(shù)據(jù),如果設(shè)置為false,那

48、么AJAX也就失去了他的特性。</p><p>  Send(string)將請(qǐng)求發(fā)送到服務(wù)器,string僅用于POST請(qǐng)求。</p><p> ?。?)設(shè)置回調(diào)函數(shù):</p><p>  xmlHttp.onreadystatechange = function(){</p><p>  if (xmlHttp.readyState ==

49、 4) {</p><p><b>  //處理正確</b></p><p>  if (xmlHttp.status == 200) {</p><p>  //用responseText拿到響應(yīng)回來(lái)的數(shù)據(jù)</p><p>  process(xmlHttp.responseText); </p><

50、;p><b>  }</b></p><p><b>  } else {</b></p><p>  //如果沒(méi)有得到響應(yīng),則返回一個(gè)null值。</p><p>  process(null);</p><p><b>  }</b></p><p

51、><b>  }</b></p><p>  readyState用來(lái)描述XMLHttpRequest的請(qǐng)求狀態(tài),總共有5種狀態(tài)(0-4)。</p><p>  0:表示請(qǐng)求未初始化</p><p>  1:服務(wù)器連接已建立</p><p><b>  2:請(qǐng)求已接收</b></p>

52、;<p><b>  3:請(qǐng)求處理中</b></p><p>  4:請(qǐng)求已完成,且響應(yīng)已就緒</p><p>  Status用來(lái)描述響應(yīng)的狀態(tài),總共有2種結(jié)果。202:表示“OK”,404:表示未找到頁(yè)面。</p><p> ?。?)利用JSON實(shí)現(xiàn)對(duì)數(shù)據(jù)的操作:</p><p>  //為respon

53、se設(shè)置輸出對(duì)象</p><p>  PrintWriter out = response.getWriter();</p><p>  //創(chuàng)建JSON數(shù)組,并且將查詢得到的fileInforList放入數(shù)組中</p><p>  JSONArray array = JSONArray.fromObject(fileInforList);</p>&

54、lt;p>  //創(chuàng)建JSON對(duì)象</p><p>  JSONObject obj_json = new JSONObject();</p><p>  obj_json.put("showFilesPath", array);</p><p>  //將包裝好的JSON對(duì)象響應(yīng)到前臺(tái)</p><p>  out.

55、write(obj_json.toString());</p><p>  (5)處理從后臺(tái)得到的數(shù)據(jù):</p><p>  //調(diào)用已經(jīng)包裝好的doGet方法 doGetText(url,queryObj,process)</p><p>  url: 表示請(qǐng)求地址</p><p>  queryObj:表示請(qǐng)求時(shí)需要傳遞的參數(shù)</p

56、><p>  process:表示一個(gè)用來(lái)處理響應(yīng)回來(lái)的數(shù)據(jù)的方法</p><p>  $Ajax.doGetText("AjaxServlet", {path :path,method : "selectList"}, function(data){</p><p>  if(data!=null){</p>&l

57、t;p>  var obj_text = eval('('+data+')');</p><p>  var objs_filePath=obj_text.showFilesPath;</p><p>  var div_text = document.getElementById("content");</p>&l

58、t;p>  //判斷div塊中是否已有結(jié)點(diǎn),如果有,則移除。</p><p>  while(div_text.firstChild){</p><p>  div_text.removeChild(div_text.firstChild);</p><p><b>  } </b></p><p>  //循環(huán)響

59、應(yīng)回來(lái)的數(shù)據(jù),并且加入到div塊中。</p><p>  for(var i=0;i<objs_filePath.length;i++){</p><p>  var pNode = document.createElement("p");</p><p>  pNode.setAttribute("class",&qu

60、ot;p_pos");</p><p>  div_text.appendChild(pNode);</p><p>  //alert(objs_filePath[i].fileName);</p><p>  var textNode = document.createTextNode(objs_filePath[i].file_name);</

61、p><p>  div_text.appendChild(textNode);</p><p><b>  } </b></p><p><b>  }</b></p><p><b>  })</b></p><p>  3.7系統(tǒng)類結(jié)構(gòu)設(shè)計(jì)</p&

62、gt;<p>  類圖用來(lái)顯示系統(tǒng)類的關(guān)系(如繼承、聚合、關(guān)聯(lián))。對(duì)于一個(gè)系統(tǒng),如何從問(wèn)題域中抽象出類,定義類的操作和屬性,并描述類與類之間的關(guān)系,是整個(gè)建模過(guò)程的關(guān)鍵。系統(tǒng)總體類圖如圖5所示:</p><p>  圖5:系統(tǒng)總功能類圖</p><p>  3.8系統(tǒng)數(shù)據(jù)庫(kù)結(jié)構(gòu)設(shè)計(jì)</p><p>  數(shù)據(jù)庫(kù)的設(shè)計(jì)是整個(gè)系統(tǒng)中不可缺少的關(guān)鍵部分,系統(tǒng)各

63、項(xiàng)功能的實(shí)現(xiàn),最終通過(guò)對(duì)數(shù)據(jù)庫(kù)進(jìn)行各項(xiàng)操作來(lái)完成,因此要實(shí)現(xiàn)系統(tǒng)的所有功能,就必須合理的構(gòu)建一個(gè)功能完善的數(shù)據(jù)庫(kù)。設(shè)計(jì)數(shù)據(jù)表的時(shí)候充分考慮到系統(tǒng)的特點(diǎn),使表與表之間的結(jié)構(gòu)清晰而合理。</p><p>  表1:文件保存信息表</p><p><b>  表2:用戶信息表</b></p><p>  3.9系統(tǒng)的主要功能實(shí)現(xiàn)</p>

64、<p>  整個(gè)系統(tǒng)分為兩大子系統(tǒng),用戶操作系統(tǒng),管理員管理系統(tǒng)。</p><p>  3.9.1基于AJAX技術(shù)的查詢?yōu)g覽模塊,即用戶模塊</p><p>  客戶端是一個(gè)公共的信息輸出模塊,即使用戶不注冊(cè)也能瀏覽一些網(wǎng)頁(yè)的基本信息,數(shù)據(jù)庫(kù)的每次更新,客戶端都可以實(shí)時(shí)接收到來(lái)自于服務(wù)端最新數(shù)據(jù),使用用戶可以在最短的時(shí)間內(nèi)瀏覽更多的信息,這也是AJAX的最主要的功能,即異步刷新

65、,無(wú)需用戶手動(dòng)刷新整個(gè)頁(yè)面即可達(dá)到更新的效果。用戶界面的登錄后顯示的用戶名是在整個(gè)session共享的一個(gè)數(shù)據(jù),如果用戶想離開(kāi)這個(gè)頁(yè)面,即點(diǎn)擊右上角的退出注銷掉登錄信息。</p><p><b>  3.9.2管理模塊</b></p><p>  管理模塊由管理員進(jìn)行管理,這里只使用了普通的Servlet技術(shù),用來(lái)的數(shù)據(jù)庫(kù)的數(shù)據(jù)進(jìn)行增冊(cè)改查的功能,是管理員達(dá)到管理數(shù)據(jù)

66、的一個(gè)模塊。因?yàn)閷?duì)文檔的管理只建了一張表,所有的信息都是保存在這張表中,對(duì)于不同的媒體信息主要是采用保存在不同的文件夾來(lái)實(shí)現(xiàn)管理的,同時(shí)也實(shí)現(xiàn)了分布查詢的功能,使用信息更加易于管理。在用戶模塊也是采取路徑來(lái)對(duì)不同的信息進(jìn)行查詢的。因?yàn)檫@個(gè)系統(tǒng)的主要目的是在研究AJAX技術(shù),所以管理員沒(méi)有進(jìn)行建表,只是通過(guò)簡(jiǎn)單的已給定的用戶名和密碼來(lái)進(jìn)行登錄驗(yàn)證。對(duì)于管理模塊中除登錄頁(yè)面之外的其它頁(yè)面采取了保護(hù)措施,通過(guò)過(guò)濾器來(lái)實(shí)現(xiàn)對(duì)其內(nèi)容的保護(hù)。<

67、;/p><p>  實(shí)現(xiàn)了對(duì)信息的分頁(yè)查詢:</p><p>  對(duì)分頁(yè)功能實(shí)現(xiàn)的截圖如圖6所示:</p><p>  圖6:信息查詢分布圖</p><p>  (2)對(duì)上傳文件進(jìn)行歸檔處理</p><p>  根據(jù)提交的表單數(shù)據(jù)來(lái)獲得并截取文件后綴來(lái)判斷文件所屬類別,然后設(shè)置文件存儲(chǔ)徑,使得上傳的文件井井有條,目錄設(shè)置如

68、圖7所示:</p><p><b>  圖7:文檔存放目錄</b></p><p> ?。?)對(duì)文件進(jìn)行刪除</p><p>  在MVC的業(yè)務(wù)層,用事務(wù)來(lái)控制數(shù)據(jù)庫(kù)和文件進(jìn)行級(jí)聯(lián)刪除,如果在進(jìn)行數(shù)據(jù)刪除時(shí),發(fā)生異常,則事務(wù)中止,即文件不會(huì)被刪除,達(dá)到了事務(wù)的一致性。</p><p>  4.系統(tǒng)測(cè)試運(yùn)行效果及結(jié)果分析&

69、lt;/p><p>  下面主要給出一些實(shí)際運(yùn)行效果圖并有一些相關(guān)的簡(jiǎn)單描述。</p><p><b>  4.1管理模塊</b></p><p>  管理員登錄頁(yè)面如圖8所示:</p><p>  圖8:管理員登錄頁(yè)面 </p><p>  管理員操作主頁(yè)面如圖9所示: </p>&l

70、t;p>  圖9:管理員操作主頁(yè)面</p><p>  上傳文檔頁(yè)面如圖10所示:</p><p>  圖10:上傳文檔頁(yè)面</p><p><b>  4.2用戶瀏覽模塊</b></p><p>  用戶注冊(cè)和登錄頁(yè)面如圖11所示:</p><p>  圖11:用戶注冊(cè)、登錄頁(yè)面</

71、p><p>  登錄后主頁(yè)面如圖12所示:</p><p>  圖10:登錄后主頁(yè)面</p><p>  5.系統(tǒng)性能和安全分析</p><p>  在使用AJAX的過(guò)程中,我們不僅需要解決由于引入AJAX可能對(duì)原有一些操作產(chǎn)生的影響問(wèn)題,同時(shí)還要考慮AJAX自身可能會(huì)出現(xiàn)的一些問(wèn)題。</p><p><b> 

72、 5.1性能問(wèn)題</b></p><p>  由于AJAX應(yīng)用將大量的運(yùn)算轉(zhuǎn)移到了客戶端,這就能客戶端帶來(lái)了很大的壓力,主要體現(xiàn)在以下幾個(gè)方面: </p><p> ?。?)JavaScript是一門(mén)解釋型的語(yǔ)言,效率不是很高。它不同于高級(jí)編程語(yǔ)言,如Java,C++,C#等。</p><p>  (2)一次加載數(shù)據(jù)過(guò)多顯然會(huì)導(dǎo)致頁(yè)面打開(kāi)速度變慢。用戶每

73、次打開(kāi)AJAX應(yīng)用程序時(shí)都需要下載相關(guān)的JavaScript代碼,如果應(yīng)用比較復(fù)雜,這些代碼的體積可能非常龐大,勢(shì)必會(huì)影響頁(yè)面的打開(kāi)速度,降低用戶體驗(yàn)。</p><p> ?。?)頻繁的服務(wù)器端調(diào)用也可能帶來(lái)服務(wù)器端的性能問(wèn)題。在AJAX應(yīng)用中,由于其交互特點(diǎn)AJAX需要更多的服務(wù)器調(diào)用,盡管每次調(diào)用的代價(jià)比較小,但如果數(shù)量很大,同樣會(huì)影響服務(wù)器端的效率。</p><p><b>

74、;  5.2解決方案</b></p><p>  JavaScript是一種解釋型語(yǔ)言,其所有的源代碼會(huì)被提交到客戶端瀏覽器,因此源代碼的體積會(huì)影響下載速度。要改善這種情況,一種方案就是壓縮JavaScript代碼,經(jīng)過(guò)良好的壓縮后,一段JavaScript代碼可以有效的減少其大小。刪除無(wú)用的注釋和無(wú)用空白字符,這點(diǎn)比較好理解,就是減少代碼空間體積。還可以通過(guò)設(shè)計(jì)良好的代碼格式來(lái)使得瀏覽器第一次載入時(shí)

75、的負(fù)擔(dān)。很顯然,如果一次載入所有需要的JavaScript代碼會(huì)使初始網(wǎng)頁(yè)打開(kāi)速度慢。事實(shí)上,有很載入并不是必須的,因此應(yīng)避免這種性能上的浪費(fèi),采用動(dòng)態(tài)載入JavaScript代碼可以解決這一問(wèn)題。</p><p><b>  5.3安全性分析</b></p><p>  關(guān)于系統(tǒng)的安全問(wèn)題可能涉及的方面會(huì)很多,尤其是在Web應(yīng)用中安全問(wèn)題顯得更為突出。從本質(zhì)上講,A

76、JAX應(yīng)用程序和傳統(tǒng)Web應(yīng)用程序一樣也會(huì)面臨很多的安全問(wèn)題,許多Web應(yīng)用中可能出現(xiàn)的問(wèn)題在AJAX應(yīng)用中同樣不可避免,比如服務(wù)器程序編寫(xiě)不當(dāng)導(dǎo)致的運(yùn)程代碼執(zhí)行、權(quán)限提升、信息泄漏、內(nèi)容修改等等。這里主要圍繞AJAX的安全性問(wèn)題進(jìn)行分析,與傳統(tǒng)的Web應(yīng)用不同,AJAX很好的平衡了客戶端和服務(wù)器端的任務(wù),但也正由于此,AJAX程序中更多的控制都被帶到了客戶端,因此可能帶來(lái)的安全隱患也更大。這里充當(dāng)分擔(dān)服務(wù)器端任務(wù)的就是在AJAX中大量

77、使用的JavaScript。</p><p><b>  參考文獻(xiàn):</b></p><p>  [1]Dave Crane,Eric Pascarello,Darren James.Ajax實(shí)戰(zhàn) ajaxcn.org 譯。人民郵電出版社</p><p>  [2]Tom Negrino,Dori Smith。JavaScript基礎(chǔ)教程(第7

78、版)陳劍甌 譯。人民郵電出版社</p><p>  [3]Ryan Asleson,Nathaniel T.Schutta.Ajax基礎(chǔ)教程 金靈 譯。人民郵電出版社</p><p>  [4]Jeremy Keith.JavaScript DOM編程藝術(shù)。王建橋,楊曉云 譯。人民郵電出版社</p><p>  [5]Nicholas C.Zakas. JavaSc

79、ript高級(jí)程序設(shè)計(jì)。李松峰,曹力 譯。人民郵電出版社</p><p>  [6]Ben Forta.SQL必知必會(huì)(第3版)。鐘銘,劉曉霞 譯。人民郵電出版社</p><p>  [7]陳鋒敏。Ajax原理與系統(tǒng)開(kāi)發(fā)。2009年8月第1次印刷。清華大學(xué)出版社</p><p>  [8]柯昌正,黃厚寬。AJAX技術(shù)的原理與應(yīng)用[J]。鐵路計(jì)算機(jī)應(yīng)用,2007,16(

80、1):27-29 </p><p>  [9]馬騎麗。Ajax技術(shù)原理及應(yīng)用[J],計(jì)算機(jī)光盤(pán)軟件與應(yīng)用,2010(10):69-70</p><p>  [10]譚力,楊宗源,謝瑾奎。Ajax技術(shù)的數(shù)據(jù)響應(yīng)優(yōu)化[J]。計(jì)算機(jī)工程,2010,36(7):52-54</p><p>  [11]馬綺麗. Ajax技術(shù)原理及就用[期刊論文]-計(jì)算機(jī)光盤(pán)軟件與應(yīng)用2010

81、(10)</p><p>  [12]邢永峰.Dreamweaver網(wǎng)頁(yè)設(shè)計(jì)[M].北京:中國(guó)水利水電出版社,2007.</p><p>  [13]劉曉化.JSP應(yīng)用開(kāi)發(fā)詳解[M].北京:電子工業(yè)出版社,2007.</p><p>  [14]趙池龍.軟件工程實(shí)踐教程[M].北京:電子工業(yè)出版社,2006.</p><p>  [15]王沛

82、.征服AJAX web2.0開(kāi)發(fā)技術(shù)詳解[M].北京:電子工業(yè)出版社,2007</p><p>  The Ajax application about Web Information System</p><p>  Abstract:Information dissemination and transmission refers to the process which the in

83、formation transmitted from a sender to a receiver.This process includes three basic elements:the sender,the receiver and the transmission channels.With the rapid development of network communication and the computer tech

84、nology,the information transmission in the form of network communication has become a mainstream mode of modern information publishing system and the form of Web services has gradually diversifi</p><p>  Key

溫馨提示

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

最新文檔

評(píng)論

0/150

提交評(píng)論