Home » Nodejs » Express can't upload file, req.files is undefined

Express can't upload file, req.files is undefined

Posted by: admin November 29, 2017 Leave a comment

Questions:

I really apologize if I’m leaving something out and am totally stupid, but I’ve checked and checked over again a number of times, and the file upload functionality is just not working over here. I made a super minimal app to demonstate. Just generated a new express app with the most up-to-date version (3.4.7) and added the least i could to make a file upload work.

Here’s my app.js file

/**
 * Module dependencies.
 */

var express = require('express');
var http = require('http');
var path = require('path');

var app = express();

// all environments
app.set('port', process.env.PORT || 3000);
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.json());
app.use(express.urlencoded());
app.use(express.methodOverride());
app.use(app.router);
app.use(express.static(path.join(__dirname, 'public')));

// development only
if ('development' == app.get('env')) {
  app.use(express.errorHandler());
}

app.get('/tasks', function(req, res) {
  res.render('form');
});
app.post('/tasks', function(req, res) {
  console.log(req.files);
  res.send('ok');
});

http.createServer(app).listen(app.get('port'), function(){
  console.log('Express server listening on port ' + app.get('port'));
});

exports = module.exports = app;

And here’s my form.jade view file:

doctype html
html
  head
    title Task Upload
  body
    form(action='/tasks', method='post', enctype='multipart/form-data')
      input(name='task', type='file')
      input(type='submit')

Everytime I try to upload a file, req.files logs out undefined. Can anyone save me out from this problem?

Answers:

Add the following in your app.js

app.configure(function(){
app.use(express.methodOverride());
app.use(express.bodyParser({keepExtensions:true,uploadDir:path.join(__dirname,'/files'}));

});

And then try to access as follows;

req.files.task

It is recommended not to use bodyParser, but to simply define the type of handling you want. In your case since its file uploading, you can enable it as follows

   app.configure(function(){
    app.use(express.methodOverride());
    app.use(express.multipart());
   });

You can read about why using bodyParser() is not a good idea in the following link.

http://andrewkelley.me/post/do-not-use-bodyparser-with-express-js.html

Questions:
Answers:

In Express 4, req.files is no longer available on the req object by default.
To access uploaded files on the req.files object, use multipart-handling middleware like busboy, multer, formidable, multiparty, connect-multiparty,.