Nodejs formidable without causing any events

Question

I'm on express3.x and using formidable

app.post "/up",(req,res)-> formidable = require('formidable') form = new formidable.IncomingForm() form.uploadDir = __dirname + "/uploads" form.encoding = 'binary' form.addListener 'file',(name,file) -> #write file console.log('file uploaded') return console.log('$$$$$$$$$$$') form.addListener 'end', -> console.log('end') res.end() return console.log('@@@@@$$$$') form.parse req,(err,fields,files)-> console.log('parse') console.log(err) if(err) return console.log('######') return 

and upload form

 block content :coffeescript $ -> formData = new FormData() xhr = new XMLHttpRequest() onProgress = (e)-> per_complete = (e.loaded/e.total) * 100 if e.lengthComputable onReady = (e)-> alert("Ready") onError = (err)-> alert("Error Loading "+err) $('#upload').click (e)-> formData.append('img',document.getElementById('img').files[0]) xhr.open('post','/up',true) xhr.addEventListener('error',onError,false) xhr.addEventListener('progress',onProgress,false) xhr.send(formData) xhr.addEventListener('readystatechange',onReady,false) h1 hello world form |select Image: input(type='file',name='img', id='img') input(type='button',value='button', id='upload') 

None of the events are triggered ... Not sure what I lost.

Answer 1

if you use app.use(express.bodyParser()) equivalent to:

 app.use(express.json()); app.use(express.urlencoded()); app.use(express.multipart()); 

you can remove app.use(express.multipart()); then you can use a formidable object.

Answer 2

express uses formidable internally, so your formidable does not receive any events, if you want to use formidable as you wish, you need to remove multipart/form-data from bodyParser

I'm still on express 2.x, but this should also do the trick on 3.x, in your app.configure try function

 app.configure(function(){ delete express.bodyParser.parse['multipart/form-data'] }) 

Now you can use the formidable at your discretion.

Answer 3

Is there a specific reason why you use the formidable rather than the built-in bodyParser ? It uses multipart middleware and is based on the formidable. Therefore, most of the options from formidable can also be applied to bodyParser. For instance:

 app.use(connect.multipart({ uploadDir: path })); 

To answer your question, try the following code:

app.js

 app.configure(function(){ app.set('port', process.env.PORT || 3000); app.set('views', __dirname + '/views'); app.set('view engine', 'jade'); app.use(express.favicon()); app.use(express.logger('dev')); app.use(express.bodyParser()); app.use(express.methodOverride()); app.use(app.router); app.use(express.static(path.join(__dirname, 'public'))); }); app.post("/", function(req, res) { console.log(req.files.img) res.end() }) 

index.jade

 form input(type="file", name="img", id="img") input(type="button", value="button", id="upload") script var formdata = new FormData() var xhr = new XMLHttpRequest() $("#upload").on("click", function(e) { xhr.upload.onprogress = function(evt) { console.log("While sending and loading data.") if (evt.lengthComputable) { console.log (evt.loaded / evt.total * 100); } } xhr.onloadend = function(evt) { console.log("When the request has completed (either in success or failure).") } xhr.onload = function(evt) { console.log("When the request has successfully completed.") } var image = document.getElementById('img').files[0] formdata.append("img", image) xhr.open("POST", "/", true) xhr.send(formdata) }) 

See the W3C specifications for more events.

Answer 4

I had the same issue in which the file was downloaded completely before My controller got arround to process it. Events were fired, but I have not listened yet. To counter this, I wrote middleware to capture file downloads and save them for controller access later.

https://gist.github.com/3813103

you can implement it with

 var fileHandler = require('./middleware/fileHandler'); app.use(fileHandler());