Beim Erstellen von Webanwendungen ist der Umgang mit Benutzereingabedaten ein entscheidender Aspekt, um interaktive und flexible Funktionen zu erstellen. In der Express.js Entwicklungsumgebung können Sie problemlos Eingabedaten aus Formularen und verschiedenen HTTP-Anfragen wie GET, POST, PUT, PATCH und verarbeiten DELETE. Hier ist eine detaillierte Anleitung mit mehreren Methoden und Beispielen, die Ihnen dabei helfen, dies zu erreichen:
Empfangen von Informationen von Form
HTML erstellen Form: Beginnen Sie mit der Erstellung eines HTML form in einer Pug- oder EJS-Datei. action
Stellen Sie sicher, dass Sie das Attribut im Tag festlegen, <form>
um die Route anzugeben, an die die Anfrage gesendet wird.
<form action="/process" method="post">
<input type="text" name="username" placeholder="Username">
<input type="password" name="password" placeholder="Password">
<button type="submit">Submit</button>
</form>
Bearbeitungsanfrage POST: Verwenden Sie im Routenhandler die body-parser
Middleware, um Daten aus der POST Anfrage zu extrahieren.
const bodyParser = require('body-parser');
app.use(bodyParser.urlencoded({ extended: true }));
app.post('/process',(req, res) => {
const username = req.body.username;
const password = req.body.password;
// Process data and return results
});
Umgang mit verschiedenen Anfragetypen anhand eines Anmeldebeispiels
Senden POST einer Anfrage über die Anmeldung Form: Stellen Sie im HTML form sicher, dass Sie die post
Methode und das action
Attribut festlegen, um die Route anzugeben, an die die POST Anfrage gesendet wird.
<form action="/login" method="post">
<input type="text" name="username" placeholder="Username">
<input type="password" name="password" placeholder="Password">
<button type="submit">Login</button>
</form>
Bearbeitung POST der Anmeldeanfrage: Verwenden Sie im Routenhandler die body-parser
Middleware, um Daten aus der Anfrage zu extrahieren POST und die Anmeldeverarbeitung durchzuführen.
const bodyParser = require('body-parser');
app.use(bodyParser.urlencoded({ extended: true }));
app.post('/login',(req, res) => {
const username = req.body.username;
const password = req.body.password;
// Check login information
if(username === 'admin' && password === '123') {
res.send('Login successful!');
} else {
res.send('Login failed!');
}
});
Abwicklung PUT und DELETE Anfragen
Bearbeitung von PUT Anfragen: Zur Bearbeitung PUT von Anfragen können Sie eine Route und Middleware verwenden, um Daten aus der Anfrage zu extrahieren und die entsprechende Aktualisierung durchzuführen.
app.put('/update/:id',(req, res) => {
const id = req.params.id;
const updatedData = req.body;
// Perform data update with corresponding ID
});
Bearbeitung DELETE von Anfragen: Um DELETE Anfragen zu bearbeiten, verwenden Sie außerdem eine Route und Middleware, um die ID zu identifizieren und den Löschvorgang durchzuführen.
app.delete('/delete/:id',(req, res) => {
const id = req.params.id;
// Perform data deletion with corresponding ID
});
Abschluss
Bei der Webentwicklung ist es von entscheidender Bedeutung, zu verstehen, wie mit Benutzereingabedaten und verschiedenen HTTP-Anfragen umgegangen wird. Durch die Verwendung Express.js einer Middleware wie body-parser
, können Sie Eingaben aus Formularen problemlos verarbeiten und verschiedene HTTP-Anfragen verarbeiten, einschließlich GET, POST, PUT, PATCH und DELETE. Dadurch können Sie interaktive und flexible Funktionen auf Ihrer Website erstellen.