JavaScript:
Einen HTTP-Request senden

So geht’s:

// Einfacher GET Request mit fetch
fetch('https://api.example.com/data')
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.error('Fehler:', error));

// POST Request mit fetch
fetch('https://api.example.com/data', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({key: 'value'}),
})
  .then(response => response.json())
  .then(data => console.log('Erfolg:', data))
  .catch(error => console.error('Fehler:', error));

Sample Output:

Erfolg: {key: "value"}

Deep Dive

Früher wurde XMLHttpRequest für HTTP-Requests verwendet, aber fetch ist neuer, verspricht basiert, und einfacher. Es gibt auch Libraries wie Axios oder das ältere jQuery.ajax. Bei komplexeren Anforderungen (z.B. Fortschritt Events) könnten Alternativen nützlich sein, aber für die meisten Fälle reicht fetch.

Die wichtigsten Aspekte beim Implementieren von HTTP-Requests in JavaScript:

  • Die API/Server muss CORS (Cross-Origin Resource Sharing) erlauben, sonst blockiert der Browser den Aufruf.
  • fetch gibt nicht direkt das JSON zurück, sondern ein Response-Objekt, aus dem man das JSON erst extrahieren muss.
  • HTTP-Statuscodes geben an, ob und wie der Request erfolgreich war.
  • Fehlerhandling ist wichtig, da vieles schiefgehen kann (Netzwerkprobleme, falsche Daten, Serverprobleme).

Siehe Auch