Multer middleware setup in Express

Introduction

Multer helps your Express app handle file uploads easily by processing files sent from users.

When you want users to upload profile pictures on your website.

When you need to accept documents or images through a form.

When building a blog that allows uploading images for posts.

When handling file uploads in an API endpoint.

When you want to save uploaded files to your server or cloud storage.

Syntax

Express

import multer from 'multer';

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

app.post('/upload', upload.single('fileFieldName'), (req, res) => {
  // req.file contains the uploaded file info
  res.send('File uploaded!');
});

Use upload.single('fieldName') for one file, or upload.array('fieldName', maxCount) for multiple files.

The dest option sets the folder where files are saved temporarily.

Examples

Uploads a single file from the form field named 'avatar' and saves it to 'uploads/' folder.

Express

const upload = multer({ dest: 'uploads/' });
app.post('/profile', upload.single('avatar'), (req, res) => {
  res.send('Avatar uploaded');
});

Uploads up to 3 files from the form field named 'photos'.

Express

const upload = multer({ dest: 'uploads/' });
app.post('/photos', upload.array('photos', 3), (req, res) => {
  res.send('Multiple photos uploaded');
});

Customizes where and how files are saved with unique names.

Express

const storage = multer.diskStorage({
  destination: (req, file, cb) => cb(null, 'custom_folder/'),
  filename: (req, file, cb) => cb(null, Date.now() + '-' + file.originalname)
});
const upload = multer({ storage });

Sample Program

This Express app uses Multer to accept one file from the 'file' field and saves it to 'uploads/'. It sends a success message with the original file name.

Express

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

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

app.post('/upload', upload.single('file'), (req, res) => {
  if (!req.file) {
    return res.status(400).send('No file uploaded.');
  }
  res.send(`File ${req.file.originalname} uploaded successfully.`);
});

app.listen(3000, () => {
  console.log('Server running on http://localhost:3000');
});

Important Notes

Always create the upload folder (e.g., 'uploads/') before running the app or Multer will error.

Multer only processes multipart/form-data requests, so set your form's enctype accordingly.

For security, validate file types and sizes before saving or processing files.

Summary

Multer is middleware for handling file uploads in Express apps.

Use upload.single() or upload.array() to specify how many files to accept.

You can customize file storage location and names with Multer's storage options.