I am working on Node.js and trying to handle multiple image.
I am using following code to upload a single image and then saving the path in string format to the database.
var multiparty = require("multiparty");
var form = new multiparty.Form();
form.parse(req, function(err, fields, files) {
var img = files.image[0];
var fs = require('fs');
fs.readFile(img.path, function(err, data) {
var path = "/path/to/upload/" + img.originalFilename;
fs.writeFile(path, data, function(error) {
if (error) console.log(error);
});
});
})
Now how to handle multiple image.
Any help will be appreciated!
var express = require('express'),
app = express(),
formidable = require('formidable'),
util = require('util'),
fs = require('fs-extra'),
bodyparser=require('body-parser'),
qt = require('quickthumb'),
path = require('path');
var mongoose = require('mongoose');
mongoose.connect('mongodb://localhost/db');
var Images = require('./model.js');
app.use(qt.static(__dirname + '/'));
app.use(bodyparser());
app.set('view engine','ejs');
app.post('/upload',function (req, res){
var form = new formidable.IncomingForm();
form.parse(req, function(err, fields, files) {
});
form.on('field',function(name,value){
});
form.on('end', function(fields, files) {
for(var x in this.openedFiles)
{
//Images is my model
var img = new Images();
var temp_path = this.openedFiles[x].path;
/* The file name of the uploaded file */
var file_name = this.openedFiles[x].name;
//console.log('file '+file_name);
img.size = this.openedFiles[x].size;
img.type = this.openedFiles[x].type;
/* Location where we want to copy the uploaded file */
var new_location = 'uploads/';
console.log(img.nam=new_location+file_name);
img.save(function(err,imgobj) {
if (err)
throw err;
});
//to copy the file into a folder
fs.copy(temp_path, new_location + file_name, function(err) {
if (err) {
console.log(err);
}
});//fscopy
}//for loop
});//form end
res.send('Done!!');
});//post
app.listen(3000);
console.log('started server');
Related
I am uploading a file using this form and by the time xhr submits it the server does not recognize req.xhr === true, as such I can not process the file upload. What am I missing?
<form encType="multipart/form-data" method="post">
<Button onClick={(event)=>startUploadFile(event)} type="button">Upload</Button>
<input type="file" name="file" id="file" multiple="multiple" onChange={onChangeHandler} />
</form>
Client side
const [upFile, setUpFile] = useState('')
const onChangeHandler = event => {
setUpFile(event.target.files[0]);
}
const startUploadFile = e => {
setSpin('visible')
setMsg(`Uploading Media ...`)
e.preventDefault()
const data = new FormData()
data.append('file', upFile)
var formData = new FormData();
var xhr = new XMLHttpRequest();
var onProgress = function(e) {
if (e.lengthComputable) {
var percentComplete = (e.loaded/e.total)*100;
console.log('percentage = ' + percentComplete)
}
};
formData.append('files', upFile); // this is a state object set onChange
xhr.open('post', '/upload', true);
xhr.addEventListener('error', onError, false);
xhr.addEventListener('progress', onProgress, false);
xhr.send(formData);
xhr.addEventListener('readystatechange', onReady, false);
}
Server side
const express = require('express'),
app = express.Router(),
cors = require('cors'),
fs = require('fs-extra');
app.use(cors())
app.post('/uploadFile', (req, res) => {
if (req.xhr || req.headers.accept.indexOf('json') > -1) {
// not accepted (req.xhr is false always) why?
}
});
In expressjs you need to install multer or formidable package to upload file from client side application then you will receive your file in req.files object.
Thanks to #Nikas for the remarks - here is working solution if anyone needs it or something like it.
For the client side:
const startUploadFile = e => {
setSpin('visible')
setMsg(`Uploading Media ...`)
e.preventDefault()
const data = new FormData()
data.append('file', upFile)
var formData = new FormData();
var xhr = new XMLHttpRequest();
var onProgress = function(e) {
if (e.lengthComputable) {
var percentComplete = (e.loaded/e.total)*100;
console.log('% uploaded:' + percentComplete)
}
};
var onReady = function(e) {
console.log('ready')
};
var onError = function(err) {
console.log('something went wrong with upload');
};
formData.append('files', upFile); // this is a state object set onChange
xhr.open('post', '/media/uploadFile', true);
xhr.addEventListener('error', onError, false);
xhr.addEventListener('progress', onProgress, false);
xhr.send(formData);
xhr.addEventListener('readystatechange', onReady, false);
}
server side:
const express = require('express'),
app = express.Router(),
cors = require('cors'),
fs = require('fs-extra'),
formidable = require('formidable');
app.post('/uploadFile', (req, res) => {
const path = './client/public/upload/';
var form = new formidable.IncomingForm();
form.uploadDir = path;
form.encoding = 'binary';
form.parse(req, function(err, fields, files) {
if (err) {
console.log(err);
res.send('upload failed')
} else {
var oldpath = files.files.path;
var newpath = path + files.files.name;
fs.rename(oldpath, newpath, function (err) {
if (err) throw err;
res.send('complete').end();
});
}
});
})
I can upload a file via postman and download a file from server in two different service .. But what i need is ..In a single call i should able to upload the file to server ,then perform some operation after performing some operation i should able to download the file automatically.
Here is my code.
My firsts service(file upload operation)
var express = require('express');
var fs = require('fs');
var formidable = require('formidable');
var router = express.Router();
/* GET home page. */
router.post('/', function(req, res, next) {
var form = new formidable.IncomingForm();
form.uploadDir="./file"
form.keepExtensions=true;
form.maxFileSize=10*1024*1024;
form.multiples=false;
form.parse(req, function (err, fields, files) {
res.write('File uploaded');
res.end();
});
});
module.exports = router;
Download service
var express = require('express');
var router = express.Router();
var express = require('express');
router.get('/', function(req, res, next) {
var file = './file/myOutput.txt';
var name = 'ENC.txt'
res.download(file, name);
});
module.exports = router;
Now i need to make this two service as one?
var express = require('express');
var formidable = require('formidable');
var app=express();
async function calculation(parameters)
{
if(parameters)
{
//Here you can do calculation depending upon parameter values
}
else
{
//Display error or as per your choice
}
}
app.get('/',function(req,res){
res.sendFile(__dirname+'/index.html');
});
async function cal(res,file,form)
{
try{
const data = await calculation(true)
if(data){
res.set({
'Location' : __dirname+'/index.html',
});
res.download( __dirname+file.name);
}
}
catch(error)
{
console.log(error);
}
}
app.post('/',function (req,res){
var form = new formidable.IncomingForm();
form.parse(req);
form.on('fileBegin',function(name,file){
file.path = __dirname+file.name;
console.log("Uploading");
});
form.on('file',
function(name,file)
{
console.log('Uploaded ',file.name);
cal(res,file);
});
});
Hope it helps
I am requesting a geoserver from express (node.js) for getting shape zip in wfs service, but I just got text.
var express = require('express');
var router = express.Router();
var fs = require('fs');
var request = require("request");
var DOWNLOAD_DIR = './downloads/';
router.get('/', function(req, res, next) {
var file_url='https://geo.gob.bo/geoserver/aasana/wfs?SERVICE=WFS&VERSION=1.1.0&REQUEST=GetFeature&typeName=aerodromos&outputFormat=shape-zip';
request(file_url, function(err, resp, body) {
console.log('res',res);
console.log('body',body);
if(!err){
var file = fs.createWriteStream(DOWNLOAD_DIR + 'aerodromos');
var buff = new Buffer(body);
file.write(buff,function(err){
console.log(err);
});
file.end();
console.log(' downloaded to ' + DOWNLOAD_DIR);
}else{
console.log("No results error.",err);
}
});
res.render('index', { title: 'descargado' });
});
module.exports = router;
I am trying to put into a file zip but I cant open it.
you need to set encoding to null which will be treated as buffer rather than string in your case
request({url: file_url, encoding: null}, function(err, resp, body) {
I've have to do some maintenace on a Node.js project, and I can't get to upload a image.
I've already seen many post about uploading images into node.js but I can't figure out what happening with my code.
my routes/index.js (like my app.js)
var keystone = require("keystone");
var middleware = require("./middleware");
var importRoutes = keystone.importer(__dirname);
// Common Middleware
keystone.pre("routes", middleware.initLocals);
keystone.pre("render", middleware.flashMessages);
// Import Route Controllers
var routes = {
views: importRoutes("./views")
};
// Setup Route Bindings
exports = module.exports = function (app) {
// Views
app.get("/", routes.views.index);
app.all("/cadastroEvento", routes.views.cadastroEvento);
};
my routes/views/cadastroEvento
var keystone = require("keystone");
var async = require("async");
var env = require("../env");
var Cloudant = require("cloudant");
var multer = require("multer");
var upload = multer({ dest : "/" }).single("file");
// Conexão com o MongoDB
var Evento = keystone.list("Evento");
var mongoDb = require("mongodb");
var MongoClient = mongoDb.MongoClient;
var urlDb = env.urlDb;
exports = module.exports = function (req, res) {
var view = new keystone.View(req, res);
var locals = res.locals;
var url = view.req.originalUrl;
locals.tipo = url.substr(url.indexOf("?") + 1);
locals.section = "cadastroEvento";
locals.formData = req.body || {};
locals.validationErrors = {};
// POST
view.on("post", { action : "cadastroEvento" }, function (next) {
// Seta campos para mensagem de erro
locals.erroNome = false;
locals.erroDataInicio = false;
locals.erroDataFim = false;
locals.erroAoSalvar = false;
locals.erroAoConectar = false;
locals.eventoCadastrado = false;
locals.erroValidacao = false;
// Valida os campos
var validacao = validaCampos(req);
// HERE I DO THE UPLOAD OF THE IMAGE
upload(req, res, function(err)
{
if(err) {
return res.end("Error uploading file." + err);
}
res.end("File is uploaded");
});
console.log("Files: " + JSON.stringify(req.files));
... REST OF CODE NOT RELATED TO THE IMAGE UPLOAD ...
};
In my cadastroEvento.jade I have a form with method='post' enctype="multipart/form-data" and a input type="file" and name="file"
After the post, i receive the message: "File is uploaded"
but no image appears in my folder...
My
console.log("Files: " + JSON.stringify(req.files)); returns this:
Files: {"file":{"fieldname":"file","originalname":"Screenshot_2.png","name":"47707bab7b0b7bf03a882e88f5a0715d.png","encoding":"7bit","mimetype":"image/png","path":"C:\\Users\\JOS-HI~1\\AppData\\Local\\Temp\\47707bab7b0b7bf03a882e88f5a0715d.png","extension":"png","size":7895,"truncated":false,"buffer":null}}
Any help on where is my error would be appreciated.
Thanks
I have a problem to give a name to a controller to load my models:
my app.js
var express = require('express');
var app = express();
app.everyauth = require('everyauth');
app.mongoose = require('mongoose');
var fs = require('fs');
var config = require('./config.js')(app, express);
//Include models
var models = {};
fs.readdir(__dirname + '/models', function(err, files){
if (err) throw err;
files.forEach(function(file){
var name = file.replace('.js', '');
models.name = require('./models/' + name)(app.mongoose).model;
});
});
//Include controllers
fs.readdir(__dirname + '/controllers', function(err, files){
if (err) throw err;
files.forEach(function(file){
var name = file.replace('.js', '');
require('./controllers/' + name)(app, models);
});
});
app.listen(process.env.PORT || 3000);
for exemple I have test.js in models
If I want to find something in my db I would like to do:
models.test.find({}, function(err, docs){});
but it doesn't works because test is unknow, I should do
models.name.find({}, function(err, docs){});
So I would replace name by the name of the model
Thanks
Try this;
models[name] = require('./models/' + name)(app.mongoose).model;
If you want to read directory sync mode, you can use
var models = {};
var files = fs.readdirSync(__dirname + '/models');
for(var i in files) {
var name = files[i].replace('.js', '');
models[name] = require('./models/' + name)(app.mongoose).model;
}
// Now, you can use
models.test