Articles

Definition von Routen und HTTP-Anforderungsmethoden in Express

Einführung

In diesem Artikel wird untersucht, wie Routen und HTTP-Anforderungsmethoden innerhalb eines Express-Projekts gehandhabt werden können. Routen steuern die Navigation des Benutzers zu verschiedenen URLs in Ihrer Anwendung. HTTP, kurz für Hyper Text Transfer Protocol, kommuniziert und erleichtert die Datenübertragung von Ihrem Express-Server zum Webbrowser.

Sie werden lernen, wie Sie Routen definieren und die HTTP-Anforderungsmethoden GETPOSTPUT und DELETE verwenden, um Daten zu manipulieren.

Voraussetzungen

Um dieses Tutorial zu absolvieren, ist ein Verständnis von Node.js hilfreich, aber nicht erforderlich. Wenn Sie mehr über Node.js erfahren möchten, lesen Sie die Serie How To Code in Node.js.

Einrichten des Projekts

Da Express ein Node.js-Framework ist, stellen Sie sicher, dass Sie Node.js von Node.js installiert haben, bevor Sie die nächsten Schritte ausführen. Führen Sie Folgendes in Ihrem Terminal aus:

Erstellen Sie ein neues Verzeichnis mit dem Namen node-express-routing für Ihr Projekt:

  • mkdir node-express-routing

Wechseln Sie in das neue Verzeichnis:

  • cd node-express-routing

Initialisieren Sie ein neues Node-Projekt mit Standardeinstellungen. Dieses wird Ihre package.json Datei enthalten, um auf Ihre Abhängigkeiten zuzugreifen:

  • npm init -y

Erstellen Sie Ihre Eingangsdatei, index.js. Hier werden Sie Ihre Routen und HTTP-Anforderungsmethoden verwalten:

  • touch index.js

Installieren Sie sowohl Express als auch nodemon als Abhängigkeiten. Sie werden nodemon verwenden, um Ihr Express-Projekt immer wieder neu zu starten, wenn sich die index.js-Datei ändert.

  • npm install express --save
  • npm install -D nodemon

Öffnen Sie Ihre package.json-Datei mit Ihrem bevorzugten Texteditor und aktualisieren Sie Ihr start-Skript, um nodemon und Ihre index.js-Datei einzuschließen:

Paket.json

Damit können Sie den Befehl npm start in Ihrem Terminal verwenden, um Ihren Express-Server zu starten und Änderungen zu aktualisieren.

Nachdem Sie Ihr Projekt eingerichtet und nodemon so konfiguriert haben, dass es aktualisiert wird, wenn es Änderungen in Ihrer index.js-Datei erkennt, sind Sie bereit, Ihren Express-Server zu starten.

Start Ihres Express-Servers

Ihr Express-Server ist der Ort, an dem Sie die Logik zur Integration Ihrer Routen und HTTP-Anforderungsmethoden verarbeiten werden. Sie werden Ihren Server einrichten und starten, um Ihr Projekt im Browser zu visualisieren.

Um Ihren Express-Server zu starten, benötigen Sie Express in Ihrer index.js-Datei und speichern eine Instanz in der app-Variable. Anschließend deklarieren Sie eine PORT-Variable und geben die Adresse :3000 an.

index.js

Als Nächstes hängen Sie .listen() an app und fügen PORT als erstes Argument ein, dann eine Callback-Funktion. Die Express-Middleware .listen() erzeugt aus der Adresse in Ihrer PORT-Variable einen lokalen Browser, um Ihre Änderungen zu visualisieren.

Fügen Sie außerdem express.json() als Argument für app.use() ein. Dies dient dazu, die eingehenden Daten über Ihre HTTP-Anfragen zu parsen. Eine frühere Version verließ sich auf die body-parser-Abhängigkeit, aber seitdem enthält Express eine eingebaute Middleware zum Parsen von Daten.

Rufen Sie den folgenden Befehl in Ihrem Terminal auf, um das Projekt zu starten:

  • npm start

