How to Upload CSV File to Mongodb Database in Node JS?

Nov 21, 2022

.

Admin

How to Upload CSV File to Mongodb Database in Node JS?

Hello Friends,

Today our leading topic is how to upload a CSV file to the MongoDB database in node js. we will help you to give an example of importing CSV file records in MongoDB with node js. I want to share with you the uploaded CSV files as MongoDB documents using node.js. it's a simple example of importing a CSV file into MongoDB collection using node.js.

Import CSV file to MongoDB using node js + express tutorial, you will also learn how to upload CSV file into Node js + express app. Then read CSV file data using npm CSVTOJSON package and import it in MongoDB database with node js + express app.

Step 1: Create Node Express js App


Execute the following command on the terminal to create the node js app:

mkdir my-app

cd my-app

npm init -y

Step 2: Install express ejs body-parser mongoose CSVTOJSON Multer Modules

Execute the following command on the terminal to express ejs body-parser mongoose dependencies:

npm install -g express-generator

npx express --view=ejs

npm install csvtojson mongoose multer body-parser

body-parser – Node.js request body parsing middleware which parses the incoming request body before your handlers, and makes it available under req.body property. In other words, it simplifies incoming request.

Express-EJS– EJS is a simple templating language which is used to generate HTML markup with plain JavaScript. It also helps to embed JavaScript to HTML pages

Mongoose – Mongoose is a MongoDB object modeling tool designed to work in an asynchronous environment. Mongoose supports both promises and callbacks.

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

CSVTOJSON – A tool concentrating on converting CSV data to JSON with customized parser supporting.

Step 3: Create Model

Create Models directory and inside this directory create studentModel.js file; Then add following code into it:

var mongoose = require('mongoose');

var csvSchema = new mongoose.Schema({

FirstName:{

type:String

},

LastName:{

type:String

},

SSN:{

type:String

},

Test1:{

type:Number

},

Test2:{

type:Number

},

Test3:{

type:Number

},

Test4:{

type:Number

},

Final:{

type:Number

},

Grade:{

type:String

}

});

module.exports = mongoose.model('studenModel',csvSchema);

Step 4: Create CSV File Upload HTML Markup Form

Create file/image upload Html form for uploading images or files in MongoDB database; So visit views directory and create an index.ejs file inside it. Then add the following code into it:

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<meta http-equiv="X-UA-Compatible" content="ie=edge">

<title>node js upload csv file to mongodb - tutsmake.com</title>

<link rel="stylesheet" href="/css/bootstrap.min.css">

</head>

<body>

<nav class="navbar navbar-expand-lg navbar-dark bg-primary fixed-top">

<a class="navbar-brand" href="#">CsvToMongo</a>

</nav>

<div class="container">

<div class=" nav justify-content-center" style="margin-top:100px;">

<div class="card border-warning mb-3 " style="max-width: 20rem;">

<div class="card-header">

<h5>Upload csv file</h5>

</div>

<div class="card-body">

<form action="/" method="post" enctype="multipart/form-data">

<input type="file" name="csv"><br><br>

<div class="text-center">

<button type="submit" class="btn btn-lg btn-primary">submit</button>

</div>

</form>

</div>

</div>

</div><br>

<%if(data){%>

<div>

<table class="table table-hover table-responsive table-stripped nav justify-content-center" style="width: auto" >

<thead>

<tr class="bg-primary">

<th>S.no</th>

<th style="padding-right: 1em">LastName</th>

<th style="padding-right: 1em">FirstName</th>

<th style="padding-right:2em;padding-left:2em;">SSN</th>

<th>Test1</th>

<th>Test2</th>

<th>Test3</th>

<th>Test4</th>

<th>Final</th>

<th>Grade</th>

</tr>

</thead>

<tbody style="overflow-x: scroll; height:350px;" class="table-bordered">

<%for(var i=0;i< data.length;i++){%>

<tr class="text-center">

<td ><%= i+1%></td>

<td style="padding-right: 1em"><%= data[i].LastName%></td>

<td style="padding-left: 1em;"><%= data[i].FirstName%></td>

<td style="padding-right:1em;padding-left:1em;"><%= data[i].SSN%></td>

<td style="padding-left: 1em"><%= data[i].Test1%></td>

<td style="padding-left: 1em"><%= data[i].Test2%></td>

<td style="padding-left: 1em"><%= data[i].Test3%></td>

<td style="padding-left: 1.2em"><%= data[i].Test4%></td>

<td style="padding-left: 1.2em"><%= data[i].Final%></td>

<td style="padding-left: 1.2em"><%= data[i].Grade%></td>

</tr>

<%}%>

</tbody>

</table>

</div>

<%}%>

<br>

</div>

</body>

</html>

Step 5: Import Modules in App.js

Import express, body-parser, mongoose, multer dependencies in app.js; as shown below:

var express = require('express');

var mongoose = require('mongoose');

var multer = require('multer');

var path = require('path');

var csvModel = require('./models/csv');

var csv = require('csvtojson');

var bodyParser = require('body-parser');

var storage = multer.diskStorage({

destination:(req,file,cb)=>{

cb(null,'./public/uploads');

},

filename:(req,file,cb)=>{

cb(null,file.originalname);

}

});

var uploads = multer({storage:storage});

//connect to db

mongoose.connect('mongodb://localhost:27017/csvdemos',{useNewUrlParser:true})

.then(()=>console.log('connected to db'))

.catch((err)=>console.log(err))

//init app

var app = express();

//set the template engine

app.set('view engine','ejs');

//fetch data from the request

app.use(bodyParser.urlencoded({extended:false}));

//static folder

app.use(express.static(path.resolve(__dirname,'public')));

//default pageload

app.get('/',(req,res)=>{

csvModel.find((err,data)=>{

if(err){

console.log(err);

}else{

if(data!=''){

res.render('demo',{data:data});

}else{

res.render('demo',{data:''});

}

}

});

});

var temp ;

app.post('/',uploads.single('csv'),(req,res)=>{

//convert csvfile to jsonArray

csv()

.fromFile(req.file.path)

.then((jsonObj)=>{

console.log(jsonObj);

//the jsonObj will contain all the data in JSONFormat.

//but we want columns Test1,Test2,Test3,Test4,Final data as number .

//becuase we set the dataType of these fields as Number in our mongoose.Schema().

//here we put a for loop and change these column value in number from string using parseFloat().

//here we use parseFloat() beause because these fields contain the float values.

for(var x=0;x<jsonObj;x++){

temp = parseFloat(jsonObj[x].Test1)

jsonObj[x].Test1 = temp;

temp = parseFloat(jsonObj[x].Test2)

jsonObj[x].Test2 = temp;

temp = parseFloat(jsonObj[x].Test3)

jsonObj[x].Test3 = temp;

temp = parseFloat(jsonObj[x].Test4)

jsonObj[x].Test4 = temp;

temp = parseFloat(jsonObj[x].Final)

jsonObj[x].Final = temp;

}

//insertmany is used to save bulk data in database.

//saving the data in collection(table)

csvModel.insertMany(jsonObj,(err,data)=>{

if(err){

console.log(err);

}else{

res.redirect('/');

}

});

});

});

//assign port

var port = process.env.PORT || 3000;

app.listen(port,()=>console.log('server run at port '+port));

Step 6: Start App Server

You can use the following command to start the node js app server:

//run the below command

npm start

after run this command open your browser and hit

http://127.0.0.1:3000/

I hope it can help you...

#Node JS