Umzug nach Express 4

Express 4 ist ein brillanter Wechsel von Express 3. Das bedeutet, dass eine bestehende Express 3-App nicht funktioniert, wenn Sie die Express-Version in ihren Abhängigkeiten aktualisieren.

Dieser Artikel Covers:

• Änderungen in Express 4.

• Ein Beispiel für die Migration einer Express 3 App auf Express 4.

• Upgrade auf den Express 4 App-Generator.

Änderungen in Express 4

Es gibt mehrere bedeutende Änderungen in Express 4:

• Änderungen des Express-Core- und Middleware-Systems. Die Abhängigkeiten von Connect und eingebauter Middleware wurden entfernt, daher müssen Sie selbst Middleware hinzufügen.

• Änderungen am Routingsystem.
• Verschiedene andere Änderungen.

Siehe auch:

• Neue Features in 4.x.
• Migration von 3.x auf 4.x.

Änderungen am Express-Kern- und Middleware-System

Express 4 hängt nicht mehr von Verbindung ab und entfernt alle eingebauten Middleware aus seinem Kern, mit Ausnahme der express.static Funktion. Das bedeutet, dass Express jetzt ein unabhängiges Routing- und Middleware-Web-Framework ist und Express-Versionierung und Releases sind nicht von Middleware-Updates betroffen.

Ohne integrierte Middleware müssen Sie explizit alle Middleware hinzufügen, die für den Betrieb Ihrer App erforderlich ist. Folgen Sie einfach diesen Schritten:

1. Modul installieren: npm install --save \<module-name>
2. Benötige in deiner App das Modul: require('module-name')
3. Verwenden Sie das Modul entsprechend seiner Dokumentation: app.use( ... )

Die folgende Tabelle listet Express 3 Middleware und ihre Amtskollegen in Express 4 auf.

Hier ist die vollständige Liste von Express 4 Middleware.

In den meisten Fällen können Sie einfach die alte Version 3 Middleware durch dessen Express 4 Gegenstück ersetzen. Details hierzu finden Sie in der Moduldokumentation in GitHub.

app.use akzeptiert Parameter

In Version 4 können Sie mit einem Variablen-Parameter den Pfad definieren, in dem Middleware-Funktionen geladen werden, dann den Wert des Parameters aus dem Route-Handler lesen. Zum Beispiel:

app.use('/book/:id', (req, res, next) => {
  console.log('ID:', req.params.id);
  next();
});

Das Routingsystem

Apps laden nun implizit Routing Middleware damit Sie sich keine Sorgen mehr darüber machen müssen, in welcher Reihenfolge Middleware in Bezug auf der router Middleware geladen wird.

Die Art und Weise, wie Sie Routen definieren, ist unverändert, aber das Routensystem hat zwei neue Funktionen, um Ihre Routen zu organisieren:

• Eine neue Methode, app.route(), um verkettete Routenhandler für einen Routenpfad zu erstellen.
• Eine neue Klasse, express.Router, um modulare montierbare Routenhandler zu erstellen.

app.route() Methode

Die neue Methode app.route() ermöglicht es dir, verkettete Routenhandler für einen Routenpfad zu erstellen. Da der Weg an einem einzigen Ort angegeben ist, ist die Schaffung modularer Routen hilfreich, ebenso wie die Reduzierung von Redundanz und Typos. Weitere Informationen über Routen finden Sie unter Router() Dokumentation.

Hier ist ein Beispiel für verkettete Routenhandler, die durch die Funktion app.route() definiert werden.

app
  .route('/book')
  .get((req, res) => {
    res.send('Get a random book');
  })
  .post((req, res) => {
    res.send('Add a book');
  })
  .put((req, res) => {
    res.send('Update the book');
  });

express.Router Klasse

Die andere Funktion, die hilft, Routen zu organisieren, ist eine neue Klasse, express.Router, die Sie verwenden können, um modulare montierbare Routenhandler zu erstellen. Eine Router-Instanz ist ein komplettes Middleware- und -Routing-System. Aus diesem Grund wird sie oft als “Mini-App” bezeichnet.

Das folgende Beispiel erzeugt einen Router als Modul, lädt Middleware in , definiert einige Routen und mountet sie auf einem Pfad in der Hauptanwendung.

Erstelle zum Beispiel eine Router-Datei namens birds.js im App-Verzeichnis, mit folgendem Inhalt:

