什么是 AJAX, what is AJAX(一）

AJAX全稱為「Asynchronous JavaScript and XML」（非同步JavaScript和XML），是一種創建互動式網頁應用的網頁開發技術。它使用：

• 使用XHTML+CSS來表示信息；
• 使用JavaScript操作DOM Document Object Model進行動態顯示及交互；
• 使用 XML 和 XSLT 進行數據交換及相關操作；
• 使用 XMLHttpRequest對象與Web伺服器進行非同步數據交換；
• 使用 JavaScript 將所有的東西綁定在一起。

參見Ajax的提出者Jesse James Garrett的英文原文中文譯文

類似於DHTML或LAMP，AJAX不是指一種單一的技術，而是有機地利用了一系列相關的技術。事實上，一些基於AJAX的「派生/合成」式（derivative/composite）的技術正在出現，如「AFLAX」。

AJAX的應用使用支持以上技術的web瀏覽器作為運行平臺。這些瀏覽器目前包括：Mozilla、Firefox、Internet Explorer、Opera、Konqueror及Mac OS的Safari。但是Opera不支持XSL格式對象，也不支持XSLT。[1]

與傳統的web應用比較

傳統的web應用允許用戶端填寫表單(form)，當提交表單時就向web伺服器發送一個請求。伺服器接收並處理傳來的表單，然後送回一個新的網頁。這個做法浪費了許多頻寬，因為在前後兩個頁面中的大部分HTML代碼往往是相同的。由於每次應用的交互都需要向伺服器發送請求，應用的響應時間就依賴於伺服器的響應時間。這導致了用戶界面的響應比本地應用慢得多。

與此不同，AJAX應用可以僅向伺服器發送並取回必需的數據，它使用SOAP或其它一些基於XML的頁面服務介面，併在客戶端採用JavaScript處理來自伺服器的響應。因為在伺服器和瀏覽器之間交換的數據大量減少（大約只有原來的5%），結果我們就能看到響應更快的應用。同時很多的處理工作可以在發出請求的客戶端機器上完成，所以Web伺服器的處理時間也減少了。

[編輯]

發展史

該技術在1998年前後得到了應用。允許客戶端腳本發送HTTP請求(XMLHTTP)的第一個組件由Outlook Web Access小組寫成。該組件原屬於微軟Exchange Server，並且迅速地成為了Internet Explorer 4.0[2]的一部分。部分觀察家認為，Outlook Web Access是第一個應用了Ajax技術的成功的商業應用程序，併成為包括Oddpost的網路郵件產品在內的許多產品的領頭羊。但是，2005年初，許多事件使得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最主要的批評就是，它可能破壞瀏覽器後退按鈕的正常行為（參見Jakob Nielsen's的《1999年Web設計新錯誤前10名》）。在動態更新頁面的情況下，用戶無法回到前一個頁面狀態，因為瀏覽器僅能記憶歷史記錄中的靜態頁面。一個被完整讀入的頁面與一個已經被動態修改過的頁面之間的差別非常微妙；用戶通常會希望單擊後退按鈕能夠取消他們的前一次操作，但是在Ajax應用程序中，這將無法實現。開發者們想出了種種辦法來解決這個問題，大多數都是在用戶單擊後退按鈕訪問歷史記錄時，通過創建或使用一個隱藏的IFRAME來重現頁面上的變更。（例如，當用戶在Google Maps中單擊後退時，它在一個隱藏的IFRAME中進行搜索，然後將搜索結果反映到Ajax元素上，以便將應用程序狀態恢復到當時的狀態。）

一個相關的觀點認為，使用動態頁面更新使得用戶難於將某個特定的狀態保存到收藏夾中。該問題的解決方案也已出現，大部分都使用URL片斷標識符（通常被稱為錨點，即URL中#後面的部分）來保持跟蹤，允許用戶回到指定的某個應用程序狀態。（許多瀏覽器允許JavaScript動態更新錨點，這使得Ajax應用程序能夠在更新顯示內容的同時更新錨點。）這些解決方案也同時解決了許多關於不支持後退按鈕的爭論。

進行Ajax開發時，網路延遲——即用戶發出請求到伺服器發出響應之間的間隔——需要慎重考慮。不給予用戶明確的回應[3]，沒有恰當的預讀數據[4]，或者對XMLHttpRequest的不恰當處理[5]，都會使用戶感到延遲，這是用戶不希望看到的，也是他們無法理解的。[6]通常的解決方案是，使用一個可視化的組件來告訴用戶系統正在進行後臺操作並且正在讀取數據和內容。

[編輯]

開發Ajax應用面臨的挑戰及解決方案

對程序員而言，開發Ajax應用最頭痛的問題莫過於以下幾點：

1. Ajax在本質上是一個瀏覽器端的技術，首先面臨無可避免的第一個問題即是瀏覽器的相容性問題。各家瀏覽器對於JavaScript/DOM/CSS的支援總有部分不太相同或是有Bug，甚至同一瀏覽器的各個版本間對於JavaScript/DOM/CSS的支援也有可能部分不一樣。這導致程序員在寫Ajax應用時花大部分的時間在調試瀏覽器的相容性而非在應用程序本身。因此，目前大部分的Ajax程序庫或開發框架大多以js程序庫的形式存在，以定義更高階的JavaScript API 、JavaScript對象（模板）、或者JavaScript Widgets來解決此問題。如prototype.js。
2. Ajax技術之主要目的在於局部交換客戶端及伺服器間之數據。如同傳統之主從架構，無可避免的會有部分的業務邏輯會實現在客戶端，或部分在客戶端部分在伺服器。由於業務邏輯可能分散在客戶端及伺服器，且以不同之程式語言實現，這導致Ajax應用程式極難維護。如有使用者介面或業務邏輯之更動需求，再加上前一個JavaScript/DOM/CSS之相容性問題，Ajax應用往往變成程序員的夢靨。針對業務邏輯分散的問題，Ajax開發框架大致可分為兩類：
   • 將業務邏輯及表現層放在瀏覽器，數據層放在伺服器：因為所有的程式以JavaScript執行在客戶端，只有需要數據時才向伺服器要求服務，此法又稱為胖客戶端（fat client）架構。伺服器在此架構下通常僅用於提供及儲存數據。此法的好處在於程序員可以充分利用JavaScript搭配業務邏輯來做出特殊的使用者介面，以符合終端使用者的要求。但是問題也不少，主因在第一，JavaScript語言本身之能力可能不足以處理複雜的業務邏輯。第二，JavaScript的執行效能一向不好。第三，JavaScript存取伺服器數據，仍需適當的伺服器端程序之配合。第四，瀏覽器相容性的問題又出現。有些Ajax開發框架如DWR企圖以自動生成JavaScript之方式來避免相容的問題，並開立通道使得JavaScript可以直接叫用伺服器端的Java程序來簡化數據的存取。但是前述第一及第二兩個問題仍然存在，程序員必須費相當的力氣才能達到應用程序之規格要求，或可能根本無法達到要求。
   • 將表現層、業務邏輯、及數據層放在伺服器，瀏覽器僅有使用者介面引擎（User Interface engine）；此法又稱為瘦客戶端（thin client）架構，或中心伺服器（server-centric）架構。瀏覽器的使用者介面引擎僅用於反映伺服器的表現層以及傳達使用者的輸入回到伺服器的表現層。由瀏覽器所觸發之事件亦送回伺服器處理，根據業務邏輯來更新表現層，然後反映回瀏覽器。因為所有應用程序完全在伺服器執行，數據及表現層皆可直接存取，程序員只需使用伺服器端相對較成熟之程序語言（如Java語言）即可，不需再學習JavaScript/DOM/CSS，在開發應用程序時相對容易。缺點在於使用者介面引擎以及表現層通常以標準組件的形式存在，如需要特殊組件（使用者介面）時，往往須待原框架之開發者提供，緩不濟急。如開源碼Ajax開發框架ZK目前支援XUL及XHTML組件，尚無XAML之支援。
3. Ajax是以非同步的方式向伺服器提交需求。對伺服器而言，其與傳統的提交表單需求並無不同，而且由於是以非同步之方式提交，如果同時有多個Ajax需求及表單提交需求，將無法保證哪一個需求先獲得伺服器的回應。這會造成應用程序典型的多程序（process）或多線程（thread）的競爭（racing）問題。程序員因此必須自行處理或在JavaScript裡面動手腳以避免這類競爭問題的發生（如Ajax需求未回應之前，先disable提交按鈕），這又不必要的增加了程序員的負擔。目前已知有自動處理此問題之開發框架似乎只有ZK。