Share
Express ist ein beliebtes Node.js-Web-Framework. Neben seiner Funktionalität bietet es einen Wrapper für Routing. Der Express Router hilft bei der Erstellung von Routenhandlern. In diesem Lernprogramm erfahren Sie, wie Sie mit Express Router arbeiten.
Lass uns anfangen.
Erstellen Sie ein neues Verzeichnis für Ihre Anwendung. Führen Sie den Befehl aus, um npm in dem soeben erstellten Verzeichnis zu initialisieren.
npm init -y
Die einzige Abhängigkeit, die Sie benötigen, ist express, also fahren Sie fort und installieren Sie sie.
npm install --save express
Am Ende sollte Ihre package.json-Datei so aussehen.
# package.json "name": "express-router", "version": "1.0.0", "description": "", "main": "index.js", "scripts": "test" : "echo" Fehler: Kein Test angegeben \ "&& exit 1", "Schlüsselwörter": [], "author": "", "license": "ISC", "Abhängigkeiten": "express": " ^ 4.16.2 "
Erstellen Sie nun eine neue Datei mit dem Namen index.js, die Ihre Eingabedatei ist, wie in Ihrer angegeben package.json.
Für den Moment benötigen Sie nur eine Grundeinstellung wie diese:
Accentsconagua
# index.js const express = required ('express') const app = express () app.listen (3000, () => console.log ('Server läuft an Port 3000'))Beginnen Sie mit dem Erstellen einiger grundlegender Routen, wie ich es unten beschrieben habe.
# index.js… const router = express.Router () // 1 router.get ('/', (req, res) => // 2 res.send ('Dies ist die Homepage!')) .post ('/ contact', (req, res) => // 3 res.send ('Dies ist die Kontaktseite mit einer POST-Anforderung')) app.use ('/', router) // 4 … '/'. Wenn Sie keinen Pfad auf dieser Middleware bereitstellen, wird dieser für jede Anforderung an die App ausgeführt.Nehmen wir an, Sie hatten stattdessen den Code.
app.use ('/ user', Router)Dies wird allen folgenden Kriterien entsprechen: /Benutzerprofil, Benutzer / Profil / Bearbeiten, Benutzer / Dashboard / Artikel / Ansicht, und so weiter.
Im obigen Code haben Sie eine Routenmethode an eine Instanz von Express Router angehängt. Die Routenmethode wird von einer der HTTP-Methoden abgeleitet und wie Sie der Instanz des Express Routers zugeordnet.
Express unterstützt die folgenden Routingmethoden, die HTTP-Methoden entsprechen: erhalten, Post, stellen, Kopf, löschen, Optionen, Spur, Kopieren, sperren, mkcol, Bewegung, reinigen, Freischalten, Bericht, Bewegungsaktivität, Auschecken, verschmelzen, m-Suche, benachrichtigen, abonnieren, Abmelden, Patch, und Suche.
Es gibt eine Routing-Methode entsetzen() die von keiner HTTP-Methode abgeleitet ist. Diese Routing-Methode wird für Funktionen unter einem angegebenen Pfad für alle Anforderungsmethoden geladen.
Angenommen, Sie haben den folgenden Code in Ihrer Anwendung.
app.all ('/ books', (req, res) => res.send ('greift auf den Buchabschnitt zu'))Dies wird für Anforderungen an "/ books" ausgeführt, wenn Sie GET, POST, PUT oder eine andere HTTP-Anforderungsmethode verwenden.
Ein Routenpfad wird verwendet, um einen Endpunkt zu definieren, an dem Anforderungen gestellt werden können. Dies geschieht mit der Kombination einer Anforderungsmethode. In Express können Routenpfade Zeichenkettenmuster oder reguläre Ausdrücke sein.
Hier sind Beispiele, die Sie Ihrem hinzufügen können index.js Datei.
# index.js router.get ('/ about', (req, res) => res.send ('Dieser Routenpfad passt zu / about')) router.get ('/ profile.txt', ( req, res) => res.send ('Diese Route passt zu /profile.txt'))Lassen Sie uns einen Routenpfad mit String-Mustern sehen.
router.get ('/ ab + xy', (req, res) => // 1 res.send ('ab + xy')) router.get ('/ ab (xy)? z', (req , res) => // 2 res.send ('/ ab (xy)? z'))Diese werden verwendet, um Werte zu erfassen, die an einer bestimmten Position in der URL angegeben sind. Sie werden URL-Segmente genannt. Die erfassten Werte werden im bereitgestellt req.params Objekt, wobei der Name des im Pfad angegebenen Routenparameters als Schlüssel der Werte verwendet wird.
Hier ist ein Beispiel.
Wenn Sie einen ähnlichen Routenpfad in Ihrer Anwendung haben: / users /: userId / articles /:articleId
Die angeforderte URL sieht folgendermaßen aus: http: // localhost: 3000 / users / 19 / articles / 104
In den req.params steht Folgendes zur Verfügung: "userId": "19", "bookId": "104"
Erstellen Sie eine neue Route in Ihrer Anwendung, indem Sie den obigen Routenpfad verwenden.
router.get ('/ users /: userId / articles /: articleId', (req, res) => res.send (req.params))Starten Sie Ihren Server und rufen Sie den Browser auf http: // localhost: 3000 / users / 19 / articles / 104. Sie werden das sehen req.params Objekt in Ihrem Browser angezeigt.
Der Name der Routenparameter muss aus Wortzeichen bestehen ([A-Za-z0-9_]).
Lass uns weiter gehen!
Angenommen, Sie möchten einen Routenpfad aufrufen / Benutzer /: Name, Dabei wird der Name des Benutzers an die URL übergeben und die Anwendung zeigt den Namen zusammen mit einer Zeichenfolge an. Wie können Sie das erreichen??
Probiere es zuerst selbst aus.
So sollte die Route aussehen.
router.get ('/ users /: name', (req, res) => res.send ('Welcome, $ req.params.name!'))Wenn Sie http: // localhost: 3000 / users / vivian besuchen, sollten Sie sehen Herzlich willkommen, Vivian! im Browser angezeigt.
Sehen wir uns an, wie Sie eine Login-Route in Express erstellen. Für Ihre Login-Routen sind zwei Aktionen auf einem einzigen Routenpfad erforderlich. Die Aktionen werden nach der verwendeten Routenmethode unterschieden. So wird es aussehen.
router.get ('/ login', (req, res) => res.send ('sollte zum Anmeldeformular' führen)) router.post ('/ login', (req, res) => res.send ('wird bei der Verarbeitung des Formulars verwendet'))Danach sollte Ihr Geschäftsformular über eine Aktion verfügen, deren Wert die mit der HTTP-POST-Methode definierte Route ist. So sollte es aussehen.
Wenn auf die Schaltfläche zum Senden des Formulars geklickt wird, wird der angegebene Router aufgerufen. Der Unterschied zwischen beiden Routenpfaden, wie oben angegeben, ist der HTTP-POST. Auf diese Weise ermittelt die Anwendung, wer für die Verarbeitung der durch das Formular übergebenen Daten verantwortlich ist.
Ein weiterer Aspekt, bei dem dies möglich ist, betrifft das Bearbeiten und Aktualisieren von Ressourcen.
App.Route () kann verwendet werden, um eine Kette von Routenhandlern für einen bestimmten Routenpfad zu erstellen.
Am Beispiel der Anmeldungsroute können Sie wie folgt vorgehen App.Route ().
app.route ('/ login') .get ((res, req) => res.send ('Dies sollte zum Anmeldeformular führen')) .post ((res, req) => res. senden ("Dies wird bei der Verarbeitung des Formulars verwendet"))Sie können mehr Routen-Handler hinzufügen, als wir oben haben.
An diesem Punkt sollten Sie wissen, wie das Routing in Express funktioniert. Sie haben gelernt, wie Sie das grundlegende Routing einrichten und wie Sie mit Routenmethoden und Pfaden arbeiten. Sie haben gesehen, wie Sie Routenparameter verwenden und über die URL gesendete Werte abrufen.
Wenn Sie nach zusätzlichen JavaScript-Ressourcen suchen, um zu studieren oder in Ihrer Arbeit zu verwenden, schauen Sie sich an, was wir auf Envato Market zur Verfügung haben.
Mit diesem Wissen können Sie eine Express-Anwendung mit komplexem Routing erstellen.
