Ajax技術原理分析

可以說Ajax不是一項技術，而是一種Web互動的操作模式。同時，Ajax并不是這兩年出現的什麼新東西，因為所有實作Ajax應用程式的元件都已經在我們的浏覽器裡存在若幹年了。

下面的時序圖可以清晰的展現Ajax技術在用戶端與伺服器之間往返交換資料的過程。

Ajax通過浏覽器内置的XMLHttpRequest對象與伺服器端互動，但需要注意的是，不同的浏覽器，建立XMLHttpRequest對象的方法可能不相同，使用下面的代碼應該可以保證在絕大多數的浏覽器中建立此對象：

/**//*

 * Returns a new XMLHttpRequest object, or false if this browser

 * doesn't support it

 */

function newXMLHttpRequest() 

...{

  var xmlreq = false;

  if (window.XMLHttpRequest) 

  ...{

    // Create XMLHttpRequest object in non-Microsoft browsers

    xmlreq = new XMLHttpRequest();

  } 

  else if (window.ActiveXObject) 

    // Create XMLHttpRequest via MS ActiveX

    try 

    ...{

      // Try to create XMLHttpRequest in later versions

      // of Internet Explorer

      xmlreq = new ActiveXObject("Msxml2.XMLHTTP");

    } 

    catch (e1) 

      // Failed to create required ActiveXObject

      try 

      ...{

        // Try version supported by older versions

        // of Internet Explorer

        xmlreq = new ActiveXObject("Microsoft.XMLHTTP");

      } 

      catch (e2) 

        // Unable to create an XMLHttpRequest with ActiveX

      }

    }

  }

  return xmlreq;

}

XMLHttpRequest對象readyState屬性的意義在于表示一次Ajax請求的生命周期狀态，它從0（代表“未初始化”）變化到4（代表“完成”）。每次readyState屬性變化時，readystatechange事件就觸發，則由onreadystatechange屬性指定的事件處理回調函數就被調用。

XMLHttpRequest對象status屬性的意義在于檢視請求是否成功完成。status屬性指向伺服器響應的HTTP狀态傳回碼。在執行簡單的GET和POST請求時，可以假設任何大于200的傳回碼都是錯誤的。

如果伺服器發送重定向響應（例如301或302），浏覽器會透明地進行重定向并從新的位置擷取資源；XMLHttpRequest看不到重定向的狀态碼。而且，浏覽器會自動添加"Cache-Control: no-cache"頭資訊到所有XMLHttpRequest，這樣用戶端代碼永遠也不用處理304（未經修改）伺服器響應。

需要注意的是，隻有當HTTP狀态傳回碼為200（OK狀态）時，才表示伺服器處理結果正确傳回，然後才能執行用戶端響應代碼。

     本文轉自胡奇 51CTO部落格，原文連結：http://blog.51cto.com/huqicto/280680，如需轉載請自行聯系原作者