I am facing problem with uploading files using node.js and express framework.
Below is my app.js code:
var express = require('express');
var fs = require('fs');
var busboy = require('connect-busboy');
var app = express();
app.use(busboy());
app.post('/fileupload', function(req, res) {
var fstream;
console.log(req.filename);
req.pipe(req.busboy);
req.busboy.on('file', function (fieldname, file, filename) {
console.log("Uploading: " + filename);
fstream = fs.createWriteStream(__dirname + '/public/' + filename);
file.pipe(fstream);
fstream.on('close', function () {
res.redirect('back');
});
});
});
HTML code is
<form id="uploadForm" enctype="multipart/form-data" action="/fileupload" method="post">
<div class="azureD" style="display:none;">
<div class="pull-left">
<label class="labelTemp">Subscription ID</label>
<div class="clickRole addStoTabWid">
<input type="text" id="" placeholder="" style="border:none;width:100%;">
</div>
</div>
<div class="pull-left">
<label class="labelTemp">Upload .pem file</label>
<div class="clickRole addStoTabWid">
<input type="file" name="file" id="file" placeholder="" style="border:none;width:100%;">
</div>
</div>
<div class="modal-footer">
</br>
<input type="submit" value="Upload" name="submit">
</div>
</form>
I am getting the fallowing error in node.js console
TypeError: Cannot read property 'on' of undefined
at IncomingMessage.Readable.pipe (_stream_readable.js:495:7)
at C:\Users\sangamesh.b\Desktop\release-2\Rapid_cloud\app.js:138:9
at callbacks (C:\Users\sangamesh.b\Desktop\release-2\Rapid_cloud\node_modules\express\lib\router\index.js:161:37)
at param (C:\Users\sangamesh.b\Desktop\release-2\Rapid_cloud\node_modules\express\lib\router\index.js:135:11)
at pass (C:\Users\sangamesh.b\Desktop\release-2\Rapid_cloud\node_modules\express\lib\router\index.js:142:5)
at Router._dispatch (C:\Users\sangamesh.b\Desktop\release-2\Rapid_cloud\node_modules\express\lib\router\index.js:170:5)
at Object.router (C:\Users\sangamesh.b\Desktop\release-2\Rapid_cloud\node_modules\express\lib\router\index.js:33:10)
at next (C:\Users\sangamesh.b\Desktop\release-2\Rapid_cloud\node_modules\express\node_modules\connect\lib\proto.js:190:15)
at Object.methodOverride [as handle] (C:\Users\sangamesh.b\Desktop\release-2\Rapid_cloud\node_modules\express\node_modules\connect\lib\middleware\methodOverride.js:37:5)
at next (C:\Users\sangamesh.b\Desktop\release-2\Rapid_cloud\node_modules\express\node_modules\connect\lib\proto.js:190:15)
_stream_readable.js:505
dest.end();
^
TypeError: Cannot read property 'end' of undefined
at IncomingMessage.onend (_stream_readable.js:505:9)
at IncomingMessage.g (events.js:199:16)
at IncomingMessage.emit (events.js:129:20)
at _stream_readable.js:908:16
at process._tickDomainCallback (node.js:381:11)
I have checked with everything i am not able fix this issue with my code please help me in this issue.
And i want to know any other alternative ways are there upload the file from the browser and store it into mongodb or localdisk
Use the following snippet. It works for you
var upload_path = path.resolve(__dirname + '../../../public/uploads');
var result = {
status: 0,
message: '',
data: ''
};
fs.readFile(req.files.file.path, function (err, data) {
var imageName = Date.now() +"_"+req.files.file.name;
/// If there's an error
if(err){
//error
} else {
var newPath = path.resolve(upload_path, imageName);
fs.writeFile(newPath, data, function (err) {
if(err) {
//error
} else {
fs.unlink(req.files.file.path, function() {
if (err) {
result.status = -1;
result.message = err;
} else {
result.data = imageName;
}
res.jsonp(result);
});
}
});
}
});
It looks like fstream is undefined as file.pipe() is causing the error. Make sure the filepath being passed into fs.createWriteStream() is correct.
Related
Getting req.param undefined
Hi, I have a similar error to the one above.
server.get('/:file_id', function(req , res) {
var file_id = req.params.id;
console.log(file_id);
gfs.files.find({_id: file_id}).toArray(function (err, files) {
if (err) {
res.json(err);
}
if (files.length > 0) {
var mime = files[0].contentType;
var filename = files[0].filename;
res.set('Content-Type', mime);
res.set('Content-Disposition', "inline; filename=" + filename);
var read_stream = gfs.createReadStream({_id: file_id});
read_stream.pipe(res);
} else {
res.json(file_id+ ' This file does not exist.');
}
});
});
Below is a ejs file that gets file_id to server.
<div class="card card-body mb-3">
<%= file.filename %>
<form action="/:<%= file._id %>" method="get">
<input type="submit" value="DOWNLOAD" class="btn btn-primary btn-block">
</form>
</div>
What I get from this code is : "undefined This file does not exist."
I think the problem lies on req.params.id but am not sure where to fix.
Thank you.
I have an error when I send data from client side (angular.js) to server side (node.js).
I created a form that the user insert data then my controller get the data and sent it to the server to save the data in mongoose and s3(amazon).
I must say that it works fine - I mean I can save all the information I need, I can see it in my DB and I can see the image on s3
but, I get an error : POST http://localhost:3000/upload 500 (Internal Server Error)
my html form:
<html ng-app="mymed">
<head>
<title>insert</title>
</head>
<body ng-controller="tryController">
<main>
<body>
<form class="form-group" enctype="multipart/form-data" method="POST" action="http://localhost:3000/upload">
<label for="inputEmail3" class="col-sm-2 control-label">Title:</label>
<input class="form-control" type="text" placeholder="Title" ng-model="Title" name="Title" required></input>
</div>
<div class="col-sm-10">
<br>
<input type="file" name="file" accept="image/*" ng-modle="file"></input>
</div>
</div>
<input type="submit" class="btn btn-default" name="send" ng-click="createInsert()"></input>
</form>
.....
<script src="js/appController.js"></script>
my controller:
mymedical.controller('tryController',['$scope','$http','$cookies', function($scope,$http,$cookies){
$scope.createInsert = function(){
var data = {};
data.Title = $scope.Title;
data.file = $scope.file;
$http.post('http://localhost:3000/upload', JSON.stringify(data)).then() //callback
}
}]);
sever side:
exports.saveDatatry=function(request, response){
console.log(request.body);
var file = request.files.file;
var hash = hasher();
var stream = fs.createReadStream(file.path)
var mimetype = mime.lookup(file.path);
console.log(stream);
var req;
if (mimetype.localeCompare('image/jpeg')
|| mimetype.localeCompare('image/pjpeg')
|| mimetype.localeCompare('image/png')
|| mimetype.localeCompare('image/gif')) {
req = client.putStream(stream, hash+'.png',
{
'Content-Type': mimetype,
'Cache-Control': 'max-age=604800',
'x-amz-acl': 'public-read',
'Content-Length': file.size
},
function(err, result) {
var savePerTry = new personal({
Title: request.body.Title,
file: req.url
});
savePerTry.save(function(error, result) {
if (error) {
console.error(error);
} else {
console.log("saved!");
response.redirect('http://localhost:8080/tryinsert.html');
};
})
});
} else {
console.log(err);
}
}
What I need to do?
Thanks,
Here's your problem:
function(err, result) {
var savePerTry = new personal({
Title: request.body.Title,
file: req.url
});
Every time you write something like:
function(err, result) {
then the very next line should be:
if (err) {
// ...
}
When you don't handle the errors you will get 500 internal server errors and you will not know what's wrong.
Always handle errors.
I have a CMS for a food automation system and I'm going to add a part for upload pictures for foods:
<form method="post" enctype="multipart/form-data" action="/upload">
<td><input class="styleFormForAddProducts foodpicForAddFood" type="file" name="file"></td>
<td><input class="styleFormForAddProducts submitForAddFood" type="submit" value="Submit" ></td>
</form>
I wrote this code for making a POST request in Express.js:
app.post('/upload', function (req, res) {
var tempPath = req.files.file.path,
targetPath = path.resolve('./uploads/image.png');
if (path.extname(req.files.file.name).toLowerCase() === '.png') {
fs.rename(tempPath, targetPath, function(err) {
if (err)
throw err;
console.log("Upload completed!");
});
} else {
fs.unlink(tempPath, function () {
if (err)
throw err;
console.error("Only .png files are allowed!");
});
}
});
However when I define this app.use, I get an error:
Middleware: app.use(express.bodyParser({uploadDir:'/img'}));
Error: Error: Most middleware (like bodyParser) is no longer bundled with Express and must be installed separately. Please see https://github.com/senchalabs/connect#middleware.
When I define a middleware like this :
app.use(bodyParser({uploadDir:'/img/'}));
I don't have any errors but my code doesn't work correctly .
This solution worked for me :
multer = require('multer'),
upload = multer({ dest: 'views/img' });
app.post('/upload',upload.single('file'), function (req, res) {
});
And my form HTML form :
<form method="post" enctype="multipart/form-data" action="/upload">
<input class="styleFormForAddProducts foodpicForAddFood" type="file" name="file">
<input class="styleFormForAddProducts submitForAddFood" type="submit" value="Submit" >
</form>
I try to save an image using ParseFile in js sdk and I retrieve this error:
TypeError: Cannot call method 'then' of undefined
at Object.Parse.File.save (/PATH_TO_PROJECT/node_modules/parse/build/parse-latest.js:4281:43)
at null.<anonymous> (/PATH_TO_PROJECT/node_modules/parse/build/parse-latest.js:5984:21)
here is my ejs code:
<form class="basic-grey" action="/confirm" method="post" enctype="multipart/form-data">
<input id="picture" name="picture" type="file" class="button"</input>
</form>
controller:
confirm: function (req, res) {
var file = new Parse.File(req.files.picture.name, req.files.picture);
file.save().then(function(file) {
console.log('FILE: '+ file);
}, function(error) {
console.log('ERROR: '+ error.message);
});
}),
req.files.picture is defined, I don't understand why save does not work.
Could you help me ?
To save uploaded file to a specific location use the following
var fs = require('fs');
fs.readFile(req.files.picture.path, function (err, data) {
fs.writeFile('pathYouWantToSaveFile', data, function(err, result){
// done
// delete the file from temp location
fs.unlink(req.files.picture.path);
});
});
NB: req.file.picture.path is the temporary location where the file is uploaded.
to make use Parse.File you can try the following (not tested though).
var fs = require('fs');
fs.readFile(req.files.picture.path, function (err, data) {
var file = new Parse.File('pathYouWantToSaveFile', data);
file.save().then(function(file) {
console.log('FILE: '+ file);
}, function(error) {
console.log('ERROR: '+ error.message);
});
});
I have this code in order to upload files with node.js:
app.use(express.bodyParser());
// or, as `req.files` is only provided by the multipart middleware, you could
// add just that if you're not concerned with parsing non-multipart uploads,
// like:
app.use(express.multipart());
app.get('/',function(req,res){
fs.readFile('uploadHTML.html',function (err, data){
res.writeHead(200, {'Content-Type': 'text/html','Content-Length':data.length});
res.write(data);
res.end();
});
});
app.post('/upload',function(req,res)
{
console.log(req.files);
fs.readFile(req.files.displayImage.path, function (err, data) {
// ...
var newPath = __dirname;
fs.writeFile(newPath, data, function (err) {
res.redirect("back");
});
});
});
Here is the HTML file:
<html>
<head>
<title>Upload Example</title>
</head>
<body>
<form id="uploadForm"
enctype="multipart/form-data"
action="/upload"
method="post">
<input type="file" id="userPhotoInput" name="displayImage" />
<input type="submit" value="Submit">
</form>
<span id="status" />
<img id="uploadedImage" />
</body>
</html>
When I upload the file, it gives me the next error:
TypeError: Cannot read property 'displayImage' of undefined at c:\NodeInstall\nodejs\express.js:42:22 at callbacks (c:\NodeInstall\nodejs\node_modules\express\lib\router\index.js:164:37) at param (c:\NodeInstall\nodejs\node_modules\express\lib\router\index.js:138:11) at pass (c:\NodeInstall\nodejs\node_modules\express\lib\router\index.js:145:5) at Router._dispatch (c:\NodeInstall\nodejs\node_modules\express\lib\router\index.js:173:5) at Object.router (c:\NodeInstall\nodejs\node_modules\express\lib\router\index.js:33:10) at next (c:\NodeInstall\nodejs\node_modules\express\node_modules\connect\lib\proto.js:193:15) at Object.expressInit [as handle] (c:\NodeInstall\nodejs\node_modules\express\lib\middleware.js:30:5) at next (c:\NodeInstall\nodejs\node_modules\express\node_modules\connect\lib\proto.js:193:15) at Object.query [as handle] (c:\NodeInstall\nodejs\node_modules\express\node_modules\connect\lib\middleware\query.js:45:5)
What could be the reason?
I do recommend you to use awesome module https://github.com/domharrington/fileupload for handling file uploads in node/express.
var fileupload = require('fileupload').createFileUpload('/uploadDir').middleware
app.post('/upload', fileupload, function(req, res) {
// files are now in the req.body object along with other form fields
// files also get moved to the uploadDir specified
})
Another way to upload files could be using something like this
Jade template
form.data(action='/user/register', method='post', class="long-fields", enctype='multipart/form-data')
input(type="text" name="name")
input(name='fileLogo', type='file')
input(type="submit" value="Register")
Controller
formidable = require('formidable'); //file upload handling via form
uuid = require('node-uuid'); //Unique ID
path = require('path'); //Path compiler
fs = require('fs'); //FileSystem
var form = new formidable.IncomingForm();
form.keepExtensions = false;
form.maxFieldsSize = 2 * 1024 * 1024; //2mb
form.parse(req, function(err, fields, files) {
console.log(fields);
console.log(files);
fs.readFile(files.fileLogo.path, function (err, data) {
var pathNew = __dirname + '/../../uploads/' + uuid.v1() + path.extname(files.fileLogo.name)
fs.writeFile(pathNew, data, function (err) {
console.log('uploaded', pathNew);
});
});
res.send(jade.renderFile( settings.pathLess + prefix + '/register.jade', {
req : req
}));
});