HTTP GET und POST Anforderungen mit Javascript und Axios
Axios ist eine JavaScript-Bibliothek, die zum Senden und Empfangen von Daten von einem Webserver verwendet wird. Wie http GET- und POST-Anforderungen.
di Antonio Lamorgese
Axios ist eine JavaScript-Bibliothek zum Erstellen von HTTP, GET und POST Anforderungen, die zum Senden und Empfangen von Daten von einem Server verwendet wird, der Webdienst-APIs bereitstellt. Axios unterstützt eine Vielzahl von Funktionen wie asynchrone HTTP-Anforderungen, Abfangen von Anforderungen und Antworten, Fehlerbehandlung, automatische Datenserialisierung und mehr. Axios ist wegen seiner Benutzerfreundlichkeit und Vielseitigkeit sehr beliebt. Eine seiner Stärken ist die Fähigkeit, synchrone und asynchrone Anfragen zu senden.
Inhaltsverzeichnis ...
Warum Axios anstelle von jQuery oder fetch verwenden
Es gibt mehrere Gründe, warum Axios gegenüber anderen nativen Bibliotheken oder APIs wie jQuery oder Fetch bevorzugt werden könnte:
a) Benutzerfreundlichkeit: Axios ist so konzipiert, dass es einfach und intuitiv zu verwenden ist, was es zu einer guten Wahl für diejenigen macht, die nach einer einfachen Möglichkeit suchen, HTTP-Anforderungen zu stellen.
b) Kompatibilität mit modernen Technologien: Axios wurde entwickelt, um mit modernen Technologien wie React und Angular zu arbeiten, was es zu einer guten Wahl für Projekte macht, die auf diesen Technologien basieren.
c) Unterstützung für asynchrone Anfragen: Axios unterstützt asynchrone Anfragen, was bedeutet, dass Sie mehrere Anfragen gleichzeitig stellen und die Antwort verarbeiten können, sobald sie verfügbar sind.
d) Abfangen von Anfragen: Mit Axios können Sie Anfragen und Antworten einfach abfangen und verwalten, was für die Verwaltung von Authentifizierungstoken oder das Hinzufügen benutzerdefinierter Header zu jeder Anfrage nützlich ist.
e) Unterstützung der Datenserialisierung: Mit Axios können Sie die in einer Anfrage gesendeten Daten automatisch serialisieren, was das Senden komplexer Daten viel einfacher macht.
Zusammenfassend bietet Axios eine Reihe fortschrittlicher Funktionen, die es zu einer guten Wahl für Projekte machen, die eine leistungsstarke und flexible Lösung für HTTP-Anforderungen erfordern.
Wie man Axios in eine Webseite einbindet
Bevor Sie Axios verwenden, müssen Sie die Bibliothek entweder auf ihrer Website oder im offiziellen Repository auf GitHub herunterladen. Anschließend können Sie die Bibliothek direkt in Ihre Webseite einbinden.
Um Axios in eine HTML-Datei einzufügen, können Sie dies auf verschiedene Arten tun, einschließlich:
a) Verwenden Sie ein CDN: Sie können Axios über ein Content Delivery Network (CDN) wie JSDelivr einbinden. So binden Sie Axios über JSDelivr ein:
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
b) Laden Sie die Datei lokal herunter: Sie können die Axios -Datei von der offiziellen Website herunterladen und sie dann als lokale Datei in Ihr Projekt einfügen. So binden Sie Axios als lokale Datei ein:
<script src="your_web_path/axios.min.js"></script>
Nachdem Sie Axios eingebunden haben, können Sie die Bibliothek wie in den vorherigen Beispielen beschrieben verwenden. Stellen Sie sicher, dass Sie Axios vor jedem Code einfügen, der es verwendet.
Axios auf Wetterdaten zu
OpenWeatherMap.org ist ein Webdienst, der weltweit aktuelle Wetterinformationen und Wettervorhersagen bereitstellt. Benutzer können über eine API auf Klimadaten wie Temperatur, Windgeschwindigkeit, Windrichtung, Luftfeuchtigkeit, Luftdruck und aktuelle Wetterbedingungen zugreifen, die sie in andere Anwendungen oder Websites integrieren können. Der Dienst ist für eine begrenzte Nutzung kostenlos und für eine professionellere und umfassendere Nutzung seiner API kostenpflichtig.
Beachten Sie, dass Sie in diesem Beispiel die Zeichenfolge „YOUR_APP_ID“ durch einen gültigen API-Schlüssel ersetzen müssen. Um Ihren API-Schlüssel zu erhalten, können Sie sich für den Dienst registrieren, indem Sie auf diesen Link klicken . Außerdem erfordert die OpenWeatherMap – API, dass Sie die Nutzungsbedingungen akzeptieren, bevor Sie den API-Schlüssel selbst verwenden.
Hier ein Beispiel, wie Sie mit Axios auf die Wetterdaten des Dienstes „ OpenWeatherMap.org “ zugreifen können:
// Define the OpenWeatherMap API URL
const API_URL = 'https://api.openweathermap.org/data/2.5/weather?q=Rome,Italy&appid=YOUR_APP_ID';
<script>
// Make a GET request to the API
axios.get (API_URL)
.then (response => {
// Handle next
console.log( response.data );
})
.catch (error => {
// Handle error
console.error (error);
});
</script>In diesem Beispiel sendet Axios eine http GET-Anforderung an die URL, die in der Konstante API_URL angegeben ist. Wenn die Anfrage erfolgreich verarbeitet wird, werden die von der API zurückgegebenen Daten direkt in die Konsole Ihres Webbrowsers gedruckt. Andernfalls wird der Fehler behandelt, indem die Fehlermeldung auch auf der Konsole ausgegeben wird. Wenn Sie in jedem Fall die an Axios übergebene URL in die Adressleiste des Browsers eingeben, druckt der Browser die von OpenWeatherMap an ihn gesendete Antwort im JSON-Format. Die Antwort wird in etwa so aussehen:
Schlussfolgerungen
Zusammenfassend lässt sich sagen, dass Axios eine hochflexible und einfach zu verwendende JavaScript-Bibliothek ist, um HTTP GET- und POST-Anforderungen an eine API zu stellen. Es hat viele Vorteile gegenüber anderen Bibliotheken wie jQuery oder fetch, z. B. die Verarbeitung asynchroner Anforderungen und Antworten, die Verarbeitung abgebrochener Anforderungen, die Fehlerbehandlung und die Möglichkeit, Anforderungen im JSON-Format zu senden.
Axios wird von einer großen Community von Entwicklern unterstützt, die es weiterhin pflegen und verbessern. Dies macht Axios zu einer der zuverlässigsten und sichersten Optionen für die Verarbeitung von HTTP-Anfragen.
Zusammenfassend lässt sich sagen, dass Axios eine großartige Bibliothek ist, die für die Verarbeitung von HTTP-Anforderungen in einer Webanwendung in Betracht gezogen werden sollte. Mit seiner Flexibilität, Zuverlässigkeit und Leichtigkeit.
Weiterlesen: „ChatGPT in Aktion mit CURL von der Eingabeaufforderung aus„
