How to Handle Files Correctly in Node Js? || Upload and Download a file in Node Js.........

In this we will learn how can we can allow our users to upload a files and how we can handle them in our server side and what are the different possibilities we have for returning file to our Users

File Upload And Download in Node Js using express Library

Start learning EJS it is easy and it makes our website dynamic.

Heading #1 : Make changes in the HTML or Ejs code

Heading #2: Install a Express package

Heading #3: How to Use Multer?

---

Make changes in the HTML or Ejs code

<div class="form-control"> <label for="image">Image</label> <input type="file" name="image" id="image"> </div>

This code will look like this.

This is the default html element file picker.

Logic behind for handling a upload file, to store it or do anything with that.

1. Go to the place in the project where we handle the creation of the product or where we want to upload the file.

2. Change the middleware if you are using a Imagle url encoder like app.use(bodyParser.urlencoded({ extended: false }));

3. URLencoded means it will take text or url links only

4. Image is a binary file

Heading #2: Install a Express package

npm install --save multer

Multer:- Multer is another third party package that parses incoming requests but this package parses incoming requests for files, so it is able to handle file requests as well or requests with mixed data, with text and file data.

Go to the HTML Code or the Views file

1. There after the form action class in the end after the POST type

2. enctype="multipart/form-data"

3. this submission, that this request will not contain plaintext but will contain mixed data, text and binary.

Heading #3: How to Use Multer?

Multer is some middleware which we execute on every incoming request and it then simply has a look at that request sees if it's multipart form data and tries to extract files if that is the case.

Import mutler in the application

by

const multer = require('multer')

Multer has to be executed as a function and then we have to call another method on that and that simply defines if you expect to get multiple files or only one file and we will only expect

We will use Single method because we are expecting single file.

app.use(multer().single('image'))

This is not a random word image... We have made changes in the starting and we are taking that same word which we have used earlier

This wil store our file into buffer now we need to store our file into a single file

when we set up multer, we can pass an object to the multer function and there we can set many options and there is a dest option

it can then turn that buffer back into binary data you could say and it stores it in this path here.

Instead of using single we can use storage

make another new configuration object

const fileStorage = multer.diskStorage({ destination: , filename: })

const fileStorage = multer.diskStorage({ destination: (req, file, cb) => { cb(null, 'images') }, filename: (req, file, cb) => { cb(null, new Date().toISOString() + '-' + file.originalname); } }) new Date().toISOString()

Used this because if we have two same name then we need something to differentiate thats why we used new Date().toISOString ()

Heading #3: How to Filter in files

const fileFilter = (req, file, cb) => { if (file.mimetype === 'image/png' || file.mimetype === 'image/jpg' || file.mimetype === 'image/jpeg') { cb(null, true); } else { cb(null, false) } }Write this code below the fileStorage Code

and one change in our multer code

pp.use(multer({ storage: fileStorage, fileFilter: fileFilter }).single('image'))