var express = require('express');
var router = express.Router();

// middleware specific to this router
router.use((req, res, next) => {
  console.log('Time: ', Date.now());
  next();
});
// define the home page route
router.get('/', (req, res) => {
  res.send('Birds home page');
});
// define the about route
router.get('/about', (req, res) => {
  res.send('About birds');
});

module.exports = router;

Laden Sie dann das Router-Modul in der App:

var birds = require('./birds');

// ...

app.use('/birds', birds);

Die App wird nun in der Lage sein, Anfragen an die /birds und /birds/about Pfade zu bearbeiten, und ruft die “timeLog” Middleware auf, die spezifisch für die Route ist.

Andere Änderungen

Die folgende Tabelle listet weitere kleine, aber wichtige Änderungen in Express 4 auf:

Beispiel-App-Migration

Hier ist ein Beispiel für die Migration einer Express-3-Anwendung auf Express 4. Die Dateien von Interesse sind app.js und package.json.

Version 3 App

app.js

Betrachten Sie eine Express v.3 Anwendung mit der folgenden app.js Datei:

var express = require('express');
var routes = require('./routes');
var user = require('./routes/user');
var http = require('http');
var path = require('path');

var app = express();

// all environments
app.set('port', process.env.PORT || 3000);
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.methodOverride());
app.use(express.session({ secret: 'your secret here' }));
app.use(express.bodyParser());
app.use(app.router);
app.use(express.static(path.join(__dirname, 'public')));

// development only
if (app.get('env') === 'development') {
  app.use(express.errorHandler());
}

app.get('/', routes.index);
app.get('/users', user.list);

http.createServer(app).listen(app.get('port'), () => {
  console.log('Express server listening on port ' + app.get('port'));
});

“package.json”

The accompanying version 3 package.json file might look something like this:

{
  "name": "application-name",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node app.js"
  },
  "dependencies": {
    "express": "3.12.0",
    "pug": "*"
  }
}

Verarbeiten

Beginnen Sie den Migrationsprozess, indem Sie die benötigte Middleware für die Express 4 App installieren und Express und Pug mit folgendem Befehl auf ihre jeweils neueste Version aktualisieren:

$ npm install serve-favicon morgan method-override express-session body-parser multer errorhandler express@latest pug@latest --save

Folgende Änderungen an app.js vornehmen:

1. Die integrierten Express-Middleware-Funktionen express.favicon, express.logger, express.methodOverride, express.session, express.bodyParser und express.errorHandler sind nicht mehr verfügbar auf dem express Objekt. Sie müssen ihre Alternativen manuell installieren und in der App laden.

2. Du musst die app.router Funktion nicht mehr laden. Es ist kein gültiges Express 4 App-Objekt, also entferne den app.use(app.router); Code.

3. Stellen Sie sicher, dass die Middleware-Funktionen in der richtigen Reihenfolge geladen werden - laden Sie errorHandler nach dem Laden der App-Routen.

Version 4 App

”package.json”

Das Ausführen des obigen npm Befehls wird package.json wie folgt aktualisieren:

{
  "name": "application-name",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node app.js"
  },
  "dependencies": {
    "body-parser": "^1.5.2",
    "errorhandler": "^1.1.1",
    "express": "^4.8.0",
    "express-session": "^1.7.2",
    "pug": "^2.0.0",
    "method-override": "^2.1.2",
    "morgan": "^1.2.2",
    "multer": "^0.1.3",
    "serve-favicon": "^2.0.1"
  }
}

app.js

Entferne dann ungültigen Code, lade die benötigte Middleware und führe bei Bedarf andere Änderungen durch. Die app.js Datei wird folgendermaßen aussehen:

var http = require('http');
var express = require('express');
var routes = require('./routes');
var user = require('./routes/user');
var path = require('path');

var favicon = require('serve-favicon');
var logger = require('morgan');
var methodOverride = require('method-override');
var session = require('express-session');
var bodyParser = require('body-parser');
var multer = require('multer');
var errorHandler = require('errorhandler');

var app = express();

// all environments
app.set('port', process.env.PORT || 3000);
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');
app.use(favicon(path.join(__dirname, '/public/favicon.ico')));
app.use(logger('dev'));
app.use(methodOverride());
app.use(
  session({
    resave: true,
    saveUninitialized: true,
    secret: 'uwotm8',
  })
);
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
app.use(multer());
app.use(express.static(path.join(__dirname, 'public')));

