Handling forms in Express
How to process forms using Express
This is an example of an HTML form:
<form method="POST" action="/submit-form">
<input type="text" name="username" />
<input type="submit" />
</form>
When the user presses the submit button, the browser will automatically make a POST
request to the /submit-form
URL on the same origin of the page. The browser sends the data contained, encoded as application/x-www-form-urlencoded
. In this particular example, the form data contains the username
input field value.
Forms can also send data using the GET
method, but the vast majority of the forms you’ll build will use POST
.
The form data will be sent in the POST request body.
To extract it, you will need to use the express.urlencoded()
middleware:
const express = require('express')
const app = express()
app.use(express.urlencoded({
extended: true
}))
Now, you need to create a POST
endpoint on the /submit-form
route, and any data will be available on Request.body
:
app.post('/submit-form', (req, res) => {
const username = req.body.username
//...
res.end()
})
Don’t forget to validate the data before using it, using express-validator
.
I wrote 21 books to help you become a better developer:
- HTML Handbook
- Next.js Pages Router Handbook
- Alpine.js Handbook
- HTMX Handbook
- TypeScript Handbook
- React Handbook
- SQL Handbook
- Git Cheat Sheet
- Laravel Handbook
- Express Handbook
- Swift Handbook
- Go Handbook
- PHP Handbook
- Python Handbook
- Linux Commands Handbook
- C Handbook
- JavaScript Handbook
- Svelte Handbook
- CSS Handbook
- Node.js Handbook
- Vue Handbook