Unable to upload file image using Ajax and Multer

Question

While uploading a file from ajax request Multer is giving an error that is given below.

TypeError [ERR_INVALID_ARG_TYPE]: The first argument must be one of type string or Buffer. Received type object at rite_ (_http_outgoing.js:595:11)

// code block for multer  start
    var Storage = multer.diskStorage({
        destination: function(req, file, callback) {
            callback(null, "./uploads/posts");
        },
        filename: function(req, file, callback) {
            callback(null, file.fieldname + "_" + Date.now() + "_" + file.originalname);
        }
    });


    var upload = multer({
        storage: Storage
    }).single('imgData');




//route Ajax Rquest URL Start
        router.post('/blog/saveUploadImage',urlencoderParser,(req,res)=>{
          upload(req, res, function(err) {
               if (err) {
                 return res.end({UplaodStatus:true,type:'success',text:' ???? Image Uploaded Now Saving Your Data It will take just a sec.'});
               }
               return res.end({UplaodStatus:false,type:'error',text:' ☹ Sorry There was some Problem Uploading Image '});
           });

        });
        //route Ajax Rquest URL End 

                //JS code  
               // code for geting file
               let fileUpload = document.getElementById('uploadFile').files;

               //appending the file to formdata 
               var formData = new FormData();
                formData.append('imgData', fileUpload);


    //AJAX Request
    $.ajax({
          enctype:'multipart/form-data',
          data:formData,
          url:'/admin/blog/saveUploadImage',
          type:'POST',
          cache:false,
          contentType:false,
          processData:false,
          timeout:10000,
      });

GProst GProst · Accepted Answer · 2019-07-27T21:43:19

You're passing an array of files to formData.append(...), instead you should pick just the first element from this array:

let fileUpload = document.getElementById('uploadFile').files[0];

Unable to upload file image using Ajax and Multer

3 Answers