app.get('/', routes.index);
app.get('/users', user.list);

// error handling middleware should be loaded after the loading the routes
if (app.get('env') === 'development') {
  app.use(errorHandler());
}

var server = http.createServer(app);
server.listen(app.get('port'), () => {
  console.log('Express server listening on port ' + app.get('port'));
});

app.listen(app.get('port'), () => {
  console.log('Express server listening on port ' + app.get('port'));
});

App ausführen

Der Migrationsprozess ist abgeschlossen und die App ist nun eine Express 4 App. Um die App zu bestätigen, starten Sie die App mit dem folgenden Befehl:

$ node .

Laden Sie http://localhost:3000 und sehen Sie die Startseite von Express 4 an.

Upgrade auf den Express 4 App-Generator

Das Kommandozeilen-Werkzeug, um eine Express-App zu generieren, ist immer noch Express, aber um auf die neue Version zu aktualisieren Sie müssen den Express 3 App-Generator deinstallieren und dann den neuen express-generator installieren.

Installiere

Wenn Sie bereits den Express 3 App-Generator auf Ihrem System installiert haben, müssen Sie ihn deinstallieren:

$ npm uninstall -g express

Depending on how your file and directory privileges are configured, you might need to run this command with sudo.

Jetzt den neuen Generator installieren:

$ npm install -g express-generator

Depending on how your file and directory privileges are configured, you might need to run this command with sudo.

Jetzt wird der Befehl Express auf Ihrem System auf den Express 4 Generator aktualisiert.

Änderungen am App-Generator

Befehlsoptionen und -verwendung bleiben weitgehend gleich, mit den folgenden Ausnahmen:

• Die Option --sessions wurde entfernt.
• Die --jshtml Option wurde entfernt.
• --hogan Option hinzugefügt, um [Hogan.js]zu unterstützen (http://twitter.github.io/hogan.js/).

Beispiel

Führen Sie den folgenden Befehl aus, um eine Express 4 App zu erstellen:

$ express app4

Wenn du dir den Inhalt der app4/app.js Datei anschaust, wirst du bemerken, dass alle Middleware-Funktionen (außer express. tatic), die für benötigt werden, wird die App als unabhängige Module geladen, und die router Middleware nicht mehr explizit in der App geladen wird.

Du wirst auch bemerken, dass die app.js Datei jetzt ein Knoten ist. s Modul im Gegensatz zu der Standalone-App, die vom alten Generator erzeugt wurde.

Nach der Installation der Abhängigkeiten starten Sie die App mit dem folgenden Befehl:

$ npm start

Wenn du das npm start-Skript im package betrachtest. son-Datei, wirst du bemerken, dass der eigentliche Befehl, der die App startet, node ist. bin/www, die zuvor node app.js` in Express 3 war.

Because the app.js file that was generated by the Express 4 generator is now a Node.js module, it can no longer be started independently as an app (unless you modify the code). Das Modul muss in einer Node.js-Datei geladen und über die Node.js-Datei gestartet werden. Die Node.js Datei ist in diesem Fall ./bin/www .

Weder das bin Verzeichnis noch die erweiterungslose www Datei ist zwingend erforderlich, um eine Express-App zu erstellen oder die App zu starten. They are just suggestions made by the generator, so feel free to modify them to suit your needs.

Um das www-Verzeichnis loszuwerden und die Dinge auf die “Express 3 Wege” zu halten, lösche die Zeile, die module. xports = app; am Ende der app.js Datei einfügen und den folgenden Code dort einfügen:

app.set('port', process.env.PORT || 3000);

var server = app.listen(app.get('port'), () => {
  debug('Express server listening on port ' + server.address().port);
});

Stelle sicher, dass du das debug Modul oben in der app.js Datei unter Verwendung des folgenden Codes lädst:

var debug = require('debug')('app4');

Als nächstes ändere "start": "node ./bin/www" in der Datei package.json zu "start": "node app.js".

Du hast nun die Funktionalität von ./bin/www zurück auf app.js verschoben. Diese Änderung wird nicht empfohlen, aber die Übung hilft dir zu verstehen, wie das . bin/www Datei funktioniert und warum die app.js Datei nicht mehr alleine startet.