Essentially, what I have is a form where a user will upload a CSV file.
<form action="/upload" method="POST" enctype="multipart/form-data">
<div class="custom-file">
<input type="file" class="custom-file-input" id="customFile" name="file" required>
<label class="custom-file-label" for="customFile">Choose file</label>
</div>
<input type="submit" class="btn btn-primary btn-block">
</form>
FYI: I'm using getbootstrap.com as my style sheet.
Now, the form sends a POST request to /upload which is where my node.js code is. What I need is for the server to parse this CSV file and extract the data. I've got no idea what to do as all the different NPM packages such as Multer are using a system where the save the file locally and then parse it.
Edit: Forgot to mention this, but temporary local CSV hosting is not an option.
I need the client to upload server to process it and push to a DB, can't save the file locally anywhere.
Edit 2: I've used multer and the memory processing option and have gotten the following.
const express = require("express");
const app = express();
var bodyParser = require("body-parser");
var multer = require('multer');
var storage = multer.memoryStorage();
var upload = multer({ storage: storage });
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());
app.use(express.static("public"));
app.get("/", function(req, res) {
response.sendFile(__dirname + "/views/index.html");
});
app.post("/upload", upload.single('file'), async (req, res) => {
res.send(req.file)
});
const listener = app.listen(process.env.PORT, function() {
console.log("Your app is listening on port " + listener.address().port);
});
Now once I upload the file, I'm getting the following response (this is what req.file is).
{"fieldname":"file","originalname":"tech.csv","encoding":"7bit","mimetype":"application/octet-stream","buffer":{"type":"Buffer","data":[67,76,65,83,83,32,73,68,44,84,69,67,72,32,35,44,70,73,82,83,84,32,78,65,77,69,44,76,65,83,84,32,78,65,77,69,13,10,54,79,44,54,79,48,49,44,65,110,105,115,104,44,65,110,110,101]},"size":56}
So It's pretty clear that our data happens to be
67,76,65,83,83,32,73,68,44,84,69,67,72,32,35,44,70,73,82,83,84,32,78,65,77,69,44,76,65,83,84,32,78,65,77,69,13,10,54,79,44,54,79,48,49,44,65,110,105,115,104,44,65,110,110,101
but how do I process that? The csv file data was
CLASS ID,TECH #,FIRST NAME,LAST NAME
6O,6O01,Anish,Anne
So how do I go from the information provided in the buffer data attribute to the actual data?
All you have to use is Multer. Multer will return a buffer object which you can then make a string with the .toString() attribute.
Code:
const express = require("express");
const app = express();
var bodyParser = require("body-parser");
var multer = require('multer');
var storage = multer.memoryStorage();
var upload = multer({ storage: storage });
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());
app.use(express.static("public"));
app.get("/", function(request, response) {
response.sendFile(__dirname + "/views/index.html");
});
app.post("/upload", upload.single('file'), async (req, res) => {
var b = req.file["buffer"]
console.log(b.toString())
res.send(b.toString())
});
const listener = app.listen(process.env.PORT, function() {
console.log("Your app is listening on port " + listener.address().port);
});
My code is extremely simple and almost follow the tutorial on Multer git, but my req.file is still undefined:
Here's my html to upload the image:
<form action="/product/upload_image" enctype="multipart/form-data" method="POST">
<input id="product_image" type="file" name="product_image" accept=".png,.jpg,.jpeg"/>
<input type="submit" value="Upload image"/>
</form>
My routes:
var multer = require("multer")
var upload = multer({ dest: "uploads/" })
router.post("/product/upload_image", upload.single("product_image"), function(req, res) {
console.log(req.file)
}
And it returns undefined
Server.js
const express = require('express');
const app = express()
const path = require('path')
const indexRouter = require('./index.js')
app.use('/', indexRouter)
const PORT = 5000;
app.listen(PORT, () => console.log('it started on 5000'))
index.js
const express = require('express');
const router = express.Router()
var multer = require("multer")
var upload = multer({ dest: "uploads/" })
router.get('/', (req, res) =>
res.sendFile('upload.html', {root: __dirname })
)
router.post("/product/upload_image", upload.single("product_image"), (req, res)=>
console.log(req.file)
)
module.exports = router
upload.html
<form action="/product/upload_image" enctype="multipart/form-data" method="POST">
<input id="product_image" type="file" name="product_image" accept=".png,.jpg,.jpeg"/>
<input type="submit" value="Upload image"/>
</form>
I tried your code. It's working fine. Please try this.
I want to send a file with express-busboy. On the readme it says that you can use req.body. So i did. The regular inputs worked, but the file inputs just returned the name of the file i uploaded. I uploaded the file called myfile.png and in the textinput, i put the value of 'Hello World'. I want the send the file that i upload to a folder called mydir (which is in ./). Here is a sample of code:
//js:
const express = require('express');
const mysql = require('mysql');
const bp = require('body-parser');
const session = require('express-session');
const uc = require('upper-case');
const busboy = require('express-busboy');
const fs = require('fs');
const util = require('util');
const app = express();
app.use(bp.urlencoded({ extended: true }));
busboy.extend(app, {
upload: true,
path: './mydir'
});
app.post('/somewhere', (req, res) => {
console.log(req.body.textinput);
//returns the 'Hello World'
console.log(req.body.imginput);
//returns 'myfile.png'
});
<html>
<body>
<form action="/somewhere" method="post" enctype="multipart/form-data">
<input type="text" name="textinput">
<input type="file" name="imginput" accept='image/*'>
</form>
</body>
</html>
I have written a html form and trying to retrieve the values in node js server.
<form action="/newPost" method="post">
First Name: <br>
<input type="text" name="firstname" value="Mickey"><br>
Last name:<br>
<input type="text" name="lastname" value="Mouse"><br><br>
<input type="submit" value="Submit">
</form>
var express = require('express');
var bodyParser = require('body-parser');
const hbs = require('hbs');
var {ObjectID} = require('mongodb');
var {mongoose} = require('./db/mongoose');
var {Todo} = require('./models/todo');
var {User} = require('./models/user');
var app = express();
hbs.registerPartials(__dirname + '/views/partials');
app.set('view engine', 'hbs');
app.use(bodyParser.json());
const port = process.env.PORT || 3000;
app.post('/newPost', (req, res) =>{
console.log(req.body.text);
console.log(req.params.firstname);
console.log(req.body.firstname);
res.send(req.body.firstname);
});
expecting mickey but shows undefined
var multer = require('multer');
var mwMulter1 = multer({ dest: './uploads1/' });
app.post('/files1', mwMulter1, function(req, res) {
// check req.files for your files
});
var mwMulter2 = multer({ dest: './uploads2/' });
app.post('/files2', mwMulter2, function(req, res) {
// check req.files for your files
});
app.post('/test', function(req, res){
var name = req.body.name;
console.log("Name is --- "+name);
res.json("name sent to server");
});
Whenever using multiple instances of multer then post data is not getting it is displayed undefined format.
You need use multer middleware. Try this:
app.js:
var express = require('express');
var app = express();
var bodyParser = require('body-parser');
app.use(bodyParser());
app.get('/', function (req, res) {
require('fs').readFile('index.html', function(error,d) {
res.send(d.toString());
});
});
var multer = require('multer');
var mwMulter1 = multer({ dest: './uploads1/' }).single("name");
app.post('/files1', mwMulter1,function( req,res){
console.log(req.file);
res.end();
});
var mwMulter2 = multer({ dest: './uploads2/' }).array("name[]",2);
app.post('/files2', mwMulter2, function(req, res) {
console.log(req.files);
res.end();
});
app.post('/test', function(req, res){
var name = req.body.name;
console.log("Name is --- "+name);
res.json("name sent to server");
});
var server = app.listen(3000, function () {
var host = server.address().address;
var port = server.address().port;
console.log('Example app listening at http://%s:%s', host, port);
});
index.html:
Action: test
<form name="fileupload" action="test" method="POST" enctype="multipart/form-data">
<input name="name" type="file"/>
<button>submit</button>
</form>
<hr/>
Action: files1
<form name="fileupload2" action="files1" method="POST" enctype="multipart/form-data">
<input name="name" type="file"/>
<button>submit</button>
</form>
<hr/>
Actions: files2
<form name="fileupload3" action="files2" method="POST" enctype="multipart/form-data">
<input name="name[]" type="file"/><br/>
<input name="name[]" type="file"/>
<button>submit</button>
</form>