Teilen Sie ein Beispiel-Tutorial zum Erstellen eines Vue-Cli-Projekts.

Backend-Mock wird in „Hinzufügen einer Backend-Mock-Schnittstelle zu einem von Vue-cli erstellten Projekt“ implementiert, aber die t-Daten des Front-End-Beitrags müssen in der Back-End-Schnittstelle des Mocks verwendet werden, um die Daten zu erhalten im http-Protokollkörper mithilfe des Empfangsdatenereignisses von req.

req.on('data', function(chunk){  //接收字节数据});

req.end('data', function(){  //转换||处理});

req.error('error', function(e){  //处理错误});

Wenn das Front-End Cookies verwenden muss und das Back-End sie lesen muss, müssen Sie in der Hintergrund-Mock-Schnittstelle die Header von req abrufen, und holen Sie sich die Cookie-Zeichenfolge daraus und geben Sie sie selbst zurück, um sie aufzuteilen und zu verarbeiten usw.

Natürlich ist das möglich, aber es ist aufwändiger. Sie müssen es selbst tun, vom Empfang der Daten bis zur Konvertierung.

Das von vue-cli erstellte Projekt verwendet Express als Web-Framework von node.js, das umfangreiche Middleware unterstützt.

Entsprechend den oben genannten Problemen gibt es Body-Parser- und Cookie-Parser-Middleware, die die Daten und Cookies im Body des Beitrags einfach in req.body- und req.cookies-Objekte extrahieren können, damit Benutzer sie verwenden können. Das ist sehr praktisch.

Middleware installieren

npm install body-parser --save-dev

npm install cookie-parser --save-dev

Middleware einführen

in Build/Dev- Middleware hinzufügen require am Ende des Header-Require-Bereichs in der Datei server.js.

  var bodyParser = require('body-parser');  var cookieParser = require('cookie-parser');

Dann fügen Sie den Middleware-Aufruf direkt nach var app = express() hinzu.

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());

Die beiden Zeilen zum Aufrufen von bodyParser basieren auf den Inhaltstypeinstellungen von „application/json“ und „application/x-www-form-urlencoded“.

Nach Abschluss der Zugabe ist die Verwendung einfach.

Ende

Das obige ist der detaillierte Inhalt vonTeilen Sie ein Beispiel-Tutorial zum Erstellen eines Vue-Cli-Projekts.. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!