向伺服器傳送請求

如需向伺服器傳送請求，我們使用 XMLHttpRequest 物件的open()和send()方法：

xhttp.open("GET", "ajax_info.txt", true);
xhttp.send();

GET 還是 POST？

GET 比 POST 更簡單更快，可用於大多數情況下。

不過，請在以下情況始終使用 POST：

• 快取檔案不是選項（更新伺服器上的檔案或資料庫）
• 向伺服器傳送大量資料（POST 無大小限制）
• 傳送使用者輸入（可包含未知字元），POST 比 GET 更強大更安全

GET 請求

一條簡單的 GET 請求：

例項

xhttp.open("GET", "demo_get.asp", true);
xhttp.send();

在上面的例子中，您可能會獲得一個快取的結果。為了避免此情況，請向 URL 新增一個唯一的 ID：

例項

xhttp.open("GET", "demo_get.asp?t=" + Math.random(), true);
xhttp.send();

意甲新聞

如果您需要用 GET 方法來發送資訊，請向 URL 新增這些資訊：

例項

xhttp.open("GET", "demo_get2.asp?fname=Bill&lname=Gates", true);
xhttp.send();

POST 請求

一條簡單的 POST 請求：

例項

xhttp.open("POST", "demo_post.asp", true);
xhttp.send();

如需像 HTML 表單那樣 POST 資料，請通過setRequestHeader()新增一個 HTTP 頭部。請在send()方法中規定您需要傳送的資料：

例項

xhttp.open("POST", "ajax_test.asp", true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("fname=Bill&lname=Gates");

url- 伺服器上的檔案

open() 方法的url引數，是伺服器上檔案的地址：

xhttp.open("GET", "ajax_test.asp", true);

該檔案可以是任何型別的檔案，如 .txt 和 .xml，或伺服器指令碼檔案，如 .asp 和 .php（它們可以在傳送迴響應之前在伺服器執行操作）。

非同步 - ture 還是 false？

如需非同步傳送請求，open()方法的async引數必須設定為 true：

xhttp.open("GET", "ajax_test.asp", true);

傳送非同步請求對 web 開發人員來說是一個巨大的進步。伺服器上執行的許多工都非常耗時。在 AJAX 之前，此操作可能會導致應用程式掛起或停止。

通過非同步傳送，JavaScript 不必等待伺服器響應，而是可以：

• 在等待伺服器響應時執行其他指令碼
• 當響應就緒時處理響應

onreadystatechange 屬性

通過 XMLHttpRequest 物件，您可以定義當請求接收到應答時所執行的函式。

這個函式是在 XMLHttpResponse 物件的onreadystatechange屬性中定義的：

例項

xhttp.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
    document.getElementById("demo").innerHTML = this.responseText;
  }
};
xhttp.open("GET", "ajax_info.txt", true);
xhttp.send();

您將在稍後的章節學到更多有關 onreadystatechange 的知識。

同步請求

如需執行同步的請求，請把open()方法中的第三個引數設定為false：

xhttp.open("GET", "ajax_info.txt", false);

有時 async = false 用於快速測試。你也會在更老的 JavaScript 程式碼中看到同步請求。

由於程式碼將等待伺服器完成，所以不需要 onreadystatechange 函式：

例項

xhttp.open("GET", "ajax_info.txt", false);
xhttp.send();
document.getElementById("demo").innerHTML = xhttp.responseText;

我們不推薦同步的 XMLHttpRequest (async = false)，因為 JavaScript 將停止執行直到伺服器響應就緒。如果伺服器繁忙或緩慢，應用程式將掛起或停止。

同步 XMLHttpRequest 正在從 Web 標準中移除，但是這個過程可能需要很多年。

現代開發工具被鼓勵對使用同步請求做出警告，並且當這種情況發生時，可能會丟擲 InvalidAccessError 異常。