Ajax基礎教程（3）- 3.2 發送請求參數

到此為止，你已經瞭解了如何使用Ajax技術向伺服器發送請求，也知道了客戶可以採用多種方法解析伺服器的響應。前面的例子中只缺少一個內容，就是你尚未將任何資料作為請求的一部分發送給伺服器。在大多數情況下，向伺服器發送一個請求而沒有任何請求參數是沒有什麼意義的。如果沒有請求參數，伺服器就得不到上下文資料，也無法根據上下文資料為客戶建立“個人化”的響應，實際上，伺服器會向每一個客戶發送同樣的響應。

要想充分發揮Ajax技術的強大功能，這要求你向伺服器發送一些上下文資料。假設有一個輸入表單，其中包含需要輸入郵件地址的部分。根據使用者輸入的ZIP編碼，可以使用Ajax技術預填相應的城市名。當然，要想尋找ZIP編碼對應的城市，伺服器首先需要知道使用者輸入的ZIP編碼。

你需要以某種方式將使用者輸入的ZIP編碼值傳遞給伺服器。幸運的是，XMLHttpRequest對象的工作與你以往慣用的HTTP技術（GET和POST）是一樣的。

GET方法把值作為名/值對放在請求URL中傳遞。資源URL的最後有一個問號（?），問號後面就是名/值對。名/值對採用name=value的形式，各個名/值對之間用與號（&）分隔。

下面是GET請求的一個例子。這個請求向localhost伺服器上的yourApp應用發送了兩個參數：firstName和middleName。需要注意，資源URL和參數集之間用問號分隔，firstName和middleName之間用與號（&）分隔：

http://localhost/yourApp?firstName=Adam&middleName=Christopher

伺服器知道如何擷取URL中的具名引數。當前大多數伺服器端編程環境都提供了簡單的API，使你能很容易地訪問具名引數。

採用POST方法向伺服器發送具名引數時，與採用GET方法幾乎是一樣的。類似於GET方法，POST方法會把參數編碼為名/值對，形式為name=value，每個名/值對之間也用與號（&）分隔。這兩種方法的主要區別在於，POST方法將參數串放在請求體中發送，而GET方法是將參數追加到URL中發送。

如果資料處理不改變資料模型的狀態，HTML使用規約理論上推薦採用GET方法，從這可以看出，擷取資料時應當使用GET方法。如果因為儲存、更新資料，或者發送了電子郵件，操作改變了資料模型的狀態，這時建議使用POST方法。

每個方法都有各自特有的優點。由於GET請求的參數編碼到請求URL中，所以可以在瀏覽器中為該URL建立書籤，以後就能很容易地重新請求。不過，如果是非同步請求就沒有什麼用。從發送到伺服器的資料量來講，POST方法更為靈活。使用GET請求所能發送的資料量通常是固定的，因瀏覽器不同而有所差異，而POST方法可以發送任意量的資料。

HTML form元素允許通過將form元素的method屬性設定為GET或POST來指定所需的方法。在提交表單時，form元素自動根據其method屬性的規則對input元素的資料進行編碼。XMLHttpRequest對象沒有這種內建行為。相反，要由開發人員使用JavaScript建立查詢串，其中包含的資料要作為請求的一部分發送給伺服器。不論使用的是GET請求還是POST請求，建立查詢串的技術是一樣的。惟一的區別是，當使用GET發送請求時，查詢串會追加到請求URL中，而使用POST方法時，則在調用XMLHttpRequest對象的send()方法時發送查詢串。

圖3-4顯示了一個樣本頁面，展示了如何向伺服器發送請求參數。這是一個簡單的輸入表單，要求輸入名、姓和生日。這個表單有兩個按鈕，每個按鈕都會向伺服器發送名、姓和生日資料，不過一個使用GET方法，另一個使用POST方法。伺服器以回顯輸入資料作為響應。在瀏覽器在頁面上列印出伺服器的響應時，請求響應周期結束。

圖3-4 瀏覽器使用GET或POST方法發送輸入資料，伺服器回顯輸入資料作為響應