How to Handle File Upload in Express: Simple Guide

To handle file uploads in Express, use the multer middleware which processes incoming files in multipart/form-data format. Set up multer to specify storage and file handling, then access uploaded files via req.file or req.files in your route handlers.

Why This Happens

Express does not handle file uploads by default because it only parses JSON and URL-encoded data. Trying to access uploaded files directly from req.body will not work and results in missing file data.

javascript

import express from 'express';

const app = express();

app.post('/upload', (req, res) => {
  console.log(req.body); // No file data here
  res.send('File upload attempted');
});

app.listen(3000);

Output

Output: req.body is empty or contains only text fields, no file data.

The Fix

Use the multer middleware to handle file uploads. It parses multipart/form-data requests and saves files to disk or memory. Then you can access the uploaded file via req.file or req.files.

javascript

import express from 'express';
import multer from 'multer';

const app = express();
const upload = multer({ dest: 'uploads/' });

app.post('/upload', upload.single('myFile'), (req, res) => {
  console.log(req.file); // File info here
  res.send('File uploaded successfully');
});

app.listen(3000);

Output

Output: File info object logged, response 'File uploaded successfully' sent.

Prevention

Always use middleware like multer for file uploads to avoid missing or corrupted data. Validate file size and type to improve security. Keep upload directories outside public folders or restrict access. Use descriptive field names and handle errors gracefully.

Related Errors

1. Error: Unexpected field - Happens if the field name in upload.single() does not match the form field name.

2. File too large - Set limits in multer options to control max file size.

3. No file received - Ensure the form uses enctype="multipart/form-data" and the client sends the file correctly.

Key Takeaways

Use multer middleware to handle file uploads in Express.

Access uploaded files via req.file or req.files after multer processes the request.

Always validate and limit file size and type for security.

Ensure the client form uses enctype="multipart/form-data" for file uploads.

Match multer field names with form input names to avoid errors.