Search code examples
node.jsuploadmulter

Node.js, multer and req.body empty


Here it is my problem, I have a form where I can insert a file and a field but I receive only the file and not the parameter test! Why?

This is my code:

app.js:

var express = require('express');
var bodyParser = require('body-parser');
var app = express();
var port = 8000;
var multer = require('multer'); // v1.0.5
var storage =   multer.diskStorage({
  destination: function (req, file, callback) {
    callback(null, './uploads');
  },
  filename: function (req, file, callback) {
    callback(null, file.originalname.substring(0,file.originalname.lastIndexOf('.')) + '-' + Date.now() + file.originalname.substring(file.originalname.lastIndexOf('.'),file.originalname.length));
  }
});
var upload = multer({ storage : storage}).single('fileUpload');

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: true}));

app.post('/api/upload',function(req,res){
    console.log(req.body);
    upload(req,res,function(err) {
        if(err) {
            return res.end("Error uploading file.");
        }
        res.end("File is uploaded");
    });
});

app.listen(port, function () {
    console.log('Express server inizializzato sulla porta ' + port);
});

index.html:

<html>
    <head>
        <title>Test upload</title>
    </head>
    <body>
        <form name="form" action="http://localhost:8000/api/upload" method="post" enctype="multipart/form-data">
            <input type="text" name="test" />
            <input type="file" name="fileUpload" />
            <input type="submit" value="invia" />
        </form>
    </body>
</html>

Someone can help me?


Solution

  • 2017 Update

    From Readme

    Note that req.body might not have been fully populated yet. It depends on the order that the client transmits fields and files to the server.

    I resolved my issue by reversing the order of my form object properties in the front end:

        var newFormObj  = new FormData();
        newFormObj.append('internalUserID', internalUserID);
        newFormObj.append('listingImage', this.binaryImages[image]);
    

    On the backend:

    var storage = multer.diskStorage({
      destination: function (req, file, cb) {
        console.log(req.body.internalUserID) // YAY, IT'S POPULATED
        cb(null, 'listing-pics/')
      },                    
      filename: function (req, file, cb) {
        cb(null, file.fieldname + '-' + Date.now())
      }                     
    });                     
    
    var upload = multer({ storage: storage });