File Uploading in Node JS (Part 1)

Hello friends, previously we tried to upload a file using PHP, Java (JSP), but in this post we are going to learn how to upload a file using Node JS. Its very simple to upload file using Node JS than other scripting languages or technologies. In this post we will focus on following topics,

• How can we upload a file in Node JS
• Modules requirement for uploading file
• Steps to upload file in Node JS

How can we upload a file in Node JS :
Like other programming language and technology, there are some pre-defined modules are available to upload file from client to sever. But in this post we will use the module named as multer to upload file. So multer is basically a module available for Node to upload file from client's browser to server.

Modules requirement for uploading file :
Following are the module, we will use for some specific functionalities,

express -------------> for routing, creating and listening the server

multer --------------> for uploading the file

Steps to upload file in Node JS :
Following are the step by step procedure to upload file in Node JS,

Step 1: (Installing the required modules)
In this step, we need to install the required modules, such as express and multer. Just open your Command Prompt and type following commands to have the required modules for our application.

> npm install express (to install express)

and

> npm install multer (to install multer)

Step 2: (Attach the required modules)
In this step we will start coding. So now we will attach the required modules, by writing following piece of code,

var express = require('express');
var multer   = require('multer');

Step 2 (Configure Multer) :
Now we need to configure the multer, thats means in this we need to write some JSON data object to configure the multer, as follows,

var upload = multer({dest: 'upload',......});

Step 3 : (Instantiate express) :
Now we need to initiate the express for the server and routing, as follows,

var app = express();

Step 4 : (Getting the posted/uploaded file and listen to server)
Here in this step we will write the code for getting the posted or uploaded file from the upload form,

app.post('/upload', upload.single('myFile'), function(req, res, next){
    res.send("File Uploaded....!");
});

app.listen('3000');

Here myFile is the name of the file input element.
Complete Code :
Create a file named as file_upload.js, and write the following code into this file,

var express = require("express");
var multer   = require("multer");

var upload   = multer({dest: 'upload/'});
var app       =  express();

app.post('/upload', upload.single('myFile'), function(req, res, next){
    res.send("File Uploaded....!");
});

app.listen("3000");

Step 5 (Create the HTML template for uploading UI)
Now we need to design the HTML form for uploading file,

<form enctype = "multipart/form-data" action = "http://localhost:3000/upload/" method = "post">
    <input type="file" name="myFile" />
    <input type="submit" value="Upload Image" name="submit">
</form>

So we are done with coding, now you just need to start the server by using the command "> node file_upload.js", and you need check for the file upload.

Note:

This post this just a small example for file upload in Node JS, in later parts wewill learn more about file upload in Node JS in detail.

If you have doubt or any problem with this code, please feel free to comment bellow.