Uploading image does not seem to grab file.

I’m working on getting image uploads to work with react and multer. However multer doesn’t seem to get a req.file key, only finds req.body.photo key and holds the value '[object File]' when I console it out. Multer goes ahead and create the folders specified in destination but does not store the image there (I’m guessing because it doesn’t have req.file). If you know what the problem is please reply, and in case you interested in SoF points heres a link: http://stackoverflow.com/questions/37473634/uploading-images-with-fetch-to-express-using-multer

server.js

var storage = multer.diskStorage({
        destination: './public/users',
        filename: function (req, file, cb) {
            switch (file.mimetype) {
                case 'image/jpeg':
                    ext = '.jpeg';
                    break;
                case 'image/png':
                    ext = '.png';
                    break;
            }
            cb(null, file.originalname + ext);
        }
    });

var upload = multer({storage: storage});

app.use(upload.single('photo'));

app.post('/uploadUserImage', function (req, res) {
    console.log(JSON.stringify(req.body.photo)) // form fields
    console.log(req.photo) // form files
    console.log(req.file) // form files
    res.send(req.body.photo);
});

client.js

    function uploadImage (image) {
      var formData = new FormData();
      formData.append('photo', image);
      fetch('http://localhost:8080/uploadUserImage/', {
        method:'POST',
         body: formData
      });
    }

[LinusU]

Seems like this was a client problem that can be solved by the code linked, happy to reopen if we should change something in Multer

[gjsjy]

Finally, i have got something going with this issue. Processing filelist field like this will send the required payload to server by browser, it was an issue with front end and not multer.

Object.keys(data).forEach(( key ) => {
      if (data[key] instanceof FileList) {
        body.append(key, data[key][0], data[key][0].name);
      } else {
        body.append(key, data[key]);
      }
    });