AJAX
AJAX即「Asynchronous JavaScript and XML」(非同步的 JavaScript 佮 XML 技術), 指出來是一套綜合幾若項技術的瀏覽器捀網頁開發技術。Ajax 的概念由傑西 ・ 詹姆士 ・ 賈瑞特所提出。
傳統的 Web 應用允准使用者捀寫表單(form), 做送出表單的時陣就向網頁侍服器傳送一个請求。侍服器接收閣處理傳來的表單,然後送回一个新的網頁,猶毋過這个做法拍損足濟頻闊的,因為佇前後兩个頁面內底的大部份 HTML 碼往往是仝款的。因為逐改應用的溝通攏需要向侍服器傳送請求,應用的回應時間依賴佇咧侍服器的回應時間。這致使著使用者介面的回應比本機應用慢得多。
佮此無仝款,AJAX 應用會當干焦向侍服器傳送並取回必須的資料,閣佇客戶咧採用 JavaScript 處理來自侍服器的回應。因為佇咧侍服器佮瀏覽器之間交換的資料大量減少,侍服器回應閣較緊。同時,真濟的處理工課會當佇發出請求的客戶捀機器上完成,所以 Web 侍服器的負擔嘛減少矣。
類似 DHTML 抑是 LAMP,AJAX 毋是講單一種單一的技術,是有機地利用一系列相關的技術。雖然其名稱包括 XML,但實際上資料會使由 JSON 代替以進一步減少資料量。啊若客戶捀佮侍服器嘛無需要非同步。一寡因為 AJAX 的「衍生/合成」式(derivative / composite)的技術嘛當咧出現,如 AFLAX。
應用
- 運用 XHTML + CSS 來表達資訊;
- 運用 JavaScript 操作 DOM(Document Object Model)來執行動態效果;
- 運用 XML 和 XSLT 操作資料
- 運用 XMLHttpRequest 抑是新的 Fetch API 佮網頁侍服器進行非同步資料交換;
- 注意:AJAX 佮 Flash、Silverlight 和 Java Applet 等 RIA 技術是有分的。
發展史
二十世紀九空年代,差不多所有的網站攏由 HTML 頁面實現,侍服器處理每一个使用者請求攏需要重新載入去網頁。這款的處理方式效率是無懸。使用者的體驗是所有的頁面攏會消失,閣重新載入,即使只是一部份頁面元素改變嘛愛重新載入去這个規个頁面,毋但愛重新整理改變的部份,連無變化的部份嘛愛閣重整理。這會加重侍服器的負擔。
這會當用非同步載入來解決。一九九五年,JAVA 語言的頭一版發佈,隨之發布的 Java applets(JAVA 小程式)頭擺實現非同步踏入去。瀏覽器通過執行1875入去網頁內底的 Java applets 佮侍服器交換資料,毋免閣重整理網頁。一九九六年,Internet Explorer 將 iframe 元素加入到 HTML,支援局部重新整理網頁。
一九九八年前後,Outlook Web Access 小組寫做允准客戶帆指令碼傳送 HTTP 請求(XMLHTTP)的第一个組件。該組件原屬於小可仔軟 Exchange Server,而且真緊就成做 Internet Explorer 四配零的一部份。部份觀察家認為,Outlook Web Access 是頭一个應用 Ajax 技術的成功的商業應用程式,並成做包括 Oddpost 的網路郵件產品在內的濟濟產品的𤆬頭羊仔。猶毋過,二空空五年初,足濟事件予伊去 Ajax 予逐家接受。Google 佇伊出名的互動應用程式當中使用了非同步通訊,如 Google 討論組、Google 地圖、Google 搜揣建議、Gmail 等。Ajax 這个詞由《_ Ajax : A New Approach to Web Applications _》一文所創,該文的快速流傳提懸了人使用該項技術的意識。另外咧,著 Mozilla / Gecko 的支援予得該技術行向成熟,變甲閣較簡單會當用。
優缺點
使用 Ajax 的上大的優點,就是會當佇無更新規頁的推捒出來維護資料。這會使 Web 應用的程式閣較猛醒咧回應使用者動作,並免了佇網路頂懸傳送遐無改變的資訊。
Ajax 毋免任何瀏覽器外掛程式,但是需要使用者允准 JavaScript 佇瀏覽器上執行。就親像 DHTML 應用程式按呢,Ajax 應用程式必須愛佇咧真濟無仝款的瀏覽器和平台頂面經過嚴格的測試。隨著 Ajax 的成熟,一寡簡省 Ajax 用方法的程式庫嘛相紲問世。仝款,嘛出現另外一種輔助程式設計的技術,共遐的無支援 JavaScript 的使用者提供替代功能。
對應用 Ajax 最主要的批評就是講,伊可能破壞瀏覽器的後退佮加入收藏冊籤功能。佇動態更新頁面的情況下,使用者無法度轉去前一个頁面的狀態,這是因為瀏覽器干焦會當記錄歷史記錄中的靜態頁面。一个予完整讀入去的頁面佮一个已經予動態修改過的頁面之間的可能是差別非常的微妙;使用者通常攏希望單擊後退揤鈕,就會當取消𪜶的前輩操作,猶毋過佇咧 Ajax 應用程式內底,煞無法度通按呢做。猶毋過開發者已經想出了種種辦法來解決這个問題,HTML 五進前的方法大多數是攏是使用者孤一拍了後退休鈕存取歷史記錄的時陣,通過建立抑是使用一个隱藏的 IFRAME 來重現頁面上的變更加。(比如講,做使用者咧 Google Maps 擊了退的時陣,伊佇一个隱藏的 IFRAME 來進行搜揣,然後會當揣著結果反映到 Ajax 元素上,通好共應用程式狀態恢復到當時的狀態)。
關於無法度將狀態加入收藏抑是冊籤的問題,HTML 五進前的一種方式是使用 URL 片斷識別碼(通常予人叫做碇點,即 URL 中 # 後壁的部份)來保持追蹤,允准使用者轉到指定的某一个應用程式狀態。(真濟瀏覽器允准 JavaScript 動態更新定點,這會使 Ajax 應用程式會當更新顯示內容的仝時更新定點。)HTML 五以後會使直接操作瀏覽歷史,並且用字串形式儲存網頁的狀態,共網頁加入網頁收藏鋏仔抑是冊籤時狀態會予人隱形地保留。欲講兩个方法嘛會用同時解決無法度了退的問題。
進行 Ajax 開發的時陣,網路延遲—— 準做用者發出請求到侍服器發出回應之間的隔—— 需要慎重這个考慮。若使用者明確的回應,無適當的預讀資料,抑是講對 XMLHttpRequest 的無適當處理,攏會使使用者感覺厭煩。通常的解決方案是,使用一个視覺化的組件來共使用者系統當咧進行後台咧操作而且當咧讀資料佮內容。
相容性
JavaScript 編程的上大問題來自無仝的瀏覽器對各種技術佮標準的支援。
XmlHttpRequest 物件佇無仝款瀏覽器內底無仝款的建立方法,以下是迒瀏覽器的通用方法:
AJAX 支援的瀏覽器有:Internet Explorer、Chrome、Firefox、Opera、Konqueror 佮 Mac OS 的 Safari。猶毋過 Opera 無支援 XSL 格式物件,嘛無支援 XSLT。
開發挑戰佮解決方案
對程式設計師來講,開發 Ajax 應用上頭疼的問題袂過以下幾點:
- Ajax 佇本質上是一个瀏覽器捀的技術,首先面臨無法度避免的第一个問題就是瀏覽器的相容性問題。逐家瀏覽器對 JavaScript/DOM/CSS 支援總有部份無啥仝抑是有 Bug,甚至仝一瀏覽器的各个版本間對 JavaScript/DOM/CSS 支援嘛有可能部份無仝款。這致使程式設計師咧寫 Ajax 應用時開大部份的時間咧除毋著瀏覽器的相容性毋是佇咧應用程式本身。所以,目前大部份的 Ajax 連結庫抑是開發框殼濟濟以 js 連結庫的形式存在,以定義閣較高階的 JavaScript API、JavaScript 東西(模板)、 抑是講 JavaScript Widgets 來解決此問題。如 prototype . js。
- Ajax 技術之主要目的佇咧局內交換客戶捀捀服器之間的資料。親像傳統之主對架構,無法度避免的會有部份的業務邏輯會實這馬客戶捀,抑是部份佇咧客戶捀的部份咧侍服器。因為業務邏輯可能分散佇客戶捀捀服器,而且以無仝之程式語言實現,這致使著 Ajax 應用的程式誠歹維護。親像使用者介面抑是業務邏輯之更動需求,閣加上前一个 JavaScript / DOM / CSS 之相容性問題,Ajax 應用往往變成程式設計師的夢想。針對業務邏輯分散的問題,Ajax 開發框殼真大致使會使分做兩類:
- 將業務邏輯佮表現層放佇瀏覽器,資料層放咧侍服器:因為所有的程式以 JavaScript 執行佇咧客戶捀,干焦需要資料的時陣才來奉服器要求服務,這馬法閣講是大箍客戶捀(fat client)架構。侍服器佇遮架構下通常干焦用提供佮儲存的資料。此法的好處佇咧程式設計師會當充分利用 JavaScript 搭配業務邏輯來做出特殊的使用者介面,符合終端使用者的要求。但是問題嘛袂少,主要就是因為佇第一,JavaScript 語言本身之能力可能不足咧處理複雜的業務邏輯。第二,JavaScript 的執行效能一向無好。第三,JavaScript 存取侍服器資料,猶原需要適當的侍服器捀程式配合。第四,瀏覽器相容性的問題閣出現。有的 Ajax 開發框殼如 DWR 企圖以自動生成 JavaScript 之方式來避免相容的問題,並開立通道予 JavaScript 會使直接叫用侍服器捀的 Java 程式來簡化資料的存取。但是前述第一佮第二个問題猶原存在,程式設計師愛費相當的氣力才會當達到應用程式之規格要求,抑是可能根本無法度達到要求。
- 共表現層、業務邏輯、佮資料層放咧侍服器,瀏覽器干焦有使用者介面 ia̋n-jín(User Interface engine); 這陣欲講號做瘦客戶捀(thin client)架構,抑是中心侍服器(server-centric)架構。瀏覽器的使用者介面 ia̋n-jín 干焦用佇咧反映侍服器的表現層佮傳達使用者的輸入去到侍服器的表現。由瀏覽器所觸發的事件亦送回侍服器處理,根據業務邏輯來更新表現層,然後反映轉去瀏覽器。因為所有應用程式完全咧侍服器執行,資料佮表現層攏會當直接存取,程式設計師只需要使用侍服器捀相對較成熟的程式語言(如 Java 語言)即可,毋免閣學習 JavaScript / DOM / CSS,佇開發應用程式的時陣真相對簡單。缺點佇咧使用者介面 ia̋n-jín 和表現層通常以標準組件的形式存在,如需要特殊組件(使用者介面)時,往往愛待原框架之開發者提供,慢慢仔急。若開原始咧碼 Ajax 開發框殼 ZK 目前支援 XUL 佮 XHTML 組件,尚無 XAML 之支援。
Ajax 是以非同步的方式向侍服器提交需求。著侍服器來講,其佮傳統的提交表單需求並無無仝,而且因為是以非同步的方式提交,若同齊時有偌个 Ajax 需求佮表單提交需求,共這無法度保證佗一个需求先得著侍服器的回應。這會造成應用程式典型的多行程(process)抑是講加執行緒(thread)的競爭(racing)問題。程式設計師愛按呢就愛家己處理抑是 JavaScript 內底跤手較避免這類競爭問題的發生(如 Ajax 需求無回應進前,先 disable 送出揤鈕), 這閣無必要的增加程式設計師的負擔。目前已經知影有自動處理這个問題之開發框架敢若只有 ZK。
參考文獻
- (英文)Ajax : A new approach to web applications--JJ Garrett-二空空五年
外部連結
工具
- ASP . NET AJAX Extension(開發階段時代號 Atlas), 微軟 AJAX 工具箱。
- jQuery,開源 JS 框架,寫閣較少,做閣較濟。
- Dojo 工具箱,AJAX / DHTML 工具箱。
- Prototype,開放原始碼框。
- Buffalo Web Remoting(based on prototype)
- openrico JS UI component(based on prototype)
- PHPRPC,開放原始碼多語言支援的迒平台的安全的 Web 遠逝過程調用框殼,予 Ajax 編程閣較容易。
- Sajax,簡單 AJAX 工具箱
- Rialto,Rich Internet AppLication TOolkit .
- MochiKit 一个自稱 AJAX 的輕量級 js 庫,支援 Json。
- OpenLaszlo 原本斟酌佇 Flash 作為表現層的 Laszlo 將方向行轉到 AJAX。
- script . aculo . us 為 Ruby on Rails 量身打造的 AJAX 函式庫,迒過平台支援。
- Rico 知名的開原始碼的 AJAX 函式庫,迒過平台支援。
- DWR Web Remoting
- qooxdoo JS UI component(C / S Style)
- jsLINB 完全 OOP,帶有執行緒類比的 ajax RIA 框架。
- GWT Google 開源框殼。
- Quicknet 會當提供安全的資料傳輸的 AJAX 系統架構。
圖書
- 《Ajax 基礎教程》,_ Foundations Of Ajax _ 中文版,人民郵電出版社圖靈公司出版。ISBN 七孵一百十五孵一孵四千四百八十一孵八
- 《Ajax 實戰》,_ Ajax in Action _ 中文版,人民郵電出版社圖靈公司出版。ISBN 七孵一百十五孵一孵四千七百一十七孵五
- 《Ajax 進階程式設計》(二版), _ Professional Ajax _,人民郵電出版社圖靈公司出版。
- 《Head First Ajax》O'Reilly 出版社
- 《Ajax 實戰手冊》ua峰 ISBN 九百八十六鼻一百八十一鼻三十六鼻六
- 《Ajax 技術手冊》ua峰 ISBN 九百八十六鼻一百八十一石十九石六
參見
- Google Web Toolkit 是一个前端使用 JavaScript,後爿使用 Java 的 AJAX framework,提供 WYSIWYG 設計介面。
- jQuery 用佇簡化 AJAX 開發的 Javascript 函式庫。
- Prototype AJAX 函式庫。
- Yahoo ! UI Library is a set of utilities and controls , written in JavaScript , for building richly interactive web applications using techniques such as DOM scripting , DHTML and AJAX .
- Xajax 知名的開原始碼開發 AJAX 用 PHP 函式庫。
- ZK,開放原始碼 AJAX / XUL 框架,JAVA 專用。
- ASP . NET AJAX,由微軟專為 ASP . NET 應用程式所開發的 AJAX 基礎架構。
- Web 二孵空,一種新的網際網路概念
- 推播技術,一款侍服器捀主動通知使用者的技術