Ihr Projekt wird auf geladen. Navigieren Sie zu Ihrem Browser, und beachten Sie Folgendes:

Dies ist der Anfang einer laufenden Express-Instanz. Lassen Sie uns daran arbeiten, HTTP-Methoden zu definieren, um den Browser zu befüllen.

Definieren der HTTP-GET-Anforderungsmethode

Um Ihr Projekt zu betrachten, können Sie Informationen von Ihrem Express-Server über eine GET-Anforderung, eine HTTP-Methode, senden.

In index.js hängen Sie .get() an Ihre app-Variable an, geben Sie eine anonyme Route an, und fügen Sie einen Callback ein, der auf die Argumente request und response zugreift:

index.js
 app.get('/', (request, response) => { response.send('Hello');});

Das Argument request enthält Informationen über die GET-Anfrage, während response.send() Daten an den Browser sendet. Die Daten innerhalb von response.send() können ein String, ein Objekt oder ein Array sein.

Nachdem Sie nun eine GET-Anfrage implementiert haben, lassen Sie uns einen Blick auf Routen und andere HTTP-Methoden werfen.

Verständnis von Routen

index.js

Wenn Sie zu navigieren, erhalten Sie alle Konten in Ihrem Array:

Output

Mit dem Endpunkt /:id können Sie auch die Konto-IDs filtern. Express betrachtet die ID im Endpunkt /:id als Platzhalter für einen Benutzerparameter und passt diesen Wert an.

Wenn Sie zu navigieren, erhalten Sie ein Konto, das dem Parameter /:id entspricht:

Output
{ "id": 3, "username": "sarahjane", "role": "guest"}

POST-, PUT- und DELETE-HTTP-Anforderungsmethoden entwerfen

Die POSTPUT– und DELETE-Anforderungsmethoden bieten zusätzliche Funktionalität für Ihre Daten. Die Anforderungsmethode POST erstellt neue Daten in Ihrem Server, während PUT bestehende Informationen aktualisiert. Die Abfragemethode DELETE entfernt die angegebenen Daten.

POST

Um neue Daten im accounts-Array anzulegen, können Sie eine POST-Anforderungsmethode integrieren.

In index.js hängen Sie .post() an Ihre app-Variable an und fügen die route'/accounts' als erstes Argument ein:

index.js

Sie schieben alle eingehenden Daten aus Ihrer POST-Anfrage in das accounts-Array und senden die Antwort als JSON-Objekt.

Ihr accounts-Array enthält nun einen neuen Benutzer:

PUT

Sie können ein bestimmtes Konto über eine PUT-Anfrage bearbeiten und aktualisieren.

In index.js hängen Sie .put() an Ihre app-Variable an und fügen die Route '/accounts/:id' als erstes Argument ein. Sie finden die eingegebene Konto-ID und setzen ein Conditional, um die neuen Daten zu aktualisieren:

index.js

Sie sind nun in der Lage, die Daten im Array accounts zu aktualisieren. Wenn ein Benutzer sein "role" ändert:

{ "role": "guest"}

Beachten Sie, dass "role" von admin auf guest aktualisiert wird. in

Output
{ "id": 1, "username": "paulhal", "role": "guest"}

DELETE

Mit der Anforderungsmethode DELETE können Sie Benutzer und Daten löschen.

Innerhalb von index.js hängen Sie .delete() an Ihre app-Variable an und schließen '/accounts/:id' als erstes Argument ein. Sie filtern durch das accounts-Array und geben das zu löschende Konto zurück.

index.js

Wenn Sie eine DELETE-Anfrage an senden, wird dies das Konto mit dem /:id von 1 aus dem accounts-Array entfernen.

Fazit

Das Spezifizieren von Routen und die Verwendung von HTTP-Anforderungsmethoden helfen, zusätzliche Performance beim Anlegen, Aktualisieren und Löschen von Benutzern und Daten in Ihrem Express-Server zu generieren.

Eine Antwort schreiben

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.