JQuery jQuey Ajax- POST請求

這裡寫目錄标題

• • 6.2.3 POST請求
  • 參考目錄

6.2.3 POST請求

       POST 請求方式與 GET 請求方式截然不同。 POST 請求支援發送任意格式 、 任意長度的資料 ， 而不僅僅限于名／值對字元串 。 傳遞二進制的檔案、 大容量資訊、 安全資訊或 XML 格式資料時 ， 使用POST方式比較高效。

       一般來說，POST 請求用千在表單中輸入資料後的送出過程。 與 GET 請求相似，POST 請求的參數也必須進行編碼， 并用連字元（＆）進行分隔。 這些參數在發送 POST 請求時 ， 不會被附加到 URL 的末尾， 而是作為 send()方法的參數進行傳遞， 然後被送到伺服器端。

       例如，針對 test 1.asp?name=zhangsan&pass= 123456&age= I 查詢字元串，可以作為參數傳遞給 send(）方法 ，代碼如下：

       如果使用POST 方式模仿 6.2.1 節示例效果實作把 name=zhangsan 參數資訊傳遞給伺服器， 則可以使用如下代碼：

<script type="text/javascript"> 
//省略定義XMLHttpRequest對象
window.onload = function(){ 
    var input = document.getElementsByTagName("input")[0]; 
    input.onclick = function(){ 
         xmlhttprequest.open("POST", "test2.asp", false); //建立連接配接
         xmlhttprequest.setRequestHeader('Content-type','application/x-www-form-urlencoded'); 
         xmlhttprequest.send("name=zhangsan"); //發送請求
         alert(xmlhttprequest.response Text); //提示伺服器端響應資訊
     }
}
</script> 

<input type="button" value=“向伺服器發出異步請求“/>
           

       使用 POST方式進行請求， 需要對部分代碼進行修改：

       （1）在 openO方法中設定第 1 個參數為 POST, 表明目前請求 連接配接是 POST方式。

       （2）調用setRequestHeader()方法設定請求的消息頭，指定請求内容類型為application/x-www-fonn-urlencoded。

       application/x-www-form-urlencoded 類型表示傳遞的是表單值，一般使用POST 發送請求時都必須設定該選項， 否則伺服器會無法識别傳遞過來的資料。 setRequestHeader()方法的具體用法如下：

       為了友善伺服器能夠識别目前請求 為 Ajax 異步請求 ， 一般設定頭部資訊中 User-Agent 首部為XMLHTTP, 以便于伺服器端能夠辨識出 XMLHttpRequest 異步請求和其他用戶端普通請求。 例如：

       這樣就可以在伺服器端編寫腳本分别為現代浏覽器和不支援 JavaScript 的浏覽器呈現不同的文檔，以提高 可通路性的手段。 如果使用POST方法傳遞資料，就必須設定另一個頭部資訊：

       用于發送 POST 請求的資料類型 (Content Type) 通常是 application/x-www-form- urlencoded, 這意味着還可以以 text/xml 或 application/xml 類型給伺服器直接發送 XML 資料， 甚至以 application/json 類型發送JavaScript 對象資料。 例如， 下面的示例将向伺服器端發送 XML 類型的資料， 而不是簡單的名／值對參數：

       讀者可以通路 http://www.w3.org/Protocols/HTTP/HTRQ_Headers.html 了解 HTTP 請求頭資訊的總覽表。

       （3）在 send(）方法中傳遞參數值，該值是一個或多個名／值對，多個名／值對之間使用 “ & “ 分隔符進行分隔。 這樣在ASP伺服器端就可以利用Request.Form(）方法捕獲所傳遞過來的值。

       在名／值對中，“名 “ 可以為表單域的名稱（與表單域相對應），“值” 可以是固定的值，也可以是一個變量。 如果是變批， 可以把表單域内包含的值直接傳遞給變拯，再由變扯負責把資料傳遞給伺服器端。

       （4）必須把open(）方法中的第3個參數值設狸為false,即關閉異步通信。 如果不需要通過send(）方法傳遞資料，則隻要傳遞null作為參數值即可。

       最後，還衙要對伺服器端的請求檔案進行修改，使用Request.Form(）方式擷取用戶端傳遞的參數值。

       注意，針對GET和POST方式， 伺服器端擷取資料的方法也是不同的， 不同的伺服器技術可能會略有差別， 上面示例主要根據ASP技術進行示範。

       jQuery定義了post(）方法，專門負責通過遠端HTTP POST 請求方式載入資訊。 該方法是一個簡單的POST請求功能， 以取代複雜的＄.ajax(）方法。

       post(）方法包含4個參數， 與get()方法相似。 其中， 第1個參數為必須設定的參數， 後面3個參數為可選參數：

       （1）第1個參數表示要請求頁面的URL位址。

       （2）第2個參數表示一個對象結構的名／值對清單。

       （3）第3個參數表示異步互動成功之後調用的回調函數。 回調函數的參數值為伺服器端響應的資訊。

       （4）第4個參數表示伺服器端響應資訊傳回的内容格式， 如XML、 HTML、 Script 、 JSON和Text, 或者＿default。

       例如， 在下面這個示例中，使用post(）方法向伺服器端的test2.asp 檔案發出 一個請求，并把一組資料傳遞給該檔案， 然後在回調函數中讀取并顯示伺服器端響應的資訊。

<script src="images/jquery-1.3.2.js" type="text/javascript" ></script>
<script type="text/javascript">
$(function(){
     $("input").click(function(){  //綁定click事件
              $.post("test2.asp",{//向test2.asp檔案送出請求
					name: "zhangsan",//發送的清求資訊
					pass: 123456,
					age: 1
             },function(data){ //回調函數
                  alert(data);//顯示響應資訊

      });
  });
})
</script>
<input type="button" value="jQuery實作的異步請求“ I>
           

       通過上面示例可以看到post(）方法與get(）方法在用法上是完全相同的，資料傳遞和接收響應資訊的方式都相同，唯 一差別是請求方式不同 。 具體選用哪個方法， 主要取決于用戶端所要傳遞的資料容量和格式，同時應該考慮伺服器端接收資料的處理方式。

       不管是 get()方法，還是 post(）方法， 它們都是一種簡單的請求方式， 對于特殊的資料請求和響應處理．應該選擇＄ajax(）方法。 ajax(）方法的參數比較多且複朵， 能夠處理各類特殊的異步互動行為 ， 關千這個問題請參閱 6.2.4 節内容。

參考目錄

絕大多數内容來自于：jQuery開發從入門到精通 作者: 袁江（6.2.3 POST請求）