Most Popular Tutorials
Most Popular Tutorials :-

Simply Easy Learning at Your Fingertips. Click Tutorials Menu to view More Tutorial List





How to Upload multiple file using node.js and Express.Js with multer module?

Create a Project

c:\> npx express --view=ejs crud_api

Initialise and Configure Our Project

File Name :

c:\crud_api> npm init -y

npm install

c:\crud_api> npm install

Install express and other dependencies

File Name :

c:\crud_api> npm install express --save

install Body Parser :-

File Name :

c:\crud_api> npm install body-parser --save

MySql Install

File Name :

c:\crud_api> npm install mysql --save

Nodemon Install

File Name :

c:\crud_api> npm install --save-dev nodemon

Install Multer

File Name :

npm install --save multer

create upload-form.js page under view directory.

File Name : views/upload_form.js

<!DOCTYPE html>
<html>
<head></head>
<body>
<form action="/upload_myfile" method="POST" enctype="multipart/form-data">
<label>Avatar</label>
<input type="file" name="myfiles" multiple>
<button type="submit">Upload</button>
</form>
</body>
</html>

creates directory middlewares under root directory.

create a file upload-middleware.js in the middlewares folder.

You must include the Multer module by using require('multer')

File Name : middlewares/upload_middleware.js

var multer = require('multer');
module.exports.files={
storage:function(){
var storage = multer.diskStorage({
destination: function (req, file, cb) {
cb(null, 'public/files/')
},
filename: function (req, file, cb) {
cb(null, file.originalname)
}
})

return storage;
},
allowedFiles:function(req, file, cb) {
// Accept images only
if (!file.originalname.match(/\.(pdf|doc|txt|jpg|JPG|jpeg|JPEG|png|PNG|gif|GIF)$/)) {
req.fileValidationError = 'Only pdf|doc|txt|jpg|JPG|jpeg|JPEG|png|PNG|gif|GIF file type are allowed!';
return cb(new Error('Only pdf|doc|txt|jpg|JPG|jpeg|JPEG|png|PNG|gif|GIF file type are allowed!'), false);
}
cb(null, true);
}
}

Create Controller :-

include a middleware file using require('../middlewares/upload_middleware')

File Name : controllers/upload_controller.js

var multer = require('multer');
var uplm_obj = require('../middlewares/upload_middleware');
module.exports={
uploadForm:function(req,res){
res.render('upload_form');
},
uploadFiles:function(req,res){
var upload = multer({
storage: uplm_obj.files.storage(),
allowedFiles:uplm_obj.files.allowedFiles
}).single('files');
upload(req, res, function (err) {
if (err instanceof multer.MulterError) {
res.send(err);
} else if (err) {
res.send(err);
}else{
res.render('upload_form');
}

})

}
}

Create Routes to Upload Multiple Files

File Name : routes/upload_route.js

const express = require('express');
const router = express.Router();
const upc = require('../controllers/upload_controller');
router.get('/upload-files',upc.uploadForm);
router.post('/upload-files',upc.uploadFiles);
module.exports = router;

Include the Router File in app.js

File Name : app.js

var ur = require('./routes/upload_route');
;
app.use('/', ur);

Output :-

http://localhost:3000/upload-files

  • open your browser and Enter the above URL in your browser
  • after that Select multiple files from your device by pressing the ctrl/shift key
  • finally Click submit button to upload files successfully.





    • Previous Next


    Trending Tutorials


    PHP

    PHP

    100+ Tutorials
    oops

    PHP OOPs

    80+ Tutorial
    Codeigniter

    Codeigniter

    100+ Tutorial
    Laravel

    Laravel

    100+ Tutorials
    Node.js

    NODE.JS

    100+ Tutorials
    Javascript

    Javascript

    100+ Tutorials


    Review & Rating

    0.0 / 5

    0 Review

    5
    (0)

    4
    (0)

    3
    (0)

    2
    (0)

    1
    (0)

    Write Review Here


    Most Popular Tutorials

     Important Link