百科解釋
目錄·AJAX介紹·AJAX示例程序·主要包含了以下幾種技術(shù)·發(fā)展史·優(yōu)點(diǎn)和缺點(diǎn)·Ajax圖書·基礎(chǔ)應(yīng)用·基于Ajax的應(yīng)用程序架構(gòu)匯總·開發(fā)Ajax應(yīng)用面臨的問題及解決方案 AJAX即“Asynchronous Javas cript and XML”(異步Javas cript和XML),AJAX并非縮寫詞,而是由Jesse James Gaiiett創(chuàng)造的名詞,是指一種創(chuàng)建交互式網(wǎng)頁應(yīng)用的網(wǎng)頁開發(fā)技術(shù)。 AJAX介紹 國內(nèi)通常的讀音為“阿賈克斯”和阿賈克斯足球隊(duì)讀音一樣。Web應(yīng)用的交互如Flickr, Backpack和Google在這方面已經(jīng)有質(zhì)的飛躍。這個(gè)術(shù)語源自描述從基于網(wǎng)頁的Web應(yīng)用到基于數(shù)據(jù)的應(yīng)用的轉(zhuǎn)換。在基于數(shù)據(jù)的應(yīng)用中,用戶需求的數(shù)據(jù)如聯(lián)系人列表,可以從獨(dú)立于實(shí)際網(wǎng)頁的服務(wù)端取得并且可以被動(dòng)態(tài)地寫入網(wǎng)頁中,給緩慢的Web應(yīng)用體驗(yàn)著色使之像桌面應(yīng)用一樣。 雖然大部分開發(fā)人員在過去使用過XMLHttp或者使用Iframe來加載數(shù)據(jù),但僅到現(xiàn)在我們才看到傳統(tǒng)的開發(fā)人員和公司開始采用這些技術(shù)。就像新的編程語言或模型伴隨著更多的痛苦,開發(fā)人員需要學(xué)習(xí)新的技巧及如何最好利用這些新技術(shù)。 AJAX模式 許多重要的技術(shù)和AJAX開發(fā)模式可以從現(xiàn)有的知識中獲取。例如,在一個(gè)發(fā)送請求到服務(wù)端的應(yīng)用中,必須包含請求順序、優(yōu)先級、超時(shí)響應(yīng)、錯(cuò)誤處理及回調(diào),其中許多元素已經(jīng)在Web服務(wù)中包含了,就像現(xiàn)在的SOA。AJAX開發(fā)人員擁有一個(gè)完整的系統(tǒng)架構(gòu)知識。同時(shí),隨著技術(shù)的成熟還會有許多地方需要改進(jìn),特別是UI部分的易用性。 AJAX開發(fā)與傳統(tǒng)的CS開發(fā)有很大的不同。這些不同引入了新的編程問題,最大的問題在于易用性。由于AJAX依賴瀏覽器的Javas cript和XML,瀏覽器的兼容性和支持的標(biāo)準(zhǔn)也變得和Javas cript的運(yùn)行時(shí)性能一樣重要了。這些問題中的大部分來源于瀏覽器、服務(wù)器和技術(shù)的組合,因此必須理解如何才能最好的使用這些技術(shù)。 綜合各種變化的技術(shù)和強(qiáng)耦合的客戶服務(wù)端環(huán)境,AJAX提出了一種新的開發(fā)方式。AJAX開發(fā)人員必須理解傳統(tǒng)的MVC架構(gòu),這限制了應(yīng)用層次之間的邊界。同時(shí),開發(fā)人員還需要考慮CS環(huán)境的外部和使用AJAX技術(shù)來重定型MVC邊界。最重要的是,AJAX開發(fā)人員必須禁止以頁面集合的方式來考慮Web應(yīng)用而需要將其認(rèn)為是單個(gè)頁面。一旦UI設(shè)計(jì)與服務(wù)架構(gòu)之間的范圍被嚴(yán)格區(qū)分開來后,開發(fā)人員就需要更新和變化的技術(shù)集合了。 時(shí)刻想著用戶 AJAX的最大機(jī)遇在于用戶體驗(yàn)。在使應(yīng)用更快響應(yīng)和創(chuàng)新的過程中,定義Web應(yīng)用的規(guī)則正在被重寫;因此開發(fā)人員必須更注重用戶,F(xiàn)在用戶已經(jīng)逐漸習(xí)慣如何使用Web應(yīng)用了。例如用戶通常希望每一次按鈕點(diǎn)擊會導(dǎo)致幾秒的延遲和屏幕刷新,但AJAX正在打破這種長時(shí)間的狀況。因此用戶需要重新體驗(yàn)按鈕點(diǎn)擊的響應(yīng)了。 可用性是AJAX令人激動(dòng)的地方而且已經(jīng)產(chǎn)生了幾種新穎的技術(shù)。其中最引人注目的是一種稱為“黃色隱出”的技術(shù),他在數(shù)據(jù)更新之前時(shí)將用戶界面變?yōu)辄S色,更新完成后立刻恢復(fù)原來的顏色。AJAX開發(fā)人員將用戶從Web應(yīng)用的負(fù)載中解放出來;小心地利用AJAX提供的豐富接口,不久桌面開發(fā)人員會發(fā)現(xiàn)AJAX是他們的方向。 幾種工具和技術(shù) 隨著AJAX迅速地引人注目起來,我想開發(fā)人員對這種技術(shù)的期待也迅速地增加。就像任何新技術(shù),AJAX的興旺也需要一整個(gè)開發(fā)工具/編程語言及相關(guān)技術(shù)系統(tǒng)來支撐。 Javas cript 如名字所示AJAX的概念中最重要而最被忽視的是他也是一種Javas cript編程語言。Javas cript是一種粘合劑使AJAX應(yīng)用的各部分集成在一起。在大部分時(shí)間,Javas cript通常被服務(wù)端開發(fā)人員認(rèn)為是一種企業(yè)級應(yīng)用不需要使用的東西應(yīng)該盡力避免。這種觀點(diǎn)來來自以前編寫Javas cript代碼的經(jīng)歷:繁雜而又易出錯(cuò)的語言。類似的,他也被認(rèn)為將應(yīng)用邏輯任意地散布在服務(wù)端和客戶端中,這使得問題很難被發(fā)現(xiàn)而且代碼很難重用。在AJAX中Javas cript主要被用來傳遞用戶界面上的數(shù)據(jù)到服務(wù)端并返回結(jié)果。XMLHttpRequest對象用來響應(yīng)通過HTTP傳遞的數(shù)據(jù),一旦數(shù)據(jù)返回到客戶端就可以立刻使用DOM將數(shù)據(jù)放到網(wǎng)面上。 XMLHttpRequest XMLHttpRequest對象在大部分瀏覽器上已經(jīng)實(shí)現(xiàn)而且擁有一個(gè)簡單的接口允許數(shù)據(jù)從客戶端傳遞到服務(wù)端,但并不會打斷用戶當(dāng)前的操作。使用XMLHttpRequest傳送的數(shù)據(jù)可以是任何格式,雖然從名字上建議是XML格式的數(shù)據(jù)。 開發(fā)人員應(yīng)該已經(jīng)熟悉了許多其他XML相關(guān)的技術(shù)。XPath可以訪問XML文檔中的數(shù)據(jù),但理解XML DOM是必須的。類似的,XSLT是最簡單而快速的從XML數(shù)據(jù)生成HTML或XML的方式。許多開發(fā)人員已經(jīng)熟悉Xpath和XSLT,因此AJAX選擇XML作為數(shù)據(jù)交換格式有意義的。XSLT可以被用在客戶端和服務(wù)端,他能夠減少大量的用Javas cript編寫的應(yīng)用邏輯。 CSS 為了正確的瀏覽AJAX應(yīng)用,CSS是一種AJAX開發(fā)人員所需要的重要武器。CSS提供了從內(nèi)容中分離應(yīng)用樣式和設(shè)計(jì)的機(jī)制。雖然CSS在AJAX應(yīng)用中扮演至關(guān)重要的角色,但他也是構(gòu)建創(chuàng)建跨瀏覽器應(yīng)用的一大阻礙,因?yàn)椴煌臑g覽器廠商支持各種不同的CSS級別。 服務(wù)器端 但不像在客戶端,在服務(wù)端AJAX應(yīng)用還是使用建立在如Java,.Net和PHP語言基礎(chǔ)上機(jī)制;并沒有改變這個(gè)領(lǐng)域中的主要方式。 既然如此,我們對Ruby o n Rails框架的興趣也就迅速增加了。在一年多前,Ruby o n Rails已經(jīng)吸引了大量開發(fā)人員基于其強(qiáng)大功能來構(gòu)建Web和AJAX應(yīng)用。雖然目前還有很多快速應(yīng)用開發(fā)工具存在,Ruby o n Rails看起來已經(jīng)儲備了簡化構(gòu)建AJAX應(yīng)用的能力。 開發(fā)工具 在實(shí)際構(gòu)建AJAX應(yīng)用中,你需要的不只是文本編輯器。既然是Javas cript非編譯的,他可以容易地編寫和運(yùn)行在瀏覽器中;然而,許多工具提供了有用的擴(kuò)展如語法高亮和智能完成。 不同的IDE提供了對Javas cript支持的不同等級。來自JetBrains的IntelliJ IDEA是一個(gè)用來Javas cript開發(fā)的更好的IDE,雖然許多開發(fā)人員也喜歡Microsoft’s Visual Studio產(chǎn)品(允諾會在最新的版本中改善對AJAX的支持)。Eclipse包含了兩個(gè)免費(fèi)的Javas cript編輯器插件和一個(gè)商業(yè)的來自ActiveStat的Komodo IDE。 另一個(gè)Javas cript和AJAX開發(fā)中的問題是調(diào)試?yán)щy。不同的瀏覽器提供不同的通常是隱藏的運(yùn)行時(shí)錯(cuò)誤信息,而Javas cript的缺陷如雙重變量賦值(通常是由于缺少數(shù)據(jù)類型)使得調(diào)試更加困難。在AJAX的開發(fā)中,調(diào)試就更復(fù)雜了,因?yàn)槠湫枰獦?biāo)識究竟是客戶端還是服務(wù)端產(chǎn)生的錯(cuò)誤。在過去,Javas cript調(diào)試的方法是刪除所有代碼然后一行行的增加直到錯(cuò)誤出現(xiàn)。現(xiàn)在,更多開發(fā)人員回到為IE準(zhǔn)備的Microsoft s cript Debugger和為Mozilla瀏覽器準(zhǔn)備的Venkman。 瀏覽器兼容性 Javas cript編程的最大問題來自不同的瀏覽器對各種技術(shù)和標(biāo)準(zhǔn)的支持。構(gòu)建一個(gè)運(yùn)行在不同瀏覽器(如IE和火狐)是一個(gè)困難的任務(wù)。因此幾種AJAX Javas cript框架或者生成基于服務(wù)端邏輯或標(biāo)記庫的Javas cript,或者提供符合跨瀏覽器AJAX開發(fā)的客戶端Javas cript庫。一些流行的框架包括:AJAX.Net, Backbase, Bitkraft, Django, DOJO, DWR, MochiKit, Prototype, Rico, Sajax, Sarissa, and s cript.aculo.us. 這些框架給開發(fā)人員更多的空間使得他們不需要擔(dān)心跨瀏覽器的問題。雖然這些框架提升了開發(fā)人員構(gòu)建應(yīng)用的能力,但由于廠商已經(jīng)開發(fā)了更細(xì)節(jié)的用戶界面的打包組件解決方案,因此在AJAX組件市場中需要考慮一些其他因素。例如提供通用用戶界面的組件如組合框和數(shù)據(jù)柵格的幾個(gè)廠商,都可以被用來在應(yīng)用中創(chuàng)建良好的通過類似電子數(shù)據(jù)表方式來查看和編輯數(shù)據(jù)的體驗(yàn)。但這些組件不僅是封裝了組件的用戶界面而且包括與服務(wù)端數(shù)據(jù)的通訊方式,這些組件通常使用基于標(biāo)記方式來實(shí)現(xiàn)如ASP.Net或JSF控件。 展望 最近IE和火狐之間的瀏覽器之爭變得火熱起來,因此AJAX開發(fā)人員需要足夠敏捷的作出反應(yīng)。關(guān)鍵點(diǎn)在一些問題如CSS或XML,雖然各種瀏覽器形成采用最新標(biāo)準(zhǔn)的不同陣營(如Mozilla擁抱SVG和E4X標(biāo)準(zhǔn)及在最新火狐BETA版本中使用XUL,而微軟使用自己的XAML技術(shù))。所有這些技術(shù)代表當(dāng)前AJAX主流Javas cript和XML的市場方向改變。 總的來說,AJAX開發(fā)人員必須盡快地跟進(jìn)最新的技術(shù)并利用高產(chǎn)的工具集。成功的AJAX開發(fā)人員還需要留心他們的使用者以避免將任何問題擴(kuò)大化。并且AJAX開發(fā)人員還需要持續(xù)地創(chuàng)新來創(chuàng)建增強(qiáng)Web應(yīng)用易用性的新方法。 AJAX示例程序 將以下文本放入一個(gè)HTML頁面即可看到效果,將會有兩次彈出提示,最后在頁面上顯示YES,表示完成 <s cript LANGUAGE="Javas cript"> <!-- function ajaxByJyking(){ var xmlhttp_request = ""; try{ if( window.ActiveXObject ){ for( var i = 5; i; i-- ){ try{ if( i == 2 ){ xmlhttp_request = new ActiveXObject( "Microsoft.XMLHTTP" ); } else{ xmlhttp_request = new ActiveXObject( "Msxml2.XMLHTTP." + i + ".0" ); xmlhttp_request.setRequestHeader("Content-Type","text/xml"); xmlhttp_request.setRequestHeader("Charset","gb2312"); } break;} catch(e){ xmlhttp_request = false; } } } else if( window.XMLHttpRequest ) { xmlhttp_request = new XMLHttpRequest(); if (xmlhttp_request.overrideMimeType) { xmlhttp_request.override.MimeType(&#39;&#39;text/xml&#39;&#39;); } } } catch(e){ xmlhttp_request = false; } xmlhttp_request.open(&#39;&#39;GET&#39;&#39;, &#39;&#39;http://www.yuling8.com&#39;&#39;, true); xmlhttp_request.send(null); xmlhttp_request.onreadystatechange = function(){ if (xmlhttp_request.readyState == 4) { // 收到完整的服務(wù)器響應(yīng) document.write("yes") } else{ alert(1) } } } ajaxByJyking(); //--> </s cript> 主要包含了以下幾種技術(shù) Ajax(Asynchronous Javas cript + XML)的定義 基于web標(biāo)準(zhǔn)(standards-based presentation)XHTML+CSS的表示; 使用 DOM(Document Object Model)進(jìn)行動(dòng)態(tài)顯示及交互; 使用 XML 和 XSLT 進(jìn)行數(shù)據(jù)交換及相關(guān)操作; 使用 XMLHttpRequest 進(jìn)行異步數(shù)據(jù)查詢、檢索; 使用 Javas cript 將所有的東西綁定在一起。英文參見Ajax的提出者Jesse James Garrett的原文,原文題目(Ajax: A New Approach to Web Applications)。 類似于DHTML或LAMP,AJAX不是指一種單一的技術(shù),而是有機(jī)地利用了一系列相關(guān)的技術(shù)。事實(shí)上,一些基于AJAX的“派生/合成”式(derivative/composite)的技術(shù)正在出現(xiàn),如“AFLAX”。 AJAX的應(yīng)用使用支持以上技術(shù)的web瀏覽器作為運(yùn)行平臺。這些瀏覽器目前包括:Mozilla、Firefox、Internet Explorer、Opera、Konqueror及Safari。但是Opera不支持XSL格式對象,也不支持XSLT。 發(fā)展史 該技術(shù)在1998年前后得到了應(yīng)用。允許客戶端腳本發(fā)送HTTP請求(XMLHTTP)的第一個(gè)組件由Outlook Web Access小組寫成。該組件原屬于微軟Exchange Server,并且迅速地成為了Internet Explorer 4.0的一部分。部分觀察家認(rèn)為,Outlook Web Access是第一個(gè)應(yīng)用了Ajax技術(shù)的成功的商業(yè)應(yīng)用程序,并成為包括Oddpost的網(wǎng)絡(luò)郵件產(chǎn)品在內(nèi)的許多產(chǎn)品的領(lǐng)頭羊。但是,2005年初,許多事件使得Ajax被大眾所接受。Google在它著名的交互應(yīng)用程序中使用了異步通訊,如Google討論組、Google地圖、Google搜索建議、Gmail等。Ajax這個(gè)詞由《Ajax: A New Approach to Web Applications》一文所創(chuàng),該文的迅速流傳提高了人們使用該項(xiàng)技術(shù)的意識。另外,對Mozilla/Gecko的支持使得該技術(shù)走向成熟,變得更為易用。 AJAX前景非常樂觀,可以提高系統(tǒng)性能,優(yōu)化用戶界面。AJAX現(xiàn)有直接框架AjaxPro,可以引入AjaxPro.2.dll文件,可以直接在前臺頁面JS調(diào)用后臺頁面的方法。但此框架與FORM驗(yàn)證有沖突。另微軟也引入了AJAX組建,需要添加AjaxControlToolkit.dll文件,可以在控件列表中出現(xiàn)相關(guān)控件。 優(yōu)點(diǎn)和缺點(diǎn) 傳統(tǒng)的web應(yīng)用允許用戶填寫表單(form),當(dāng)提交表單時(shí)就向web服務(wù)器發(fā)送一個(gè)請求。服務(wù)器接收并處理傳來的表單,然後返回一個(gè)新的網(wǎng)頁。這個(gè)做法浪費(fèi)了許多帶寬,因?yàn)樵谇搬醿蓚(gè)頁面中的大部分HTML代碼往往是相同的。由于每次應(yīng)用的交互都需要向服務(wù)器發(fā)送請求,應(yīng)用的響應(yīng)時(shí)間就依賴于服務(wù)器的響應(yīng)時(shí)間。這導(dǎo)致了用戶界面的響應(yīng)比本地應(yīng)用慢得多。 與此不同,AJAX應(yīng)用可以僅向服務(wù)器發(fā)送并取回必需的數(shù)據(jù),它使用SOAP或其它一些基于XML的web service接口,并在客戶端采用Javas cript處理來自服務(wù)器的響應(yīng)。因?yàn)樵诜⻊?wù)器和瀏覽器之間交換的數(shù)據(jù)大量減少,結(jié)果我們就能看到響應(yīng)更快的應(yīng)用。同時(shí)很多的處理工作可以在發(fā)出請求的客戶端機(jī)器上完成,所以Web服務(wù)器的處理時(shí)間也減少了。 使用Ajax的最大優(yōu)點(diǎn),就是能在不更新整個(gè)頁面的前提下維護(hù)數(shù)據(jù)。這使得Web應(yīng)用程序更為迅捷地回應(yīng)用戶動(dòng)作,并避免了在網(wǎng)絡(luò)上發(fā)送那些沒有改變過的信息。 Ajax不需要任何瀏覽器插件,但需要用戶允許Javas cript在瀏覽器上執(zhí)行。就像DHTML應(yīng)用程序那樣,Ajax應(yīng)用程序必須在眾多不同的瀏覽器和平臺上經(jīng)過嚴(yán)格的測試。隨著Ajax的成熟,一些簡化Ajax使用方法的程序庫也相繼問世。同樣,也出現(xiàn)了另一種輔助程序設(shè)計(jì)的技術(shù),為那些不支持Javas cript的用戶提供替代功能。 對應(yīng)用Ajax最主要的批評就是,它可能破壞瀏覽器后退按鈕的正常行為。在動(dòng)態(tài)更新頁面的情況下,用戶無法回到前一個(gè)頁面狀態(tài),這是因?yàn)闉g覽器僅能記下歷史記錄中的靜態(tài)頁面。一個(gè)被完整讀入的頁面與一個(gè)已經(jīng)被動(dòng)態(tài)修改過的頁面之間的差別非常微妙;用戶通常都希望單擊后退按鈕,就能夠取消他們的前一次操作,但是在Ajax應(yīng)用程序中,卻無法這樣做。不過開發(fā)者已想出了種種辦法來解決這個(gè)問題,當(dāng)中大多數(shù)都是在用戶單擊后退按鈕訪問歷史記錄時(shí),通過建立或使用一個(gè)隱藏的IFRAME來重現(xiàn)頁面上的變更。(例如,當(dāng)用戶在Google Maps中單擊后退時(shí),它在一個(gè)隱藏的IFRAME中進(jìn)行搜索,然后將搜索結(jié)果反映到Ajax元素上,以便將應(yīng)用程序狀態(tài)恢復(fù)到當(dāng)時(shí)的狀態(tài)。) 一個(gè)相關(guān)的觀點(diǎn)認(rèn)為,使用動(dòng)態(tài)頁面更新使得用戶難于將某個(gè)特定的狀態(tài)保存到收藏夾中。該問題的解決方案也已出現(xiàn),大部分都使用URL片斷標(biāo)識符(通常被稱為錨點(diǎn),即URL中#后面的部分)來保持跟蹤,允許用戶回到指定的某個(gè)應(yīng)用程序狀態(tài)。(許多瀏覽器允許Javas cript動(dòng)態(tài)更新錨點(diǎn),這使得Ajax應(yīng)用程序能夠在更新顯示內(nèi)容的同時(shí)更新錨點(diǎn)。)這些解決方案也同時(shí)解決了許多關(guān)于不支持后退按鈕的爭論。 進(jìn)行Ajax開發(fā)時(shí),網(wǎng)絡(luò)延遲——即用戶發(fā)出請求到服務(wù)器發(fā)出響應(yīng)之間的間隔——需要慎重考慮。不給予用戶明確的回應(yīng) ,沒有恰當(dāng)?shù)念A(yù)讀數(shù)據(jù) ,或者對XMLHttpRequest的不恰當(dāng)處理,都會使用戶感到延遲,這是用戶不欲看到的,也是他們無法理解的。通常的解決方案是,使用一個(gè)可視化的組件來告訴用戶系統(tǒng)正在進(jìn)行后臺操作并且正在讀取數(shù)據(jù)和內(nèi)容。 一些手持設(shè)備(如手機(jī)、PDA等)現(xiàn)在還不能很好的支持Ajax; 用Javas cript作的Ajax引擎,Javas cript的兼容性和DeBug都是讓人頭痛的事; Ajax的無刷新重載,由于頁面的變化沒有刷新重載那么明顯,所以容易給用戶帶來困擾――用戶不太清楚現(xiàn)在的數(shù)據(jù)是新的還是已經(jīng)更新過的;現(xiàn)有的解決有:在相關(guān)位置提示、數(shù)據(jù)更新的區(qū)域設(shè)計(jì)得比較明顯、數(shù)據(jù)更新后給用戶提示等; 對串流媒體的支持沒有FLASH、Java Applet好; Ajax圖書 Ajax基礎(chǔ)教程(亞馬遜計(jì)算機(jī)榜首圖書,國內(nèi)第1本Ajax圖書) 作 者: (美)阿斯利森,(美)舒塔 著,金靈 等譯 出 版 社: 人民郵電出版社 出版時(shí)間: 2006-2-1 字 數(shù): 356000 版 次: 1 頁 數(shù): 253 印刷時(shí)間: 2006/02/01 開 本: 印 次: 紙 張: 膠版紙 I S B N : 9787115144812 包 裝: 平裝 Ajax技術(shù)應(yīng)知應(yīng)會90題 編著:卜維豐 改編:丁衛(wèi)穎、付瑞鋒 出版社:電子工業(yè)出版社 出版時(shí)間:2008年5月 開本:720*1000 1/16 印張:22.75 頁數(shù):354頁 ISBN:978-7-121-06197-4 定價(jià):39.80元(含光盤一張) 基礎(chǔ)應(yīng)用 創(chuàng)建XMLHttpRequest 方法如下 XMLHttpRequest 類首先由Internet Explorer以ActiveX對象引入,被稱為XMLHTTP。 后來Mozilla﹑Netscape﹑Safari 和其他瀏覽器也提供了XMLHttpRequest類,不過它們創(chuàng)建XMLHttpRequest類的方法不同。 對于Internet Explorer瀏覽器: xmlhttp_request = new ActiveXObject("Msxml2.XMLHTTP.3.0"); //3.0或4.0, 5.0 xmlhttp_request = new ActiveXObject("Msxml2.XMLHTTP"); xmlhttp_request = new ActiveXObject("Microsoft.XMLHTTP"); 由于在不同Internet Explorer瀏覽器中XMLHTTP版本可能不一致,為了更好的兼容不同版本的Internet Explorer瀏覽器,因此我們需要根據(jù)不同版本的Internet Explorer瀏覽器來創(chuàng)建XMLHttpRequest類,上面代碼就是根據(jù)不同的Internet Explorer瀏覽器創(chuàng)建XMLHttpRequest類的方法。 對于Mozilla﹑Netscape﹑Safari等瀏覽器 創(chuàng)建XMLHttpRequest 方法如下:xmlhttp_request = new XMLHttpRequest(); 如果服務(wù)器的響應(yīng)沒有XML mime-type header,某些Mozilla瀏覽器可能無法正常工作。 為了解決這個(gè)問題,如果服務(wù)器響應(yīng)的header不是text/xml,可以調(diào)用其它方法修改該header。 xmlhttp_request = new XMLHttpRequest(); xmlhttp_request.overrideMimeType(&#39;&#39;text/xml&#39;&#39;); 在實(shí)際應(yīng)用中,為了兼容多種不同版本的瀏覽器,一般將創(chuàng)建XMLHttpRequest類的方法寫成如下形式: try{ if( window.ActiveXObject ){ for( var i = 5; i; i-- ){ try{ if( i == 2 ){ xmlhttp_request = new ActiveXObject( "Microsoft.XMLHTTP" ); } else{ xmlhttp_request = new ActiveXObject( "Msxml2.XMLHTTP." + i + ".0" ); xmlhttp_request.setRequestHeader("Content-Type","text/xml"); xmlhttp_request.setRequestHeader("Charset","gb2312"); } break;} catch(e){ xmlhttp_request = false; } } } else if( window.XMLHttpRequest ) { xmlhttp_request = new XMLHttpRequest(); if (xmlhttp_request.overrideMimeType) { xmlhttp_request.overrideMimeType(&#39;&#39;text/xml&#39;&#39;); } } } catch(e){ xmlhttp_request = false; } 發(fā)送請求了 可以調(diào)用HTTP請求類的open()和send()方法,如下所示: xmlhttp_request.open(&#39;&#39;GET&#39;&#39;, URL, true); xmlhttp_request.send(null); open()的第一個(gè)參數(shù)是HTTP請求方式—GET,POST或任何服務(wù)器所支持的您想調(diào)用的方式。 按照HTTP規(guī)范,該參數(shù)要大寫;否則,某些瀏覽器(如Firefox)可能無法處理請求。 第二個(gè)參數(shù)是請求頁面的URL。 第三個(gè)參數(shù)設(shè)置請求是否為異步模式。如果是TRUE,Javas cript函數(shù)將繼續(xù)執(zhí)行,而不等待服務(wù)器響應(yīng)。這就是"AJAX"中的"A"。 服務(wù)器的響應(yīng) 這需要告訴HTTP請求對象用哪一個(gè)Javas cript函數(shù)處理這個(gè)響應(yīng)?梢詫ο蟮膐nreadystatechange屬性設(shè)置為要使用的Javas cript的函數(shù)名,如下所示: xmlhttp_request.onreadystatechange =FunctionName; FunctionName是用Javas cript創(chuàng)建的函數(shù)名,注意不要寫成FunctionName(),當(dāng)然我們也可以直接將Javas cript代碼創(chuàng)建在onreadystatechange之后,例如: xmlhttp_request.onreadystatechange = function(){ // Javas cript代碼段 }; 首先要檢查請求的狀態(tài)。只有當(dāng)一個(gè)完整的服務(wù)器響應(yīng)已經(jīng)收到了,函數(shù)才可以處理該響應(yīng)。XMLHttpRequest 提供了readyState屬性來對服務(wù)器響應(yīng)進(jìn)行判斷。 readyState的取值如下: 0 (未初始化) 1 (正在裝載) 2 (裝載完畢) 3 (交互中) 4 (完成) 所以只有當(dāng)readyState=4時(shí),一個(gè)完整的服務(wù)器響應(yīng)已經(jīng)收到了,函數(shù)才可以處理該響應(yīng)。具體代碼如下: if (http_request.readyState == 4) { // 收到完整的服務(wù)器響應(yīng) } else { // 沒有收到完整的服務(wù)器響應(yīng) } 當(dāng)readyState=4時(shí),一個(gè)完整的服務(wù)器響應(yīng)已經(jīng)收到了,接著,函數(shù)會檢查HTTP服務(wù)器響應(yīng)的狀態(tài)值。完整的狀態(tài)取值可參見W3C文檔。當(dāng)HTTP服務(wù)器響應(yīng)的值為200時(shí),表示狀態(tài)正常。 處理從服務(wù)器得到的數(shù)據(jù) 有兩種方式可以得到這些數(shù)據(jù): (1) 以文本字符串的方式返回服務(wù)器的響應(yīng) (2) 以XMLDocument對象方式返回響應(yīng) 基于Ajax的應(yīng)用程序架構(gòu)匯總 ·純Javas cript:應(yīng)用程序框架 1.1 Bindows(自從2003年) 網(wǎng)址是:http://www.bindows.net,Bindows是一個(gè)軟件開發(fā)包(SDK),它,通過強(qiáng)力聯(lián)合DHTML,Javas cript,CSS和XML等技術(shù),能生成高度交互的互聯(lián)網(wǎng)應(yīng)用程序-成為現(xiàn)代的桌面應(yīng)用程序的強(qiáng)有力對手。Bindows應(yīng)用程序不要求下載和也不需要在用戶端安裝-僅要求有一個(gè)瀏覽器(也不需要Java,F(xiàn)lash或者ActiveX)。Bindows有可能領(lǐng)導(dǎo)面向?qū)ο箝_發(fā)的AJAX應(yīng)用程序的平臺。 1.2 BackBase(自從2003年) 網(wǎng)址是:http://www.backbase.com,是一個(gè)全面的瀏覽器端框架,支持豐富的瀏覽器功能以及與.NET和Java的集成。 ·商業(yè)化,來自于Backbase B.V(總部在Amsterdam,成立于2003年)。 1.3 DOJO(開發(fā)中;自從2004年9月) 網(wǎng)址是:http://dojotoolkit.org/,提供全面窗口小組件和瀏覽器-服務(wù)器消息支持。 ·為創(chuàng)建定制的Javas cript窗口小組件提供框架支持。 1.4 Open Rico(開發(fā)中;自從2005年5月;基于早期的私有框架) 網(wǎng)址是:http://openrico.org/demos.page,是一多用途框架,支持Ajax基礎(chǔ)結(jié)構(gòu)和用戶交互。 1.5 qooxdoo(開發(fā)中;自從2005年5月) 網(wǎng)址是:http://qooxdoo.sourceforge.net/,是另一個(gè)雄心勃勃的框架,提供寬范圍的UI支持和正在開發(fā)中的基礎(chǔ)結(jié)構(gòu)特性。 1.6 Tibet(開發(fā)中;自從2005年6月) 網(wǎng)址是:http://www.technicalpursuit.com/,目的是提供高度可移植的和全面的Javas cript API,結(jié)果是,可能自動(dòng)生成大量的客戶端代碼。自稱是"企業(yè)級Ajax"。 2 純Javas cript:基礎(chǔ)結(jié)構(gòu)框架 2.1 AjaxCaller(Alpha版本;自從5月2005年) 網(wǎng)址是:http://ajaxify.com/run/testAjaxCaller/,是一基本的線程安全的XMLHttpRequest包裝器,主要針對Ajax新手,仍處于原始的alpha開發(fā)階段, 2.2 Flash Javas cript集成包 網(wǎng)址是:http://www.osflash.org/doku.php?id=flashjs,允許Javas cript和Flash內(nèi)容的集成 2.3 Google AJAXSLT(發(fā)行于2005年6月) 網(wǎng)址是:http://goog-ajaxslt.sourceforge.net/,是一個(gè)Javas cript框架,用來執(zhí)行XSLT轉(zhuǎn)換以及XPath查詢。 2.4 HTMLHttpRequest(Beta版;始于2005年) HtmlHttpRequest(http://www.twinhelix.com/javas cript/htmlhttprequest/),它使用了XMLHttpRequest和Iframes以改進(jìn)兼容性。 2.5 交互式網(wǎng)站框架(自從2005年5月) 交互式網(wǎng)站框架(http://sourceforge.net/projects/iwf/,是一個(gè)項(xiàng)目,目的是從瀏覽器端對Ajax基礎(chǔ)結(jié)構(gòu)的多方面予以支持。自描述為"使用javas cript,css,xml,和html來創(chuàng)造高度交互網(wǎng)站的框架。包括一個(gè)定制的針對高度可讀的javas cript的xml分析器。實(shí)質(zhì)上,是建立基于AJAX的網(wǎng)站的基礎(chǔ),還有另外一些通用腳本"。 2.6 LibXMLHttpRequest(發(fā)行于2003年6月) libXmlRequest(http://www.whitefrost.com/servlet/connector?file=reference/2003/06/17/libXmlRequest.html),是XMLHttpRequest的一個(gè)瘦包裝器。 2.7 RSLite(x) 網(wǎng)站是:http://www.ashleyit.com/rs/main.htm,是一個(gè)針對XMLHttpRequest的瘦包裝器。 2.8 Sack(在開發(fā)中,自從2005年5月) 網(wǎng)站是:http://twilightuniverse.com/2005/05/sack-of-ajax/,是一個(gè)針對XMLHttpRequest的瘦包裝器。 2.9 Sarissa(發(fā)行于2月,2003年) 網(wǎng)站是:http://sarissa.sf.net,是一種Javas cript API,它封裝了在瀏覽器端可以獨(dú)立調(diào)用XML的功能。 2.10 XHConn(發(fā)行于自從4月,2005年) 網(wǎng)站是:http://xkr.us/code/javas cript/XHConn/,是一個(gè)對XMLHttpRequest的瘦包裝器。 2.11 Jquery 簡潔的思想:幾乎所有操作都是以選擇DOM元素(有強(qiáng)大的Selector)開始,然后是對其的操作(Chaining等特性)。 3 服務(wù)器端:多種語言 3.1 跨平臺異步的接口工具箱(5月2005年) CPAINT:http://cpaint.sourceforge.net/,是一真正的支持PHP和ASP/Vbs cript的Ajax實(shí)現(xiàn)和JSRS(Javas cript遠(yuǎn)程腳本)實(shí)現(xiàn)。CPAINT提供給你需求的代碼在后臺實(shí)現(xiàn)AJAX和JSRS,而返回的數(shù)據(jù)以Javas cript形式在前臺操作,格式化和顯示。這允許你創(chuàng)建能提供接近實(shí)時(shí)的反饋給用戶的web應(yīng)用程序。 3.2 SAJAX(可用,但是不是1.0版本;自從3月2005年) 網(wǎng)站是:http://www.modernmethod.com/sajax/,直接把調(diào)用從Javas cript發(fā)送到你的服務(wù)器端語言并再次回返。 3.3 Javascipt對象標(biāo)志(JSON)和JSON-RPC JSON(http://www.crockford.com/JSON/index.html),是一個(gè)"胖的自由的XML選擇",而JSON-RPC(http://www.json-rpc.org/)是一種遠(yuǎn)程過程協(xié)議,類似于XML-RPC,強(qiáng)有力支持Javas cript客戶。 3.4 Javas cript遠(yuǎn)程腳本(JSRS)(自從2000年) 網(wǎng)址是:http://www.ashleyit.com/rs/jsrs/test.htm,直接把調(diào)用從Javas cript發(fā)送到你的服務(wù)器端語言并再次回返。 4 服務(wù)器端:Java 4.1 WebORB for Java(自從2005年8月) 網(wǎng)址:http://www.themidnightcoders.com/weborb/aboutWeborb.htm,是一個(gè)平臺,支持開發(fā)AJAX和基于Flash的胖客戶端應(yīng)用程序,并可以把它們與Java對象和XML Web服務(wù)相系起來。在線舉例(http://www.themidnightcoders.com/examples) 4.2 Echo 2(自從3月2005年) 網(wǎng)址是:http://www.nextapp.com/products/echo2/,允許你用純Java代碼編寫Ajax應(yīng)用軟件(范例(http://demo.nextapp.com/InteractiveTest/ia))。 4.3 Direct Web Remoting (DWR)(2005年) 網(wǎng)址是:http://www.getahead.ltd.uk/dwr/,是一個(gè)框架,用于直接從Javas cript代碼中調(diào)用Java方法。 4.4 SWATO(2005年) 網(wǎng)址是:http://swato.dev.java.net/,是一套可重用的和良好集成的Java/Javas cript庫,它實(shí)現(xiàn)了一種更容易的方式來改變你的web應(yīng)用程序的交互,它是通過AJAX方式實(shí)現(xiàn)。 5 服務(wù)器端:Lisp 5.1 CL-Ajax 網(wǎng)址:http://cliki.net/cl-ajax,實(shí)現(xiàn)Javas cript直接調(diào)用服務(wù)器端Lisp函數(shù)。 6 服務(wù)器端:.NET 6.1 WebORB for.NET(自從8月2005年) 網(wǎng)址:http://www.themidnightcoders.com/weborb/aboutWeborb.htm,是一個(gè)平臺,用于開發(fā)AJAX和基于Flash的胖客戶端應(yīng)用程序,并能把它們連接到.NET對象和XML Web服務(wù)。(在線舉例(http://www.themidnightcoders.com/examples)) 6.2 Ajax.NET(自從3月2005年) 網(wǎng)址是:http://ajax.schwarz-interactive.de/,是一個(gè)庫,實(shí)現(xiàn)從Javas cript到服務(wù)器端.NET的存取。 7 服務(wù)器端:PHP 7.1 AjaxAC(自從2005年4月) 網(wǎng)址是:http://ajax.zervaas.com.au/,用單個(gè)的PHP類封裝了完整的應(yīng)用程序。 7.2 JPSpan 網(wǎng)址是:http://jpspan.sourceforge.net/wiki/doku.php,直接把Javas cript調(diào)用傳遞到PHP函數(shù)。 7.3 XAJAX 網(wǎng)址是:http://xajax.sf.net,直接把Javas cript調(diào)用傳遞到PHP函數(shù)。 8 服務(wù)器端:Ruby Ruby On Rails(http://www.rubyonrails.org/)是一個(gè)通常的強(qiáng)力支持Ajax的web框架: 開發(fā)Ajax應(yīng)用面臨的問題及解決方案 對程序員而言,開發(fā)Ajax應(yīng)用最頭痛的問題莫過于以下幾點(diǎn): Ajax在本質(zhì)上是一個(gè)瀏覽器端的技術(shù),首先面臨無可避免的第一個(gè)問題即是瀏覽器的兼容性問題。各家瀏覽器對于Javas cript/DOM/CSS的支持總有部分不太相同或是有Bug,甚至同一瀏覽器的各個(gè)版本間對于Javas cript/DOM/CSS的支持也有可能部分不一樣。這導(dǎo)致程序員在寫Ajax應(yīng)用時(shí)花大部分的時(shí)間在調(diào)試瀏覽器的兼容性而非在應(yīng)用程序本身。因此,目前大部分的Ajax鏈接庫或開發(fā)框架大多以js鏈接庫的形式存在,以定義更高階的Javas cript API 、Javas cript對象(模板)、或者Javas cript Widgets來解決此問題。如prototype.js。 Ajax技術(shù)之主要目的在于局部交換客戶端及服務(wù)器之間的數(shù)據(jù)。如同傳統(tǒng)之主從架構(gòu),無可避免的會有部分的業(yè)務(wù)邏輯會實(shí)現(xiàn)在客戶端,或部分在客戶端部分在服務(wù)器。由于業(yè)務(wù)邏輯可能分散在客戶端及服務(wù)器,且以不同之程序語言實(shí)現(xiàn),這導(dǎo)致Ajax應(yīng)用程序極難維護(hù)。如有用戶接口或業(yè)務(wù)邏輯之更動(dòng)需求,再加上前一個(gè)Javas cript/DOM/CSS之兼容性問題,Ajax應(yīng)用往往變成程序員的夢魘。針對業(yè)務(wù)邏輯分散的問題,Ajax開發(fā)框架大致可分為兩類: 將業(yè)務(wù)邏輯及表現(xiàn)層放在瀏覽器,數(shù)據(jù)層放在服務(wù)器:因?yàn)樗械某绦蛞訨avas cript執(zhí)行在客戶端,只有需要數(shù)據(jù)時(shí)才向服務(wù)器要求服務(wù),此法又稱為胖客戶端(fat client)架構(gòu)。服務(wù)器在此架構(gòu)下通常僅用于提供及儲存數(shù)據(jù)。此法的好處在于程序員可以充分利用Javas cript搭配業(yè)務(wù)邏輯來做出特殊的用戶接口,以符合終端用戶的要求。但是問題也不少,主因在第一,Javas cript語言本身之能力可能不足以處理復(fù)雜的業(yè)務(wù)邏輯。第二,Javas cript的執(zhí)行效能一向不好。第三,Javas cript訪問服務(wù)器數(shù)據(jù),仍需適當(dāng)?shù)姆⻊?wù)器端程序之配合。第四,瀏覽器兼容性的問題又出現(xiàn)。有些Ajax開發(fā)框架如DWR企圖以自動(dòng)生成Javas cript之方式來避免兼容的問題,并開立通道使得Javas cript可以直接調(diào)用服務(wù)器端的Java程序來簡化數(shù)據(jù)的訪問。但是前述第一及第二兩個(gè)問題仍然存在,程序員必須費(fèi)相當(dāng)?shù)牧獠拍苓_(dá)到應(yīng)用程序之規(guī)格要求,或可能根本無法達(dá)到要求。 將表現(xiàn)層[2]、業(yè)務(wù)邏輯、及數(shù)據(jù)層放在服務(wù)器,瀏覽器僅有用戶接口引擎(User Interface engine);此法又稱為瘦客戶端(thin client)架構(gòu),或中心服務(wù)器(server-centric)架構(gòu)。瀏覽器的用戶接口引擎僅用于反映服務(wù)器的表現(xiàn)層以及傳達(dá)用戶的輸入回到服務(wù)器的表現(xiàn)層。由瀏覽器所觸發(fā)之事件亦送回服務(wù)器處理,根據(jù)業(yè)務(wù)邏輯來更新表現(xiàn)層,然后反映回瀏覽器。因?yàn)樗袘?yīng)用程序完全在服務(wù)器執(zhí)行,數(shù)據(jù)及表現(xiàn)層皆可直接訪問,程序員只需使用服務(wù)器端相對較成熟之程序語言(如Java語言)即可,不需再學(xué)習(xí)Javas cript/DOM/CSS,在開發(fā)應(yīng)用程序時(shí)相對容易。缺點(diǎn)在于用戶接口引擎以及表現(xiàn)層通常以標(biāo)準(zhǔn)組件的形式存在,如需要特殊組件(用戶接口)時(shí),往往須待原框架之開發(fā)者提供,緩不濟(jì)急。如開源碼Ajax開發(fā)框架ZK目前支持XUL及XHTML組件,尚無XAML之支持。 Ajax是以異步的方式向服務(wù)器提交需求。對服務(wù)器而言,其與傳統(tǒng)的提交窗體需求并無不同,而且由于是以異步之方式提交,如果同時(shí)有多個(gè)Ajax需求及窗體提交需求,將無法保證哪一個(gè)需求先獲得服務(wù)器的響應(yīng)。這會造成應(yīng)用程序典型的多進(jìn)程(process)或多線程(thread)的競爭(racing)問題。程序員因此必須自行處理或在Javas cript里面動(dòng)手腳以避免這類競爭問題的發(fā)生(如Ajax需求未響應(yīng)之前,先disable送出按鈕),這又不必要的增加了程序員的負(fù)擔(dān)。目前已知有自動(dòng)處理此問題之開發(fā)框架似乎只有ZK。
移動(dòng)通信網(wǎng) | 通信人才網(wǎng) | 更新日志 | 團(tuán)隊(duì)博客 | 免責(zé)聲明 | 關(guān)于詞典 | 幫助