In diesem Tutorial werden wir das Express-Framework untersuchen. Dieses Framework ist so aufgebaut, dass es als minimales und flexibles Node.js-Webanwendungsframework fungiert und eine Reihe robuster Funktionen zum Erstellen von ein- und mehrseitigen sowie hybriden Webanwendungen bietet.
In diesem Tutorial lernen Sie:
- Was ist Express.js?
- Express installieren und verwenden
- Was sind Routen?
- Beispiel für einen Webserver mit express.js
Was ist Express.js?
Express.js ist ein Node js-Webanwendungsserver-Framework, das speziell für die Erstellung von einseitigen, mehrseitigen und hybriden Webanwendungen entwickelt wurde.
Es ist zum Standard-Server-Framework für node.js geworden. Express ist der Backend-Teil des sogenannten MEAN-Stacks.
Die MEAN ist ein kostenloser Open-Source-JavaScript-Software-Stack zum Erstellen dynamischer Websites und Webanwendungen mit den folgenden Komponenten.
1) MongoDB - Die Standard-NoSQL-Datenbank
2) Express.js - Das Standard-Webanwendungsframework
3) Angular.js - Das für Webanwendungen verwendete JavaScript MVC-Framework
4) Node.js - Framework für skalierbare serverseitige und Netzwerkanwendungen.
Das Express.js-Framework macht es sehr einfach, eine Anwendung zu entwickeln, mit der mehrere Arten von Anforderungen wie GET-, PUT-, POST- und DELETE-Anforderungen verarbeitet werden können.
Express installieren und verwenden
Express wird über den Node Package Manager installiert. Dies kann durch Ausführen der folgenden Zeile in der Befehlszeile erfolgen
npm install express
Der obige Befehl fordert den Node Package Manager auf, die erforderlichen Express-Module herunterzuladen und entsprechend zu installieren.
Verwenden wir unser neu installiertes Express-Framework und erstellen eine einfache "Hello World" -Anwendung.
Unsere Anwendung wird ein einfaches Servermodul erstellen, das die Portnummer 3000 überwacht. In unserem Beispiel sendet die Serveranwendung eine Antwort "Hallo" Welt an den Client, wenn über den Browser eine Anforderung für diese Portnummer erfolgt .
var express=require('express');var app=express();app.get('/',function(req,res){res.send('Hello World!');});var server=app.listen(3000,function() {});
Code Erläuterung:
- In unserer ersten Codezeile verwenden wir die Funktion require, um das "Express-Modul" einzuschließen.
- Bevor wir das Express-Modul verwenden können, müssen wir ein Objekt daraus erstellen.
- Hier erstellen wir eine Rückruffunktion. Diese Funktion wird immer dann aufgerufen, wenn jemand zum Stammverzeichnis unserer Webanwendung navigiert, nämlich http: // localhost: 3000 . Die Rückruffunktion wird verwendet, um die Zeichenfolge 'Hello World' an die Webseite zu senden.
- In der Rückruffunktion senden wir den String "Hello World" zurück an den Client. Der Parameter 'res' wird verwendet, um Inhalte an die Webseite zurückzusenden. Dieser 'res'-Parameter wird vom' request'-Modul bereitgestellt, damit Inhalte an die Webseite zurückgesendet werden können.
- Wir verwenden dann die Funktion listen to, um unsere Serveranwendung dazu zu bringen, Clientanforderungen an Port Nr. 3000 abzuhören. Hier können Sie einen beliebigen verfügbaren Port angeben.
Wenn der Befehl erfolgreich ausgeführt wird, wird die folgende Ausgabe angezeigt, wenn Sie Ihren Code im Browser ausführen.
Ausgabe:
Aus der Ausgabe,
- Sie können deutlich sehen, dass beim Navigieren zur URL von localhost auf Port 3000 die Zeichenfolge 'Hello World' auf der Seite angezeigt wird.
- Da wir in unserem Code speziell erwähnt haben, dass der Server Port Nr. 3000 abhört, können wir die Ausgabe anzeigen, wenn wir zu dieser URL navigieren.
Was sind Routen?
Das Routing bestimmt, wie eine Anwendung auf eine Clientanforderung an einen bestimmten Endpunkt reagiert.
Beispielsweise kann ein Client eine GET-, POST-, PUT- oder DELETE-http-Anforderung für verschiedene URLs wie die unten gezeigten stellen.
http://localhost:3000/Bookshttp://localhost:3000/Students
Im obigen Beispiel ist
- Wenn eine GET-Anfrage für die erste URL gestellt wird, sollte die Antwort idealerweise eine Liste von Büchern sein.
- Wenn die GET-Anfrage für die zweite URL gestellt wird, sollte die Antwort idealerweise eine Liste von Studenten sein.
- Basierend auf der URL, auf die zugegriffen wird, wird eine andere Funktionalität auf dem Webserver aufgerufen, und dementsprechend wird die Antwort an den Client gesendet. Dies ist das Konzept des Routings.
Jede Route kann eine oder mehrere Handlerfunktionen haben, die ausgeführt werden, wenn die Route übereinstimmt.
Die allgemeine Syntax für eine Route ist unten dargestellt
app.METHOD(PATH, HANDLER)
Worin,
1) App ist eine Instanz des Express-Moduls
2) METHODE ist eine HTTP-Anforderungsmethode (GET, POST, PUT oder DELETE)
3) PATH ist ein Pfad auf dem Server.
4) HANDLER ist die Funktion, die ausgeführt wird, wenn die Route übereinstimmt.
Schauen wir uns ein Beispiel an, wie wir Routen im Express implementieren können. In unserem Beispiel werden 3 Routen als erstellt
- A / Node-Route, auf der die Zeichenfolge "Tutorial on Node" angezeigt wird, wenn auf diese Route zugegriffen wird
- A / Angular-Route, bei der die Zeichenfolge "Tutorial on Angular" angezeigt wird, wenn auf diese Route zugegriffen wird
- Eine Standardroute, die die Zeichenfolge "Willkommen bei Guru99-Tutorials" anzeigt.
Unser Basiscode bleibt derselbe wie in den vorherigen Beispielen. Das folgende Snippet ist ein Add-On, das zeigt, wie das Routing implementiert ist.
var express = require('express');var app = express();app.route('/Node').get(function(req,res){res.send("Tutorial on Node");});app.route('/Angular').get(function(req,res){res.send("Tutorial on Angular");});app.get('/',function(req,res){res.send('Welcome to Guru99 Tutorials');}));
Code Erläuterung:
- Hier definieren wir eine Route, wenn im Browser die URL http: // localhost: 3000 / Node ausgewählt ist. Der Route fügen wir eine Rückruffunktion hinzu, die aufgerufen wird, wenn wir zur Knoten-URL navigieren.
Die Funktion hat 2 Parameter.
- Der Hauptparameter, den wir verwenden werden, ist der Parameter 'res', mit dem Informationen an den Client zurückgesendet werden können.
- Der Parameter 'req' enthält Informationen zu der gestellten Anforderung. Manchmal können zusätzliche Parameter als Teil der gestellten Anforderung gesendet werden, und daher kann der Parameter 'req' verwendet werden, um die zusätzlichen gesendeten Parameter zu finden.
- Wir verwenden die Sendefunktion, um die Zeichenfolge "Tutorial on Node" an den Client zurückzusenden, wenn die Knotenroute ausgewählt ist.
- Hier definieren wir eine Route, wenn im Browser die URL http: // localhost: 3000 / Angular ausgewählt ist. Der Route fügen wir eine Rückruffunktion hinzu, die aufgerufen wird, wenn wir zur Angular-URL navigieren.
- Wir verwenden die Sendefunktion, um die Zeichenfolge "Tutorial on Angular" an den Client zurückzusenden, wenn die Angular-Route ausgewählt ist.
- Dies ist die Standardroute, die ausgewählt wird, wenn zur Route der Anwendung navigiert wird - http: // localhost: 3000 . Wenn die Standardroute ausgewählt ist, wird die Nachricht "Willkommen bei Guru99-Tutorials" an den Client gesendet.
Wenn der Befehl erfolgreich ausgeführt wird, wird die folgende Ausgabe angezeigt, wenn Sie Ihren Code im Browser ausführen.
Ausgabe:
Aus der Ausgabe,
- Sie können deutlich sehen, dass beim Navigieren zur URL von localhost auf Port 3000 die Zeichenfolge "Willkommen bei Guru99-Tutorials" auf der Seite angezeigt wird.
- Weil wir in unserem Code erwähnt haben, dass unsere Standard-URL diese Nachricht anzeigen würde.
Aus der Ausgabe,
- Sie können sehen, dass, wenn die URL in / Node geändert wurde, die entsprechende Knotenroute ausgewählt und die Zeichenfolge "Tutorial On Node" angezeigt wird.
Aus der Ausgabe,
- Sie können sehen, dass, wenn die URL in / Angular geändert wurde, die entsprechende Knotenroute ausgewählt wird und die Zeichenfolge "Tutorial On Angular" angezeigt wird.
Beispiel für einen Webserver mit express.js
In unserem obigen Beispiel haben wir gesehen, wie wir basierend auf dem Routing entscheiden können, welche Ausgabe angezeigt werden soll. Diese Art von Routing wird in den meisten modernen Webanwendungen verwendet. Der andere Teil eines Webservers befasst sich mit der Verwendung von Vorlagen in Node js.
Wenn Sie schnelle On-the-Fly-Knotenanwendungen erstellen, können Sie auf einfache und schnelle Weise Vorlagen für die Anwendung verwenden. Auf dem Markt sind viele Frameworks für die Erstellung von Vorlagen verfügbar. In unserem Fall nehmen wir das Beispiel des Jade-Frameworks für das Templating.
Jade wird über den Node Package Manager installiert. Dies kann durch Ausführen der folgenden Zeile in der Befehlszeile erfolgen
npm Jade installieren
Der obige Befehl fordert den Node-Paketmanager auf, die erforderlichen Jademodule herunterzuladen und entsprechend zu installieren.
HINWEIS: In der neuesten Version von Node ist Jade veraltet. Verwenden Sie stattdessen Mops.
Verwenden wir unser neu installiertes Jade-Framework und erstellen einige grundlegende Vorlagen.
Schritt 1) Der erste Schritt besteht darin, eine Jadevorlage zu erstellen. Erstellen Sie eine Datei mit dem Namen index.jade und fügen Sie den folgenden Code ein. Stellen Sie sicher, dass die Datei im Ordner "Ansichten" erstellt wird
- Hier geben wir an, dass der Titel der Seite in den Wert geändert wird, der beim Aufrufen dieser Vorlage übergeben wird.
- Wir geben auch an, dass der Text im Header-Tag durch den Text ersetzt wird, der in der Jade-Vorlage übergeben wird.
var express=require('express');var app=express();app.set('view engine','jade');app.get('/',function(req,res){res.render('index',{title:'Guru99',message:'Welcome'})});var server=app.listen(3000,function() {});
Code Erläuterung:
- Das erste, was in der Anwendung angegeben werden muss, ist die "Ansichts-Engine", die zum Rendern der Vorlagen verwendet wird. Da wir zum Rendern unserer Vorlagen Jade verwenden, geben wir dies entsprechend an.
- Die Renderfunktion wird zum Rendern einer Webseite verwendet. In unserem Beispiel rendern wir die zuvor erstellte Vorlage (index.jade).
- Wir übergeben die Werte "Guru99" und "Willkommen" an die Parameter "Titel" bzw. "Nachricht". Diese Werte werden durch die in der Vorlage index.jade deklarierten Parameter 'title' und 'message' ersetzt.
Wenn der Befehl erfolgreich ausgeführt wird, wird die folgende Ausgabe angezeigt, wenn Sie Ihren Code im Browser ausführen.
Ausgabe:
Aus der Ausgabe,
- Wir können sehen, dass der Titel der Seite auf "Guru99" und der Header der Seite auf "Willkommen" gesetzt wird.
- Dies liegt an der Jade-Vorlage, die in unserer Knoten-js-Anwendung aufgerufen wird.
Zusammenfassung
- Das Express-Framework ist das am häufigsten verwendete Framework für die Entwicklung von Node js-Anwendungen. Das Express-Framework basiert auf dem node.js-Framework und hilft bei der schnellen Entwicklung serverbasierter Anwendungen.
- Routen werden verwendet, um Benutzer basierend auf der gestellten Anforderung zu verschiedenen Teilen der Webanwendungen umzuleiten. Die Antwort für jede Route kann variiert werden, je nachdem, was dem Benutzer angezeigt werden muss.
- Vorlagen können verwendet werden, um Inhalte auf effiziente Weise einzufügen. Jade ist eine der beliebtesten Template-Engines, die in Node.js-Anwendungen verwendet werden.