AJAX:開發(fā)者新的一天xMatrix 發(fā)表于 2006-01-04 點(diǎn)擊數(shù):773 評論數(shù):0 評價:21/5 關(guān)鍵詞:AJAX
摘要:雖然大部分開發(fā)人員在過去使用過XMLHttp或者使用Iframe來加載數(shù)據(jù),但僅到現(xiàn)在我們才看到傳統(tǒng)的開發(fā)人員和公司開始采用這些技術(shù)。就像新的編程語言或模型伴隨著更多的痛苦,開發(fā)人員需要學(xué)習(xí)新的技巧及如何最好利用這些新技術(shù)。這篇文章講述了開發(fā)人員使用AJAX需要使用的工具和技術(shù)。
版權(quán)聲明:任何獲得Matrix授權(quán)的網(wǎng)站,轉(zhuǎn)載時請務(wù)必以超鏈接形式標(biāo)明文章原始出處和作者信息及本聲明 作者:Andrew Thompson;xMatrix (他的blog:http://blog./page/xMatrix) 原文地址:http://www./javaworld/jw-10-2005/jw-1017-ajax.html 中文地址:http://www./resource/article/44/44116_AJAX.html 關(guān)鍵詞: AJAX
AJAX開發(fā)者的最新工具和技術(shù)
基于XML的異步JavaScript,簡稱AJAX,是當(dāng)前Web創(chuàng)新(稱為Web2.0)中的一個王冠。感謝組成AJAX的各種技術(shù),Web應(yīng)用的交互如Flickr, Backpack和Google在這方面已經(jīng)有質(zhì)的飛躍。這個術(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ù)端取得并且可以被動態(tài)地寫入網(wǎng)頁中,給緩慢的Web應(yīng)用體驗著色使之像桌面應(yīng)用一樣。
雖然大部分開發(fā)人員在過去使用過XMLHttp或者使用Iframe來加載數(shù)據(jù),但僅到現(xiàn)在我們才看到傳統(tǒng)的開發(fā)人員和公司開始采用這些技術(shù)。就像新的編程語言或模型伴隨著更多的痛苦,開發(fā)人員需要學(xué)習(xí)新的技巧及如何最好利用這些新技術(shù)。這篇文章講述了開發(fā)人員使用AJAX枰褂玫墓ぞ吆圖際酢?lt;br /> AJAX模式 許多重要的技術(shù)和AJAX開發(fā)模式可以從現(xiàn)有的知識中獲取。例如,在一個發(fā)送請求到服務(wù)端的應(yīng)用中,必須包含請求順序、優(yōu)先級、超時響應(yīng)、錯誤處理及回調(diào),其中許多元素已經(jīng)在Web服務(wù)中包含了,就像現(xiàn)在的SOA。AJAX開發(fā)人員擁有一個完整的系統(tǒng)架構(gòu)知識。同時,隨著技術(shù)的成熟還會有許多地方需要改進(jìn),特別是UI部分的易用性。
AJAX開發(fā)與傳統(tǒng)的CS開發(fā)有很大的不同。這些不同引入了新的編程問題,最大的問題在于易用性。由于AJAX依賴瀏覽器的JavaScript和XML,瀏覽器的兼容性和支持的標(biāo)準(zhǔn)也變得和JavaScript的運(yùn)行時性能一樣重要了。這些問題中的大部分來源于瀏覽器、服務(wù)器和技術(shù)的組合,因此必須理解如何才能最好的使用這些技術(shù)。
綜合各種變化的技術(shù)和強(qiáng)耦合的客戶服務(wù)端環(huán)境,AJAX提出了一種新的開發(fā)方式。AJAX開發(fā)人員必須理解傳統(tǒng)的MVC架構(gòu),這限制了應(yīng)用層次之間的邊界。同時,開發(fā)人員還需要考慮CS環(huán)境的外部和使用AJAX技術(shù)來重定型MVC邊界。最重要的是,AJAX開發(fā)人員必須禁止以頁面集合的方式來考慮Web應(yīng)用而需要將其認(rèn)為是單個頁面。一旦UI設(shè)計與服務(wù)架構(gòu)之間的范圍被嚴(yán)格區(qū)分開來后,開發(fā)人員就需要更新和變化的技術(shù)集合了。
時刻想著用戶 AJAX的最大機(jī)遇在于用戶體驗。在使應(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正在打破這種長時間的狀況。因此用戶需要重新體驗按鈕點(diǎn)擊的響應(yīng)了。
可用性是AJAX另人激動的地方而且已經(jīng)產(chǎn)生了幾種新穎的技術(shù)。其中最引人注目的是一種稱為“黃色隱出”的技術(shù),他在數(shù)據(jù)更新之前時將用戶界面變?yōu)辄S色,更新完成后立刻恢復(fù)原來的顏色。AJAX開發(fā)人員將用戶從Web應(yīng)用的負(fù)載中解放出來;小心地利用AJAX提供的豐富接口,不久桌面開發(fā)人員會發(fā)現(xiàn)AJAX是他們的方向。
幾種工具和技術(shù) 隨著AJAX迅速地引人注目起來,我想開發(fā)人員對這種技術(shù)的期待也迅速地增加。就像任何新技術(shù),AJAX的興旺也需要一整個開發(fā)工具/編程語言及相關(guān)技術(shù)系統(tǒng)來支撐。
JavaScript 如名字所示AJAX的概念中最重要而最被忽視的是他也是一種JavaScript編程語言。JavaScript是一種粘合劑使AJAX應(yīng)用的各部分集成在一起。在大部分時間,JavaScript通常被服務(wù)端開發(fā)人員認(rèn)為是一種企業(yè)級應(yīng)用不需要使用的東西應(yīng)該盡力避免。這種觀點(diǎn)來來自以前編寫JavaScript代碼的經(jīng)歷:繁雜而又易出錯的語言。類似的,他也被認(rèn)為將應(yīng)用邏輯任意地散布在服務(wù)端和客戶端中,這使得問題很難被發(fā)現(xiàn)而且代碼很難重用。在AJAX中JavaScript主要被用來傳遞用戶界面上的數(shù)據(jù)到服務(wù)端并返回結(jié)果。XMLHttpRequest對象用來響應(yīng)通過HTTP傳遞的數(shù)據(jù),一旦數(shù)據(jù)返回到客戶端就可以立刻使用DOM將數(shù)據(jù)放到網(wǎng)面上。
XMLHttpRequest XMLHttpRequest對象在大部分瀏覽器上已經(jīng)實(shí)現(xiàn)而且擁有一個簡單的接口允許數(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ù)端,他能夠減少大量的用JavaScript編寫的應(yīng)用邏輯。
CSS 為了正確的瀏覽AJAX應(yīng)用,CSS是一種AJAX開發(fā)人員所需要的重要武器。CSS提供了從內(nèi)容中分離應(yīng)用樣式和設(shè)計的機(jī)制。雖然CSS在AJAX應(yīng)用中扮演至關(guān)重要的角色,但他也是構(gòu)建創(chuàng)建跨瀏覽器應(yīng)用的一大阻礙,因為不同的瀏覽器廠商支持各種不同的CSS級別。
服務(wù)器端 但不像在客戶端,在服務(wù)端AJAX應(yīng)用還是使用建立在如Java,.Net和PHP語言基礎(chǔ)上機(jī)制;并沒有改變這個領(lǐng)域中的主要方式。 既然如此,我們對Ruby on Rails框架的興趣也就迅速增加了。在一年多前,Ruby on Rails已經(jīng)吸引了大量開發(fā)人員基于其強(qiáng)大功能來構(gòu)建Web和AJAX應(yīng)用。雖然目前還有很多快速應(yīng)用開發(fā)工具存在,Ruby on Rails看起來已經(jīng)儲備了簡化構(gòu)建AJAX應(yīng)用的能力。
開發(fā)工具 在實(shí)際構(gòu)建AJAX應(yīng)用中,你需要的不只是文本編輯器。既然是JavaScript非編譯的,他可以容易地編寫和運(yùn)行在瀏覽器中;然而,許多工具提供了有用的擴(kuò)展如語法高亮和智能完成。
不同的IDE提供了對JavaScript支持的不同等級。來自JetBrains的IntelliJ IDEA是一個用來JavaScript開發(fā)的更好的IDE,雖然許多開發(fā)人員也喜歡Microsoft’s Visual Studio產(chǎn)品(允諾會在最新的版本中改善對AJAX的支持)。Eclipse包含了兩個免費(fèi)的JavaScript編輯器插件和一個商業(yè)的來自ActiveStat的Komodo IDE。
另一個JavaScript和AJAX開發(fā)中的問題是調(diào)試?yán)щy。不同的瀏覽器提供不同的通常是隱藏的運(yùn)行時錯誤信息,而JavaScript的缺陷如雙重變量賦值(通常是由于缺少數(shù)據(jù)類型)使得調(diào)試更加困難。在AJAX的開發(fā)中,調(diào)試就更復(fù)雜了,因為其需要標(biāo)識究竟是客戶端還是服務(wù)端產(chǎn)生的錯誤。在過去,JavaScript調(diào)試的方法是刪除所有代碼然后一行行的增加直到錯誤出現(xiàn)?,F(xiàn)在,更多開發(fā)人員回到為IE準(zhǔn)備的Microsoft Script Debugger和為Mozilla瀏覽器準(zhǔn)備的Venkman。
瀏覽器兼容性 JavaScript編程的最大問題來自不同的瀏覽器對各種技術(shù)和標(biāo)準(zhǔn)的支持。構(gòu)建一個運(yùn)行在不同瀏覽器(如IE和火狐)是一個困難的任務(wù)。因此幾種AJAX JavaScript框架或者生成基于服務(wù)端邏輯或標(biāo)記庫的JavaScript,或者提供符合跨瀏覽器AJAX開發(fā)的客戶端JavaScript庫。一些流行的框架包括:AJAX.Net, Backbase, Bitkraft, Django, DOJO, DWR, MochiKit, Prototype, Rico, Sajax, Sarissa, and Script..
這些框架給開發(fā)人員更多的空間使得他們不需要擔(dān)心跨瀏覽器的問題。雖然這些框架提升了開發(fā)人員構(gòu)建應(yīng)用的能力,但由于廠商已經(jīng)開發(fā)了更細(xì)節(jié)的用戶界面的打包組件解決方案,因此在AJAX組件市場中需要考慮一些其他因素。例如提供通用用戶界面的組件如組合框和數(shù)據(jù)柵格的幾個廠商,都可以被用來在應(yīng)用中創(chuàng)建良好的通過類似電子數(shù)據(jù)表方式來查看和編輯數(shù)據(jù)的體驗。但這些組件不僅是封裝了組件的用戶界面而且包括與服務(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主流JavaScript和XML的市場方向改變。 總的來說,AJAX開發(fā)人員必須盡快地跟進(jìn)最新的技術(shù)并利用高產(chǎn)的工具集。成功的AJAX開發(fā)人員還需要留心他們的使用者以避免將任何問題擴(kuò)大化。并且AJAX開發(fā)人員還需要持續(xù)地創(chuàng)新來創(chuàng)建增強(qiáng)Web應(yīng)用易用性的新方法。
作者 Dave Johnson是加拿大Vancouver一家軟件咨詢公司eBusiness Applications創(chuàng)始人和傳道者,擁有七年以上的XML相關(guān)工作經(jīng)驗。
Resources • AJAX開發(fā)人員的編譯模式:http://www. • XMLHttpRequest教程:“動態(tài)網(wǎng)頁接口”:http://www./pub/a/2005/02/09/xml-http-request.html • JavaScript性能基準(zhǔn):http://blogs./dave/?p=14 • AJAX資源:http://www. • JavaScript規(guī)范:http://www./publications/standards/Ecma-262.htm • 介紹JavaScript對象標(biāo)識:http://www./JSON/index.html • Mozilla 的Venkman JavaScript調(diào)試器:http://www.mozilla.org/projects/venkman/ • XML DOM參考:http://msdn.microsoft.com/library/default.asp?url=/library/en-us/ xmlsdk/html/e9da2722-7879-4e48-869c-7f16714e2824.asp • Microsoft Dynamic HTML reference: http://msdn.microsoft.com/library/default.asp?url=/ workshop/author/dhtml/reference/dhtml_reference_entry.asp • Gecko DOM Reference: http://www.mozilla.org/docs/dom/domref/ • "“移植IE應(yīng)用到Mozilla” http://www-128.ibm.com/developerworks/web/library/wa-ie2mozgd/ • Mozilla XUL reference: http://www./ • Microsoft XAML reference: http://windowssdk.msdn.microsoft.com/library/default.asp?url=/library/ en-us/wcp_conceptual/html/0ff5f36e-dd84-44d1-aa3e-5bb4f147b169.asp?frame=true • James Jesses Garret introduced the term AJAX in his article "AJAX: A New Approach to Web Applications," (Adaptive Path, February 2005): “AJAX:新的網(wǎng)頁應(yīng)用開發(fā)方式” http://www./publications/essays/archives/000385.php • JetBrains IntelliJ IDEA: http://www./ • Microsoft Visual Studio: http://msdn.microsoft.com/vstudio/ • JSEditor: http://jseditor./ • JSEclipse: http://www./Products/Eclipse/JSEclipse/Overview/ • ActiveState Komodo: http://www./Products/Komodo/ • XHTML: http://www./TR/xhtml1/ • Document Object Model: http://www./DOM/ • Cascading Style Sheets: http://www./Style/CSS/ • Extensible Stylesheet Language: http://www./Style/XSL/ • XForms: http://www./MarkUp/Forms/ • Scaling Vector Graphics: http://www./Graphics/SVG/ • XPath: http://www./TR/xpath • AJAX.Net: http://ajax./csharpsample/default.aspx • Backbase: http://www. • Bitkraft: http://www./ • Django: http://www./ • Dojo: http://www./ • DWR (Direct Web Reporting): http:///dwr/ • MochiKit: http:/// • Prototype: http://prototype./ • Rico: http:///rico/home.page • Sajax: http://www./sajax/ • Sarissa: http://sarissa./doc/ • Script.: http://script./ • Ruby on Rails: http://www./ • For more on AJAX and DWR, read "AJAX Made Simple with DWR," Cloves Carneiro Jr. (JavaWorld, June 2005): 關(guān)于AJAX和DWR,請閱讀“AJAX使用DWR更簡單” http://www./javaworld/jw-06-2005/jw-0620-dwr.html • For more articles on Java development tools, browse the Development Tools section of JavaWorld’s Topical Index: 更多Java開發(fā)工具的文章,請瀏覽JavaWorld的開發(fā)工具部分索引頁 http://www./channel_content/jw-tools-index.shtml • For more articles on XML, browse the Java and XML section of JavaWorld’s Topical Index: 更多XML的文章,請瀏覽JavaWorld的Java和XML部分索引頁 http://www./channel_content/jw-xml-index.shtml • For more articles on UI design, browse the User Interface Design section of JavaWorld’s Topical Index: 更多UI設(shè)計的文章,請瀏覽JavaWorld的UI設(shè)計部分索引頁 http://www./channel_content/jw-ui-index.shtml
|