再回顧Ajax相關的内容，再次梳理學習還是很有必要的，尤其是實際的開發中，ajax更是必不可少，仔細學習以便避免不必要的錯誤。
文章導讀：
--1.使用XMLHttpRequest----------
1.1 必備知識點
1.2 send()方法
1.3 再看CORS
--2.HTTP請求和響應----------------
2.1 Request Header中的參數
2.2 Response Header中的參數
2.3 GET請求和POST請求的差別
--3.jQuery中的Ajax---------------
從Ajax的工作原理來看，它是一種可以使用腳本操縱HTTP和Web伺服器進行資料交換并且不會導緻頁面重載的技術。Ajax的核心就是XMLHttpRequest對象。
這樣就執行個體化了一個XMLHttpRequest對象，每個xhr對象都表示一個獨立的請求響應對，通過這個對象的屬性和方法我們可以檢視請求的細節和得到響應的資料。
1.1 必備知識點
下面舉個梨子：
View Code
從中可以看到一些xhr對象的方法和屬性：
--- xhr.setRequestHeader("Content-Type","text/plain");它用來設定請求頭的資訊，post請求通常會設定前面的Content-Type的請求頭，比如說我想跨域發送請求，那你可能就要設定xhr.setRequestHeader("Origin","url")了(要真的跨域還需要在伺服器端設定Access-Control-Allow-Origin)。但是并不能設定所有的請求頭資訊，你可以設定除了下面這些頭之外的資訊：Accept-Charset,Accept-Encoding,Connection,Content-Length,Cookie,Cookie2,Content-Transfer-Encoding,Date,Expect,Host,Keep-Alive,Referrer,User-Agent,Trailer,Transfer-Encoding,Upgrade,Via.
--- xhr.getResponseHeader()和xhr.getAllResponseHeader()用來查詢響應頭資訊。
--- xhr.status(數字)和xhr.statusText(文本)傳回HTTP狀态碼(200,404等)；
--- xhr.responseText(文本形式)和xhr.responseXML(document形式)得到響應主體；
--- xhr.readyState得到一個整數，指定了HTTP請求的狀态，有如下對應關系：
--- xhr.overrideMimeType('text/plain;charset=x-user-defined');overrideMimeType方法用來指定伺服器傳回的資料的Mime類型；
--- xhr.responseType屬性，它用來指定伺服器傳回的資料的類型，xhr2允許使用者自行設定這個屬性了(上面的overrideMimeType方法就是一般在不支援這個屬性的情況下使用的)。
xhr.responseType='text'(字元串)/'arrayBuffer'/'blob'(二進制資料)/'document'/'json'(JSON對象)
--- 事件：XMLHttpRequest對象原本隻有一個事件xhr.onreadystatechange = function(){}，但是XMLHttpRequest2擴充了幾個新的事件：
1.2 send()方法
請求中的send()方法，通常在發送POST請求時用于發送主體資料，發送GET請求時通常為空。
在XHR2中send()方法可以發送很多類型的資料。
通過Ajax送出表單資料還是很有意義的。傳統的做法中，點選頁面中表單的submit按鈕，需要跳轉到一個空頁面，然後再對原頁面的資料進行處理。ajax則不用，可以直接在原頁面進行送出後的處理。
發送FormData類型的資料為我們提供了便利：
1.3 再看CORS
CORS（跨域資源共享），它的出現就是為了解救Ajax受限于同源政策，實作跨域。
預檢機制：
我們可能隻知道要實作跨域要請求頭帶上Origin頭，并且伺服器響應Access-Control-Request-Method頭表示同意跨域的請求。但其實我們忽略了它背後的一個預檢機制，也就是說會有類似這樣一個預檢請求：
OPTIONS就是告訴我們這是一個“預檢”請求。裡面有關鍵的Origin頭資訊。
這兩個頭資訊就告訴伺服器，如果我發送請求的話将會是POST請求，我還可能自己定義個X-PINGOTHER的請求頭資訊。
同樣的，伺服器也會響應這個預檢的請求：
我們期待伺服器同意我的跨域請求的Access-Control-Allow-Origin頭也有了，告訴我伺服器同意了。也同意了我想自定義一個請求頭資訊的願望。
下面還有一個響應頭資訊：
它呢，是用來控制這條預檢請求的緩存時長的，在這1728000秒之内，都不用再發送預檢請求了。
因為整個預檢的過程都是浏覽器在背景神不知鬼不覺完成的，是以我們都不知道。
CORS中的Cookie：
CORS機制預設是不會發送cookie資訊和HTTP的認證資訊的，除非我們改變設定。可以這樣：
同時伺服器響應：
這時，我們在發送請求的時候才會捎帶上cookie的資訊，而且這裡的cookie也遵循同源政策，隻有伺服器域名下的cookie資訊才會被捎帶。
因為Ajax就是用來與伺服器通信的，那麼這裡它就離不開HTTP，也就會去請求然後獲得響應。這裡稍微詳細的了解下請求頭與響應頭相關的資訊。
一個 HTTP請求由4部分組成：
-- HTTP請求方法或“動作”；
-- 正在請求的URL；
-- 一個可選的請求頭集合，其中可能包括身份驗證資訊；
-- 一個可選的請求主體 ；
伺服器傳回的HTTP響應包含3部分：
-- 一個數字和文字組成的狀态碼，用來顯示請求的成功和失敗
-- 一個響應頭集合
-- 響應主體
我在網上找了一個參數盡可能多的請求，下面是它的請求頭資訊和響應頭資訊：
2.1 Request Headers中的一些參數：
1. Accept:text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
含義：浏覽器支援的 MIME 類型分别是 text/html、application/xhtml+xml、application/xml 和 */*，優先順序是它們從左到右的排列順序。
詳解：
-- Accept表示浏覽器支援的 MIME 類型；
-- MIME的英文全稱是 Multipurpose Internet Mail Extensions（多功能 Internet 郵件擴充服務），它是一種多用途網際郵件擴充協定，在1992年最早應用于電子郵件系統，但後來也應用到浏覽器;
-- text/html,application/xhtml+xml,application/xml 都是 MIME 類型，也可以稱為媒體類型和内容類型，斜杠前面的是 type（類型），斜杠後面的是 subtype（子類型）,type 指定大的範圍，subtype 是 type 中範圍更明确的類型，即大類中的小類;
-- Text用于标準化地表示的文本資訊，文本消息可以是多種字元集和或者多種格式的;
-- text/html表示 html 文檔;
-- Application：用于傳輸應用程式資料或者二進制資料;
-- application/xhtml+xml表示 xhtml 文檔;
-- application/xml表示 xml 文檔;
-- q是權重系數，範圍 0 =< q <= 1，q 值越大，請求越傾向于獲得其“;”之前的類型表示的内容，若沒有指定 q 值，則預設為1，若被指派為0，則用于提醒伺服器哪些是浏覽器不接受的内容類型。
2.Accept-Encoding: gzip, deflate
含義：标示浏覽器支援的壓縮編碼是gzip和deflate和sdcn。
3.Accept-Language:zh-CN,zh;q=0.8
含義：浏覽器支援的語言，zh-CN是簡體中文，zh是中文。
4.Cache-Control:max-age=0(請求頭中的Cache-Control)
含義：Cache-Control頭是用來在請求/響應這個過程中控制緩存的。
他可以有的參數:
max-age=0機關是秒，它表示用戶端可接受的響應等待時間；
max-stale表示用戶端願意接受一個響應，即使它已經超過了它新鮮的壽命（可以有值也可以沒有值）；
min-fresh=10他表示用戶端願意接受一個響應的保鮮壽命不小于目前的年齡加上指定的時間在幾秒鐘内；
no-cache表示不接受緩存的響應；
no-store表示緩存不可以儲存請求和響應的任何部分；
only-if-cache:它表示用戶端隻想要獲得一個被緩存起來了的響應。
5.Host
含義：用戶端指定自己想通路的WEB伺服器的域名/IP 位址和端口号.
6.Content-Type:application/x-www-form-urlencoded
含義：請求頭的Content-Type定義傳遞到伺服器的資料類型，資料由伺服器端處理！Content-Type後面的值就是一個MIME類型。application/x-www-form-urlencoded實際上就是指表單送出的資料，如果上傳附件，就會是multipart/form-data。響應頭的Content- Type定義傳回到用戶端的資料類型。
其他一些常見易了解的參數，這裡就不列舉啦。
2.2 Response Headers中的一些參數：
1.Accept-Ranges:bytes
含義：WEB伺服器表明自己是否接受擷取其某個實體的一部分（比如檔案的一部分）的請求。bytes：表示接受，none：表示不接受。
2.Cache-Control：Public
public(可以用 Cached 内容回應任何使用者)
private（隻能用緩存内容回應先前請求該内容的那個使用者）
no-cache（可以緩存，但是隻有在跟WEB伺服器驗證了其有效後，才能傳回給用戶端）
max-age：（本響應包含的對象的過期時間）
ALL: no-store（不允許緩存）
3.ETag
含義：它是一個對象的标志值，用于确認請求的檔案是否被更改。比如一個 html 檔案，如果被修改了，其 Etag 也會别修改，是以，ETag 的作用跟 Last-Modified 的作用差不多，主要供 WEB 伺服器判斷一個對象是否改變了。比如前一次請求某個 html 檔案時，獲得了其 ETag，當這次又請求這個檔案時，浏覽器就會把先前獲得的 ETag 值發送給 WEB 伺服器，然後 WEB 伺服器會把這個 ETag 跟該檔案的目前 ETag 進行對比，然後就知道這個檔案有沒有改變了。
4.Expires
含義：WEB伺服器表明該實體将在什麼時候過期，對于過期了的對象，隻有在跟WEB伺服器驗證了其有效性後，才能用來響應客戶請求
5.Last-Modified
含義：WEB 伺服器認為對象的最後修改時間，比如檔案的最後修改時間，動态頁面的最後産生時間等等
<a href="http://yolcy.blog.163.com/blog/static/105307937201022471913971/" target="_blank">更為詳細些的頭部參數的說明</a>
2.3 GET請求和POST請求的差別
也許你也曾想過GET和POST方法的差別，這裡整理一下我了解到的：
GET：
POST：
我們一般實際應用的時候大部分都是jQuery或Zepto中的Ajax了。
我給自己列了些細節或要點，有時很有用，有時會避免錯誤：
1.$.ajax()會傳回建立的XMLHttpRequest對象，然後我們可以就可以應用xhr對象的一些屬性或方法了，但大多數情況下我們不會用到，像這樣：
2.cache：false
有時候我們發送了個請求，傳回的資料也得到了，但是後端同學在相同的接口中準備傳回給你跟之前不同的資料比如說多一個字段，或少一個字段時。你肯定期待拿到新的資料了，但如果的你請求是get請求的話那麼浏覽器就會緩存你的Ajax請求，post請求一般不存在這個問題，于是你就納悶了為什麼資料沒有變化。于是我們可以設定cache：false，使每次都發送請求而不是取緩存中的。
3.context:document.body
context參數可以指定回調函數的上下文，使回調函數中的$(this)指向context參數對應的DOM元素。
4.dataType：'xml'/'jsonp'/'html'/'script'/'json'/'text'
這是最簡單務實的一個參數了，用于定于預期伺服器傳回的資料類型。設定值為‘script’時，将傳回純文字js代碼，并且不會自動緩存結果，除非顯示的設定cache為true，并且所有的POST請求都會被轉為GET請求。設定值為‘jsonp’時，如果我們自己沒有顯示的定義回調函數的名字，jQuery會自動的幫我們添加，以正确的執行回調函數。這樣我們回調函數的參數data就是json類型的資料了。
進一步準備學習和實戰練習的：
利用XMLHttpRequest對象特别是擴充了的二級XMLHttpRequest對象，我們還可以做很多事情，比如說：①Ajax上傳檔案（可以使用FormData接口或File API）②獲得progress元素的上傳進度（xhr對象的upload屬性的progress事件）③使用abort()方法終止請求和實作逾時 等等。
HTTP用來在用戶端和伺服器之間建立連接配接進行交流，那麼利用HTTP請求頭資訊和響應頭資訊其實也能做很多事情，比如：①正确的配置資訊頭實作請求的緩存，加快響應使用者的速度②控制安全的請求同伺服器互動等等。
Jquery源碼中ajax的實作方式，思想學習以及與Zepto中Ajax實作的不同。
參考資料&相關閱讀：