認識AJAX -- 20141113

何謂AJAX？

    簡單說就是非同步的網頁技術，是J.J Garrett(2005年初)提出來的一種網頁技術，其AJAX的全名為Asynchronous JavaScript And XML。由於傳統的網頁應用，用戶端必須將整個網頁表單傳回伺服器端，經由伺服器端處理後，再回傳整個網頁內容到用戶端，往往造成許多頻寬的浪費。
    為了解決這問題，故採取AJAX技術，僅將網頁部分內容回傳伺服器端，在將更新後的最新消息載入用戶端，減少資料在網路上傳送，降低伺服器負載，提升網頁的處理效率。


--------------------------------------------------------------------------------網頁「同步」與「非同步」模式的差異？

例子：當網頁中只有最新消息的需要進行更新，而網頁其他部分(選單、廣告、版權...等)不需要進行更新。

同步處理：
根據上述例子，在傳統的動態伺服器網頁，必須將整個網頁全部回傳至伺服器端，經過伺服器端處理並取的資料庫最新消息之後，再將整個網頁全部內容包含網頁其他部分全部回傳至用戶端。缺點：當伺服器端忙碌或網路速度變慢的時候，此時用戶端的使用者只能等待。


非同步處理：
同樣根據上述例子，在不換頁的情形下，只更新最新消的區塊，且整個網頁只將最新消息區怪回傳至伺服器端，再將更新後的最新消息載入至用戶端，其餘的部份(選單、廣告、版權...等)並不會傳至伺服器端也不會刷新頁面。優點：在伺服器和瀏覽器之間交換的資料大量減少(大約只有原來的5%)，伺服器回應更快了，因此Web伺服器的負荷也減少了。

--------------------------------------------------------------------------------------------------------

補充：
AJAX網頁屬於用戶端(展示層)的技術，再用戶端的瀏覽器必須使用JavaScript的XMLHttpRequest送出非同步的Http Request，此時只會將指定的欄位資料傳送至伺服器端，而網頁的其他資料並不會進行回傳(PostBack)，接著再透過Http Response方式將更新後的執行結果下載至用戶端的瀏覽器，最後透過JavaScript將更新後的執行結果以背景執行的方式寫回DHTML或DOM(Document Object Model)指定的標籤區塊，此時指定的區塊即會進行更新，由於傳送和接收資料是屬於非同步的模式，因此使用者可以在不換頁的情形下繼續在網頁上進行任何操作。



------------補充 20150807-----------------------------------------------

名詞解釋：

• XMLHttpRequest物件：用途是被設計來透過HTTP在瀏覽器和伺服器之間接收及傳遞XML或其他格式資料。
• xmlHttp：是經由Javascript程式產生出來的XMLHttpRequest物件，被命名為xmlHttp。

方法名稱	說明
abort( )	中止要求。
getAllResponseHeaders( )	取得所有標頭字串值，以成對的「標頭字串/值」的方式回傳。
getResponseHeader( )	傳回指定標頭字串值，send方法成功後，才可呼叫open( )建立和伺服器連線所需資料。
send( )	向伺服器提出要求。
setRequestHeader( )	設定標頭字串值。
屬性名稱	說明
onreadystatechange	是件處理器，每次對伺服器要求狀態改變時，就會觸動這個事件。
readyState	XMLHttpRequest物件狀態值，可能的回傳值有： 0 = 還沒有開始 1 = 正在載入 2 = 載入完成 3 = 溝通中 4 = 動作完成
responseText	伺服器以文字型式回傳結果。
responseXML	伺服器以XML型式回傳結果，這裡的XML指和DOM相容文件即可。
status	伺服器回傳代表執行結果狀態。如200帶表完成，404代表找不到要求連線的字串。
statusText	伺服器回傳代表執行結果的文字， 和status是相對照的。

參考資料：維基百科、ASP.NET 4.0從零開始(C# 2010)