uploading file using multer is not working fully (NodeJS)

Question

I am using NodeJS express (MVC) and I am trying to upload an image. I am trying to store the image in an uploads folder but nothing is showing up. When I console.log(req.files), I get the following (req.buffer prints out a long series of double digit numbers and letters). How do I get this to save the image in the folder?

 [ 
   { 
     fieldname: 'file',
     originalname: 'thumbnail.jpg',
     encoding: '7bit',
     mimetype: 'image/jpeg',
     buffer: <Buffer ff d8 ff e0 00 10 4a 46 49 46 00 01 01 00 00 01 00 01 00 00 ff db 00 84 00 09 06 07 0d 0d 10 0e 10 0d 0e 0d 0d 0d 0e 10
 0f 0d 0d 0e 0d 0d 0f  0e 0e 0e ... >,
     size: 1347 
   } 
]

HTML:

<form action="/bars/upload" method = 'post' enctype="multipart/form-data">
   <label for='file'>Upload Image</label>
   <input type="file" name="file" accept="image/*"/>
   <input type="submit" name='submit' value="submit"/>
</form>

NODE JS

var multer  = require('multer'); 
var upload = multer({ dest:'../public/uploads/' });

router.post('/bars/upload', function (req, res, next) { 
    console.log(req.files);     
    res.send(req.files); 
});

Taku · Accepted Answer · 2016-11-18 07:49:54Z

multer is basically a middleware that uploads files or convert to some format which could be used later in the handler. So, from examples, you could do this in your case:

var multer = require('multer'); 
var upload = multer({ dest:'../public/uploads/' });

router.post('/bars/upload', upload.single('someFile') ,function (req, res, next) {

    // if you're here, the file should have already been uploaded

    console.log(req.files); 
    console.log(req.body);// {"someParam": "someValue"}
    res.send(req.files); 
});

upload.html

<form action="/bars/upload" method = 'post' enctype="multipart/form-data">
    <label for='file'>Upload Image</label>
    <input type="file" name="someFile" accept="image/*"/>
    <input type="hidden" name="someParam" value="someValue"/>
    <input type="submit" name='submit' value="submit"/>
</form>

If this does not work, you can debug by using command line, which usually helps me determine whether server or client is at fault.

curl --form "someFile=@/path/to/file" -X POST http://localhost:3000/bars/upload

add -I option to show verbose response.

Mihail · Accepted Answer · 2017-11-04 16:24:43Z

2

I had the same problem. I used Postman to make queries to my node app. The problem solved, when I removed http header Content-Type (it was set as urlencoded form).

answered Nov 4, 2017 at 16:24

Mihail

831 silver badge7 bronze badges

3 Comments

Ayo Makanjuola Over a year ago

This was a lifesaver!

CSG0811 Over a year ago

I am not even setting the http header but I am getting it saved in a weird format I have stated the issue here stackoverflow.com/questions/49544671/…

AllJs Over a year ago

@ChinmayGhag if you are using postman to upload your file, you don't need to set your own headers because when you select form-data as a post method, those headers are set automatically for you.

Vfx Master · Accepted Answer · 2018-07-06 01:44:04Z

1

i had the same issue in dest:'../public/uploads/' just remove ../ and write it like this dest:'public/uploads/' thats it

answered Jul 6, 2018 at 1:44

Vfx Master

271 silver badge8 bronze badges

Collectives™ on Stack Overflow

uploading file using multer is not working fully (NodeJS)

3 Answers 3

Comments

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related