渚  直樹

渚 直樹

1635063660

NodejsのMongoDBにCSVファイルデータをインポートする

このチュートリアルでは、CSVファイルデータをNode js + ExpressのMongoDBにアップロード/インポートする方法を学習します。 

node js + expressチュートリアルを使用してcsvファイルをmongodbにインポートします。また、csvファイルをNode js + expressアプリにアップロードする方法についても学習します。次に、npm CSVTOJSONパッケージを使用してcsvファイルデータを読み取り、ノードjs + expressアプリを使用してmongodbデータベースにインポートします。

Node js + Expressを使用してMongodbでcsvファイルをアップロード/インポートする方法

以下の手順に従い、ノードjs + Expressを使用してCSVファイルをmongodbにインポート/アップロードします。

  • ステップ1-NodeExpressjsアプリを作成する
  • ステップ2– express ejs body-parser mongoose CSVTOJSONMulterモジュールをインストールします
  • ステップ3–モデルを作成する
  • ステップ4–CSVファイルの作成HTMLマークアップフォームのアップロード
  • ステップ5–App.jsにモジュールをインポートする
  • ステップ6– AppServerを起動します

ステップ1-NodeExpressjsアプリを作成する

ターミナルで次のコマンドを実行して、ノードjsアプリを作成します。

mkdir my-app
cd my-app
npm init -y

ステップ2– express ejs body-parser mongoose CSVTOJSONMulterモジュールをインストールします

ターミナルで次のコマンドを実行して、ejs body-parsermongooseの依存関係を表現します。

npm install -g express-generator
npx express --view = ejs


npm install csvtojson mongoose multer body-parser 

body-parser  – Node.jsリクエストボディ解析ミドルウェア。ハンドラーの前に着信リクエストボディを解析し、req.body プロパティで使用できるようにし ます。言い換えれば、それは着信要求を単純化します。

Express-EJS – EJSは  プレーンなJavaScriptでHTMLマークアップを生成するために使用される単純なテンプレート言語です。また、JavaScriptをHTMLページに埋め込むのにも役立ちます

Mongoose – Mongooseは 、非同期環境で動作するように設計された MongoDBオブジェクトモデリングツールです。Mongooseは、promiseとcallbackの両方をサポートしています。

Multer – Multerは 、multipart / form-dataを処理するためのnode.jsミドルウェア であり、主にファイルのアップロードに使用されます。それは最大の効率のためにバスボーイの上に書かれています。

CSVTOJSON – カスタマイズされたパーサーをサポートするcsvデータをJSONに変換することに集中するツール 。

ステップ3–モデルを作成する

Modelsディレクトリを作成し、このディレクトリ内にstudentModel.jsファイルを作成します。次に、次のコードを追加します。

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);  

ステップ4–CSVファイルの作成HTMLマークアップフォームのアップロード

mongoDBデータベースに画像またはファイルをアップロードするためのファイル/画像アップロードHtmlフォームを作成します。したがって、viewsディレクトリにアクセスし、その中にindex.ejsファイルを作成します。次に、次のコードを追加します。

<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>  
</body>  
</html>  

ステップ5–App.jsにモジュールをインポートする

app.jsにexpress、body-parser、mongoose、multerの依存関係をインポートします。以下に示すように:

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));  

ステップ6– AppServerを起動します

次のコマンドを使用して、ノードjsアプリサーバーを起動できます。

//run the below command
npm start
after run this command open your browser and hit 
http://127.0.0.1:3000/

結論

CSVファイルをMongoDBmongoose + node js + Expressにアップロード/インポートします。このチュートリアルを通じて、CSVファイルデータをNode js + ExpressのMongoDBにアップロード/インポートする方法を学びました。 

リンク: https://www.tutsmake.com/node-js-upload-csv-file-to-mongodb-database/

#mongodb #nodejs #csv 

 

What is GEEK

Buddha Community

