如何在 JavaScript 中使用 XMLHttpRequest 發送 POST 資料？

在JavaScript 中透過XMLHttpRequest 發送POST 資料

在JavaScript 中，XMLHttpRequest 提供了一種向伺服器發送HTTP 請求的簡單方法，包括攜帶請求資料的POST請求。讓我們考慮如何使用 XMLHttpRequest 發送與表單等效的資料。

假設您有一個包含以下隱藏輸入的HTML 表單：

<form name="inputform" action="somewhere" method="post">
  <input type="hidden" value="person" name="user">
  <input type="hidden" value="password" name="pwd">
  <input type="hidden" value="place" name="organization">
  <input type="hidden" value="key" name="requiredkey">
</form>

要使用XMLHttpRequest 複製此表單數據，您可以使用下列JavaScript 程式碼片段：

var http = new XMLHttpRequest();
var url = 'get_data.php';
var params = 'user=person&pwd=password&organization=place&requiredkey=key';
http.open('POST', url, true);

// Send appropriate header information
http.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');

http.onreadystatechange = function() {
    if(http.readyState == 4 && http.status == 200) {
        console.log(http.responseText);
    }
}
http.send(params);

在上面的程式碼中，「params」變數包含要提交的資料URL 編碼的鍵/值對。如果您希望從物件建立動態參數，請考慮以下程式碼：

var params = new Object();
params.user = 'person';
params.pwd = 'password';
params.organization = 'place';
params.requiredkey = 'key';

// Encode the object into URL-encoded key/value pairs
let urlEncodedDataPairs = [], name;
for( name in params ) {
 urlEncodedDataPairs.push(encodeURIComponent(name) + '=' + encodeURIComponent(params[name]));
}

var params = urlEncodedDataPairs.join('&');

然後可以在 XMLHttpRequest 請求中使用此修改後的「params」變量，如前所述。

以上是如何在 JavaScript 中使用 XMLHttpRequest 發送 POST 資料？的詳細內容。更多資訊請關注PHP中文網其他相關文章！