Node js Express Multiple Image Upload using Multer Example

About Us:

We are from free coder. We are a group of web developers who are passionate about web development. You can learn from us php, laravel, node js, vue js, react js and many other topic on web developement.
we are very happy to help you.
free coder

Today what you are going to learn:

In this lesson i will show you node js express multiple image upload lesson. if you have question about multiple image upload using multer in node js then i will give simple lesson with solution. if you have question about node js multer multiple image upload lesson then i will give simple lesson with solution. This post will give you simple lesson of node js multiple image upload using multer. follow bellow step for node js express multiple image upload lesson.

I will give you step by step simple lesson of multiple image upload using multer with node js and express js. let's follow bellow steps:

Lesson 1: Create Node App

run bellow command and create node app.

mkdir my-app

cd my-app

npm init

Lesson 2: Install express and multer

run bellow command and create node app.

npm install express multer --save

Lesson 3: Create app.js file

app.js

const express = require('express');

const multer = require('multer');

const path = require('path');

const app = express();

const storage = multer.diskStorage({

destination: function(req, file, cb) {

cb(null, 'uploads/');

},

filename: function(req, file, cb) {

cb(null, file.fieldname + '-' + Date.now() + path.extname(file.originalname));

}

});

var upload = multer({ storage: storage })

app.get('/', (req, res) => {

res.sendFile(__dirname + '/index.html');

});

app.post('/', upload.array('multi-files'), (req, res) => {

res.redirect('/');

});

app.listen(3000);

Lesson 4: Create index.html file

index.html

<!DOCTYPE html>

<html lang="en">

<head>

<title>Node js Express Multiple Image Upload using Multer Lesson - ItSolutionStuff.com</title>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1">

</head>

<body>

<h1>Node js Express Multiple Image Upload using Multer Lesson - ItSolutionStuff.com</h1>

<form action="/" enctype="multipart/form-data" method="post">

<input type="file" name="multi-files" accept='image/*' multiple>

<input type="submit" value="Upload">

</form>

</body>

</html>

now you can simply run by following command:

npm start

open following url:

localhost:3000

thank you very much for following up with me.

Tags

Recent Posts

Related Posts