NodejsのMongoDBにCSVファイルデータをインポートする
渚  直樹

渚 直樹

1635063660

NodejsのMongoDBにCSVファイルデータをインポートする

このチュートリアルでは、CSVファイルデータをNode js + ExpressのMongoDBにアップロード/インポートする方法を学習します。 

node js + expressチュートリアルを使用してcsvファイルをmongodbにインポートします。また、csvファイルをNode js + expressアプリにアップロードする方法についても学習します。次に、npm CSVTOJSONパッケージを使用してcsvファイルデータを読み取り、ノードjs + expressアプリを使用してmongodbデータベースにインポートします。

Node js + Expressを使用してMongodbでcsvファイルをアップロード/インポートする方法

以下の手順に従い、ノードjs + Expressを使用してCSVファイルをmongodbにインポート/アップロードします。

  • ステップ1-NodeExpressjsアプリを作成する
  • ステップ2– express ejs body-parser mongoose CSVTOJSONMulterモジュールをインストールします
  • ステップ3–モデルを作成する
  • ステップ4–CSVファイルの作成HTMLマークアップフォームのアップロード
  • ステップ5–App.jsにモジュールをインポートする
  • ステップ6– AppServerを起動します

ステップ1-NodeExpressjsアプリを作成する

ターミナルで次のコマンドを実行して、ノードjsアプリを作成します。

mkdir my-app
cd my-app
npm init -y

ステップ2– express ejs body-parser mongoose CSVTOJSONMulterモジュールをインストールします

ターミナルで次のコマンドを実行して、ejs body-parsermongooseの依存関係を表現します。

npm install -g express-generator
npx express --view = ejs


npm install csvtojson mongoose multer body-parser 

body-parser  – Node.jsリクエストボディ解析ミドルウェア。ハンドラーの前に着信リクエストボディを解析し、req.body プロパティで使用できるようにし ます。言い換えれば、それは着信要求を単純化します。

Express-EJS – EJSは  プレーンなJavaScriptでHTMLマークアップを生成するために使用される単純なテンプレート言語です。また、JavaScriptをHTMLページに埋め込むのにも役立ちます

Mongoose – Mongooseは 、非同期環境で動作するように設計された MongoDBオブジェクトモデリングツールです。Mongooseは、promiseとcallbackの両方をサポートしています。

Multer – Multerは 、multipart / form-dataを処理するためのnode.jsミドルウェア であり、主にファイルのアップロードに使用されます。それは最大の効率のためにバスボーイの上に書かれています。

CSVTOJSON – カスタマイズされたパーサーをサポートするcsvデータをJSONに変換することに集中するツール 。

ステップ3–モデルを作成する

Modelsディレクトリを作成し、このディレクトリ内にstudentModel.jsファイルを作成します。次に、次のコードを追加します。

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);  

ステップ4–CSVファイルの作成HTMLマークアップフォームのアップロード

mongoDBデータベースに画像またはファイルをアップロードするためのファイル/画像アップロードHtmlフォームを作成します。したがって、viewsディレクトリにアクセスし、その中にindex.ejsファイルを作成します。次に、次のコードを追加します。

<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>  
</body>  
</html>  

ステップ5–App.jsにモジュールをインポートする

app.jsにexpress、body-parser、mongoose、multerの依存関係をインポートします。以下に示すように:

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));  

ステップ6– AppServerを起動します

次のコマンドを使用して、ノードjsアプリサーバーを起動できます。

//run the below command
npm start
after run this command open your browser and hit 
http://127.0.0.1:3000/

結論

CSVファイルをMongoDBmongoose + node js + Expressにアップロード/インポートします。このチュートリアルを通じて、CSVファイルデータをNode js + ExpressのMongoDBにアップロード/インポートする方法を学びました。 

リンク: https://www.tutsmake.com/node-js-upload-csv-file-to-mongodb-database/

#mongodb #nodejs #csv