Inhalte:
In der IT stößt man gelegentlich auf den Begriff „Request“. Aber was genau steckt hinter dem Begriff, wofür verwendet man es und was gibt es zu beachten?
Das alles erfährst du in diesem Beitrag.
Was ist eine Request?
Eine Request ist ein Aufruf einer bestimmten URL (API, Schnittstelle). Dieser Aufruf findet durch ein Programm statt, beispielsweise mittels fetch in JavaScript.
Dein Browser macht z.B. genau das, wenn du eine Website aufrufst: Er sendet eine GET-Abfrage ab, empfängt den Inhalt der Webseite und rendert ihn.
Diese Art der Abfragen nennt man auch AJAX.
Welche Request-Arten gibt es?
Requests können mit verschiedenen Methoden gemacht werden.
Ich werde hier beispielsweise mit meiner testapi verschiedene Anfragenausführen (JavaScript), um dir deren Funktionsweise zu verdeutlichen.
Weitere Infos erhältst du z.B. bei der offiziellen Übersicht von MDN.
GET
Bei GET erhält der Absender (JavaScript) Daten vom Server. GET sollte auch ausschließlich hierfür verwendet werden.
fetch('https://testapi.fabian-heinz-webdesign.de/simple-json-api/') .then(data => data.json()) .then(console.log);
Bei dem Code wird eine Request an https://testapi.fabian-heinz-webdesign.de/simple-json-api/ geschickt, die empfangenen Daten werden zu JSON transformiert und dann über console.log ausgegeben.
Du kannst den API-Link gerne anklicken, dann siehst du was genau der Fetch von der API empfängt.
In diesem Fall wird ein Array zurückgeliefert, das einzelne Objekte enthält:
[ {"name":"Test1", "id": 1}, {"name":"Test2", "id": 2}, {"name":"Test3", "id": 3}, {"name":"Test4", "id": 4}, {"name":"Test5", "id": 5} ]
Ein anderer GET kann z.B. auch auf https://testapi.fabian-heinz-webdesign.de/simple-text-api/ abgesetzt werden, dort wird dann mit Texten gearbeitet.
GET kann allerdings auch einfachen Text, HTML, XML oder sonst alles mögliche zurückgeben.
POST
POST sendet ein einzelnes Objekt an den Server, welcher das Objekt weiter verarbeitet.
Hierzur benötigen wir ein Objekt, in diesem Fall in JSON, welches wir an den Server senden können:
var data = { id: 6, name: "Test6" } fetch("https://testapi.fabian-heinz-webdesign.de/simple-json-api/", { method: "POST", body: JSON.stringify(data) }) .then(data => data.json()) .then(console.log);
Hier wird dann ein POST an https://testapi.fabian-heinz-webdesign.de/simple-json-api/ gesendet und über den Parameter „body“ die Daten aus der Variable „data“ in einen String gecastet und übergeben.
Diesen Anfrage kannst du im Browser leider nicht durch anklicken feststellen, da ein normaler Aufruf nur GET unterstützt.
Wenn du die Anfrage dennoch testen möchtest, kannst du Postman installieren und dort eine POST-Anfrage absetzen.
Dort können dann, genauso wie bei GET, entsprechend Daten zur Weiterverarbeitung zurückgegeben werden, weshalb wir auch hier wieder die .then-Methoden ausführen.
DELETE
DELETE löscht, wie der Name schon sagt, das mitgesendete Objekt.
fetch("https://testapi.fabian-heinz-webdesign.de/simple-json-api/6", { method: "DELETE" }) .then(data => data.json()) .then(console.log);
Beim DELETE wird in der URL die ID des zu löschenden Objekts übergeben. Sofern dieses Objekt existiert, wird es dann gelöscht.
Theoretisch können auch hier wieder Daten zurück geliefert werden.
Allgemeine Hinweise
Arbeiten mit eindeutigen Identifikationen
Generell sollte man immer mit IDs arbeiten (z.B. für die Primärschlüssel in einer Datenbank), um ganz eindeutig Werte zuweisen zu können.
Fehlerbehandlung
Bei jeder Anfrage an externe Server können auch Fehler erzeugt werden. Hierbei muss man unterscheiden zwischen gewollten Fehlern und zwischen ungewollten Fehlern.
Gewollte Fehler werden von der API ausgelöst, z.B. 404 (Not found) oder auch 500 (Internal Error). Diese Fehler kannst du in .then() prüfen und entsprechend behandeln.
Ungewollte Fehler allerdings müsstest du mit der .catch()-Methode ausführen und dort entsprechend behandeln. Diese werden dann beispielsweise ausgeführt wenn ein CORS-Fehler auftritt oder die URL nicht im DNS auflöst.
Eine Auflistung aller StatusCodes bekommst du ebenfalls in der Liste von MDN.
Aktualisierung der Anzeige
Nachdem ein DELETE, PUT oder POST durchgeführt wurde, empfiehlt es sich die angezeigten Daten erneut über einen GET zu laden, damit dort auch der aktuelle Stand angezeigt wird.
Dazu ist es sinnvoll die GET-Anfrage und deren weitere Verarbeitung in eine Funktion zu verpacken, die dann einfach im .then()-Bereich der DELETE, PUT oder POST-Anfrage aufgerufen wird.
Weitere Beiträge dieser Kategorie
Schreibe einen Kommentar