- 作者：吳俊傑
- 性別：男
- 郵箱：sshroot@126.com
- 文章類型：原創
- 博客：http://www.cnblogs.com/voiphudong/
一、說明
http協議其實是一個相對比較簡單的應用層協議，這么多年來無數前端愛好者前仆后繼的在學習和研究它。本着知其然還要知其所以然，授人以漁的精神，將自己對http的一些淺見用事實加以說明，希望拋磚引玉，供大家學習交流，歡迎吐槽。在鄙視與被鄙視中學習和進步。
二、http協議說明
1）http 協議格式，報頭，請求行，應答行，頭部域，數據部分的知識請百度、google。這里要說明兩點知識，與本文有關
1. http協議的頭部和數據部分使用一個空行\r\n 隔開的，對於GET方法，沒有數據部分；對於POST方法，數據部分是附加為http數據包的數據部分發送給服務器的
2. http POST方法，客戶端POST過去的數據一般是必須在http協議頭部有明確字節數說明的
三、實驗用到的工具軟件
firefox的firebug插件
大名鼎鼎的抓包工具wireshark
四、實例說明
1）正常情況下的html表單提交
html源碼如下:
<!DOCTYPE HTML>
<html>
<head>
<title>測試</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<script type="text/javascript" src="jquery-1.8.0.min.js"></script>
</head>
<body>
<form action="a2.php" name="form1" method="post">
姓名：<input type="text" name="username" value="wjj">
年齡：<input type="text" name="age" value="26">
<input type="submit" value="提交">
</form>
</body>
......
顯示如下：
點擊“提交”按鈕后，firebug顯示表單提交如下：
在看看POST請求頭部信息，如下：
這里我提出一個疑問：為什么http請求頭部中的 Content-Length的值為19，下面我們來分析一下wireshark數據抓包的結果，如下:
可以看到，在數據抓包中，明顯的就給出了http協議的所有字節。現在直接給出結果：字符串（不含引號）“username=wjj&age=26”附在POST請求頭的后面,由\r\n(圖中第3條紅線標記)空行來分割http請求頭和其中的數據部分，字符串作為數據部分，長度正好是19Byte ，所以 http頭部的 Content-Length: 域的值為19
2）弄明白上述原理后，我下面就直接給出幾個結論，其中都是我抓取數據包證實過的，尤其是ajax的理解。
1. 普通的html表單提交，就是把form域中的表單，組織成“查詢字符串形式”，例如上面的：“username=wjj&age=26”，有“=”和"&"，放在http協議的數據部分，提交給web服務器處理，web服務器端的腳本語言，例如PHP可以把這些查詢字符串格式的數據分割成$_POST的關聯數組，通過這種方式取到表單值。上面的例子充分可以證實這個結論。
2. 如果在Linux下面運行 wget --post-data="xxxxxxxx" url的命令來發送post請求 ,或者是post curl推送，都是把數據“xxxxxxxx”作為http協議數據發送給服務器端，但是此處沒有 AAA=BBB 這樣查詢字符串的數據形式，那么web服務器端的php腳本就沒法構成$_POST數組，如果是用： wget --post-data="u=wjj&p=123" ,那么在服務器端就可以通過$_POST['u']和$_POSt['123']去到值。請自行抓包分析。
3）對於jquery的ajax提交，分兩種情況說明：
第一，data的值是字符串格式，如下：
function dosubmit(){
var url = "a2.php";
var str = "username=wjj&age=18";
//alert(str);return false;
$.ajax({
type: 'POST',
url: url,
data: str,
dataType: "html",
success: function(text){
alert(text);
}
});
上面jquery的ajax是直接把str字符串的值，作為POST請求的數據部分發送到服務器端的，至於服務器端接受到數據后的處理，和其它情況就一樣了
第二，data的值是對象格式，如下：
function dosubmit(){
var url = "a2.php";
var obj = {u:'wjj',a:18,secret:'ab12'};
$.ajax({
type: 'POST',
url: url,
data: obj,
dataType: "html",
success: function(text){
alert(text);
}
});
}
上面ajax構造http頭部和數據部分發送數據的時候是這樣處理的，它是把對象var obj = {u:'wjj',a:18,secret:'ab12'}進行構造，構造成字符串“u=wjj&a=18&secret=ab12”的形式，然后作為http POST的數據部分發送給服務器端的。可以用wireshark抓包證明。
五、請自行測試，不早了，睡覺！