Get Size Up Uploaded Video Post Nodejs

Introduction

File upload is the about basic operation for any application. Combining Node.js with Express and the Multer library, nosotros can smoothly implement the file uploading characteristic. Today we are going to discuss and learn well-nigh file upload using multer in node js and limited, as well we will see how to upload image/video using multer in node js and express. Let'due south begin our tutorial and acquire nigh file upload using Multer in NodeJS and Express.js.

What is Multer?

According to the documentation-
Multer is a node.js middleware for handling multipart/form-data, which is primarily used for uploading files. It is written on acme of the busboy for maximum efficiency.

Click here to explore more regarding the implementation of Multer.

Steps File Upload Using Multer in Node.js and Express

Follow the step-by-stride guide to learn about how to upload file using multer in node js and express.

Initial Setup

Create a directory

mkdir MulterApp cd MulterApp

Ascertain package.json file

For creating i, run this control:

npm init

Install dependencies

We only accept two dependencies to be installed- Express and Multer. So here are the commands

To install Express-

npm install express --save          

To install Multer-

npm install --save multer          

At present, it'southward time to code.

Showtime of all, create a file and proper noun it anything; hither it is app.js. I'll exist coding the entire code in app.js to keep it simple for y'all. Further, loading the express module with the help of require() and then, at last, writing the below-mentioned lawmaking for setting up the basic limited server.

//app.js

const express = require('express'); const path = crave('path'); const app = express() const port = procedure.env.PORT || 3000 app.get('/', (req, res) => {      res.ship('Hello People');  }); app.listen(port, () => {     panel.log('Server is up on port ' + port); })

Run this command to verify-

node app.js          

Hit http://localhost:3000, and you should run across "Hello People" in your window.

Adding Multer

For simplicity purpose, I'll shop all the uploaded files in the local folder. Write the below-mentioned code for loading multer in our app.js file

const multer = crave('multer');          

Multer Storage for Unmarried Prototype Upload

At present, the next matter to exist implemented is to define a storage location for all the files. Multer made it easy past providing an option to store our files to disk. Nosotros will gear up a directory to save all the files and provide them a new identifier.

Create a folder- images, in the root directory.

// Image Upload

const imageStorage = multer.diskStorage({     // Destination to shop image          destination: 'images',        filename: (req, file, cb) => {           cb(null, file.fieldname + '_' + Date.now()               + path.extname(file.originalname))             // file.fieldname is proper noun of the field (epitome)             // path.extname go the uploaded file extension     } });          

ane. Destination: Destination is used so that the application can know where to store images. Information technology can be a string (e.g. './upload'). The default directory for all the temporary files is used in case the destination is not provided. Creating a directory is compulsory when you use the destination as a function. Or else, if y'all apply destination as string, Multer volition create directory.

2. Filename: Filename determines what a file should be named in the folder.

A random file name with no extension volition be given if y'all don't provide the file's name. The role takes 3 parameters – the request object, the file object, and a callback function. The 2 arguments to the callback are:

• naught: equally we aren't showing an error.
• file.originalname – in this demo, I have used the aforementioned file proper name as they are uploaded. You tin can choose any name.

We take used the multer() method in the below-mentioned snippet-

const imageUpload = multer({       storage: imageStorage,       limits: {         fileSize: 1000000 // meg Bytes = 1 MB       },       fileFilter(req, file, cb) {         if (!file.originalname.friction match(/\.(png|jpg)$/)) {             // upload only png and jpg format            render cb(new Error('Please upload a Epitome'))          }        cb(undefined, truthful)     } })          

one. The multer() method takes an object with storage property.
2. The limits belongings describes the maximum size of the file.

The fileFilter() method is for security reasons. I have validated files earlier it is uploaded to the servers. Here, it will accept simply two extensions – .png and .jpg. Later on this, it's fourth dimension to create the post route. We will make a POST asking to localhost:3000/uploadImage.

Add the following code in the app.js-

// For Single image upload router.post('/uploadImage', imageUpload.unmarried('image'), (req, res) => {      res.send(req.file) }, (error, req, res, next) => {      res.status(400).send({ error: mistake.message }) })

I have used imageUpload.single('image') for uploading a single file. As mentioned earlier, the multer adds a file object to the request. The file object has metadata of the file. Here within the single() method, we accept passed the field name. The aforementioned field name nosotros will laissez passer in Postman.

To test the endpoint, open up Postman.

Keep fundamental proper noun or the field name same as those given in the imageUpload.unmarried() Bank check the paradigm in the Images folder.

Upload Multiple Images using Multer

Now we will upload multiple files using Multer. For that, multer provides another function named arrays(fieldname[, max_count]) that takes an array of files, all with the proper name fieldname. It volition generate an error in case y'all upload more than max_count files. The array of files will be saved in req.files.

Here no demand to create any storage. We volition use the same storage as before.

// For multiple image upload  router.post('/uploadBulkImage', imageUpload.array('images', iv),     (req, res) => {    res.send(req.files) }, (error, req, res, next) => {     res.status(400).send({ error: error.message }) })

Open up Postman, enter the URL, select multiple files and click Transport.

Verify the prototype in the Images folder.

Upload Video Files using Multer

Let'southward further learn about video file upload in node js using multer and video file upload in express using multer. Every bit discussed above, we have to create diskStorage to upload the video. And for that, use the beneath-mentioned snippet-

// Video Upload

const videoStorage = multer.diskStorage({      destination: 'videos', // Destination to store video       filename: (req, file, cb) => {          cb(null, file.fieldname + '_' + Date.now()            + path.extname(file.originalname))      } });          

Utilise multer() method to upload video the style we did for images.

const videoUpload = multer({      storage: videoStorage,      limits: {      fileSize: 10000000 // 10000000 Bytes = x MB      },      fileFilter(req, file, cb) {        // upload only mp4 and mkv format        if (!file.originalname.lucifer(/\.(mp4|MPEG-4|mkv)$/)) {            return cb(new Error('Please upload a video'))        }        cb(undefined, truthful)     } })

After this, create a Postal service request to upload the video.

router.post('/uploadVideo', videoUpload.single('video'), (req, res) => {    res.ship(req.file) }, (mistake, req, res, side by side) => {     res.status(400).send({ error: fault.message }) })

Test the API in Postman as explained above.

Bank check the video in the videos folder.

You can find the source code here – Github Repository

Conclusion

I hope yous found this tutorial of how to upload files(Video/Prototype) using multer in node js and express.js helpful and take learned most image and video file upload using Multer in NodeJs and Express.js. File upload can be an exciting characteristic, merely its implementation doesn't have to be hard e'er. We can handle multipart/form-information at our ease, using Multer and Limited.js.

If you are looking for file upload in node js using multer and file upload in Limited.js using multer, then you have landed on the correct page. At Bacancy Technology, we hold a pool of skilled Node.js developers whose expertise can be leveraged for handling multipart and form-data. Hire Nodejs developer from us to integrate file upload in node js using multer in any application. Build your next-gen application with your selection of frontend and integrate the file uploads based on the knowledge acquired from Nodejs tutorials.

Go along Learning and Coding!

thorntonthroplad1935.blogspot.com

Source: https://www.bacancytechnology.com/blog/file-upload-using-multer-with-nodejs-and-express