[Vuejs]-How to send json parameter and multipart/form-data file in one request with vue

1👍

First of all, this is not a vue related question. There is a solution in this answer though. Another solution (if content-type in request is not a priority) would be to use simple FormData. You can easily insert your image and send the json as a plaintext. This would however require additional parsing / mapping to your model at server side.

0👍

i have also faced the same issue and 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})

Leave a comment