how to submit “multipart/form-data” from VueJs

Question

I am using VueJs / axios in frontend and multer in nodejs for a simple file upload to work.

So far all tries has been unsuccessful. While this can be achieved in 1

Answer 1

i have also faced the an issue where i have to send some other info along with image. i would like to share what i did. I am trying to upload image, kind, name and eventID.

let logo1 = new FormData
logo1.append('image', this.logo1)
logo1.append('kind', 'logo1')
logo1.append('name', this.$refs.logo1.files[0].name )
logo1.append('eventID',eventID)


axios.post(`/upload`, logo1,
        
  {
    headers:{
      'Authorization' : `${token}`,
      'Content-Type': `multipart/form-data; boundary=${logo1._boundary}` 
 },    

 }).then((res) => {

     console.log(res)


}).catch((error) => {

    console.log(error)

})

Note: The postdata param format should be (url , FormData) and not (url, {data: FormData})