TypeScript:
Einen HTTP-Request senden

How to:

TypeScript mit Axios:

import axios from 'axios';

async function fetchData() {
  try {
    const response = await axios.get('https://api.meineseite.de/daten');
    console.log(response.data);
  } catch (error) {
    console.error(error);
  }
}

fetchData();

Ausgabe:

{
  "users": [
    { "id": 1, "name": "Max Mustermann" },
    { "id": 2, "name": "Erika Musterfrau" }
  ]
}

Zum Einrichten von Axios:

1. npm install axios
2. Obigen Code in einer .ts Datei.

TypeScript mit fetch API:

async function fetchData() {
  try {
    const response = await fetch('https://api.meineseite.de/daten');
    const data = await response.json();
    console.log(data);
  } catch (error) {
    console.error(error);
  }
}

fetchData();

Deep Dive

Vor Jahrzehnten starteten HTTP-Anfragen meist nur beim Laden einer Seite. AJAX änderte das: dynamische Anfragen ohne Neuladen. Heute gibt’s viele Optionen: XMLHttpRequest, fetch, diverse Bibliotheken wie jQuery.ajax, axios oder superagent. Bei TypeScript achte man auf Typsicherheit – axios und fetch können über Generics die Datenstruktur definieren.

See Also

• MDN zu fetch: https://developer.mozilla.org/de/docs/Web/API/Fetch_API
• Axios GitHub Repository: https://github.com/axios/axios
• TypeScript Handbook: https://www.typescriptlang.org/docs/handbook/intro.html