CODEWITHSUNDEEP
expressmulter
Cayle
Cayle

Reputation: 309

Multer image upload not working - req.file.path undefined

So I wrote a basic multer upload with express and it works if the data is only a file input, if I try to attach an additional piece of text data using formdata.append() it doesn't work, on the server it gives a req.file.path undefined on the server side

Here's my Multer Settings

var upload = multer({ dest: 'uploads/' })

The express.post()

app.post("/rest/OCR", upload.single('image'), function(req, res, next){
  console.log("Receiving File")
  console.log(req.file.path);
}

The HTML Form

<form action='/rest/ocr' id='imageUploadForm' method='post' enctype='multipart/form-data'>
    <input class='vwide upload-button' type='file' name='file'>

    <input type='submit'>
</form>

The JS Call

 $(document.body).on('submit', '#imageUploadForm', function(e){
        e.preventDefault();
        var self = this;
        var data = new FormData();
        data.append('id', cardlob.profile.auth.id);
        data.append('file', $(this)[0]);
        $.ajax({
            processData: false, 
            cache: false,
            async: false, 
            data: data,
            url: "/rest/OCR",
            type: 'POST',
            success: function(data, textStatus, jqXHR){
                var cardDto = JSON.parse(data);
                if(cardDto.vCardFormattedString !== "null"){
                    window.open("/cards/"+cardDto.hash+".vcf");
                }else{
                    $("#textData").append("<h4> No Business Cards Found in image </h4>");
                }
            }
        });
    });

I can't tell what's going on to make this undefined

Upvotes: 0

Views: 1208

Answers (1)

jenjenut233
jenjenut233

Reputation: 1938

The name of the attribute in the .single() call must be the same name as the file input. So in your case, you have in your markup:

<input class='vwide upload-button' type='file' name='file'>

so your router middleware should read: 

app.post("/rest/OCR", upload.single('file'), function(req, res, next){
  console.log("Receiving File")
  console.log(req.file.path);
}

Upvotes: 2

Related Questions