How to Upload Files to Node.js Express Server Using Express FileUpload Library

hello friends today in this tutorial I will be telling you that how to upload files on a node.js server using this library which is Express file upload I think that this is one of the most simplest libraries that you can come across while uploading files to the node.js server this is a command here in order to install this library I have already installed this so just make a new node project and install this by NPM install Express - file upload so enter it and install this library as I have already installed this library so I will be making this project here so inside my node.js project we have this index for J's file for so first of all I will be making the Express server by importing Express and upload library Express of tort liability so just require it Express this will be Express file upload and now we just need to make a simple Express app this is a simple syntax so AB dot listen we will be listening on 5000 port and we will be making a simple get request to the home route AB dot get to the home route we will be making that request so this will hold a request and the response this will be arrow function and we will be sending a file HTML file by use of this function their name you will use and we will concatenate the index or HTML that we will create here so just do this let me just create a index.html file here in my route the keyboard is very slow my keyboard is very slow so that is why I have finding very difficulty so here you just need to concatenate your index for HTML that's it and now here we just need to write a very simple HTML file so file upload in node.js so here we will be having a simple form sorry let me just close this so after this we will be having a simple form the method will be post action will be on home route and encoding type I will give as multi-part form data it is very much necessary if you are working with files so this will contain input type of file and we will be giving a name of also file that's it and a button to submit the form so input type submit and the value will be equal to upload that's it so this is a form guys so now we just need to restart our server so but before that we just need to add our middleware this is the Express file upload middleware you can just use that AB dot use and we can just call this function of load at set and now if I write here nor index for J's it will start the server and now if I go back to localhost 5000 so if you we'll open this HTML file here I can just choose my file and upload the file and here guys we just need to handle our post request inside our index for JS so we will just write AB dot post to the home route so this will again have requests and B response this is the arrow function so here first of all we will check that if we will check for the if condition here requests dot files is initialized if it is initialized then we will be bring printing it in the console console dot log request dot file starts it and now if I just restart the server guys so if I again restart the server and let me choose a file here let me choose an image here upload if I check my console you will see that it will get all the information about the file that is uploaded name encoding term file path truncated mem type all that stuff and now we just need to extract the file name of the plurid file so for that we can just create a variable some variables where file will be equal to request dot files dot the file name that you have given in the index for HTML this is the name that I have given file so I will just try it file so this will get the file object in order to extract the file name I will declare a new variable and here I will just use file dot name that's it if I console log file a so it will print out the file name to us so now if I again restart the server and let me just open once again upload the file choose file and let me upload this file click on the upload button and you will see that it will display the name of the picture that we are uploading here webcam toy for 2 and dot jpg and now I just staged guys we need to create the upload folder so right here in the inside the root folder we can just create a upload folder uploads folder inside this folder we will be uploading all the files that we will upload here and now we can just use the move function so this will be file dot to move so it will move the file to this folder which which is uploads so here we just need to write in single quotes my keyboard is very slow guys so just bear with me let me press shift for for five seconds so at my keyboard can start there is a problem with my keyboard entry you can see that I need to keep shifting this pressing this in order to work even see let me just press it why here you can see that let me just my keyboard his stuff you can see that let me just so in single quotes guys you need to write in single quotes you just need to write dot slash uploads slash and followed by the name of the file that you are uploading so in this case we are uploading the file name which was file name that's it so again it will hold the third argument which will be having if any kind of error take place we can just write if error we can just return the error by in the response so response sent you can send out the error if no error take place we can just write in the else flock that is response toward send file uploaded that's it and now this application is complete guys so now if I again restart the application so again if I choose a file here let me choose this file click the upload button and it is saying that I think that I have made a mistake here this needs to be I think that this needs to be plus here so just my keyboard is not working so just wait this needs to be a plus sign here so let me just make it here plus sorry guys about my key word this really frustrate let me just see this was plus not comma please work this needs to be plus just make this change guys and now if you restart the server it should work and now if I go back to the server if I select the file click the upload here you will see that file uploaded and now if you if I check the folder which is the uploads folder you will see that this file is uploaded here you can upload any sort of file here it is not restricted to images you can upload any kind of file you can even upload images so if I want to upload images I can upload it so this fill up obviously take time depending upon the file size so you will see that it has uploaded the video you can see that so thanks very much guys of all for watching this video if you liked this video then please hit the like button subscribe the channel and I will be seeing you in the next video until then thank you very much

Channel: Coding Shiksha

Views: 104,918

Keywords: coding shiksha, how to upload files to node.js, upload files to express, upload files in node js, upload files in express, express-fileupload example, express-fileupload multiple files, express-fileupload tutorial, nodejs file upload, node.js file upload example, express file upload, multer file upload express example, express file upload example

Id: ymO_r1hcIXk

Length: 10min 22sec (622 seconds)

Published: Fri Dec 20 2019