AJAX POST Request

Question

Wie kann ich einen HTTP POST Request mit Ajax machen?

var xhr = new XMLHttpRequest();
xhr.open('POST', 'ajax.php?a=1&b=2&c=3', true);

xhr.onload = function() {
  if (xhr.status >= 200 && xhr.status < 300) {
    console.log(xhr.responseText);
  } else {
    console.error('Status:', xhr.status);
  }
};

xhr.send();

Answer 1

Ein POST Request sendet die Daten nicht in der URL. Statt dessen musst du die POST Daten in der send() Methode mitsenden.

var xhr = new XMLHttpRequest();
var url = 'ajax.php';
var params = 'a=1&b=2&c=3';  // Daten, die im POST Request gesendet werden

xhr.open('POST', url, true);
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');

xhr.onload = function() {
  if (xhr.status >= 200 && xhr.status < 300) {
    console.log(xhr.responseText);
  } else {
    console.error('Status:', xhr.status);
  }
};

xhr.send(params);

Hier ist ein Beispiel, wie derselbe Request mit der Fetch API aussehen würde.

var url = 'ajax.php';
var params = new URLSearchParams();
params.append('a', '1');
params.append('b', '2');
params.append('c', '3');

fetch(url, {
  method: 'POST',
  body: params
})
.then(response => {
  if (response.ok) {
    return response.text();
  } else {
    throw new Error('Network response was not ok.');
  }
})
.then(data => console.log(data))
.catch(error => console.error('Fetch Error:', error));