How to send mail with multiple file attachements

I have a ContactForm on my Vue.js app that is used to send emails to my Go backend, everything seems to be working fine except the file uploading.

This is the function that pushes the files to the form.

onFileChanged (e) {
  this.files = new FormData()
  for (let i in e.target.files) {
    if (e.target.files[i].type) {
      let file = e.target.files[i]
      this.form.files.push(file)
    }
  }
},

And this is the function that sends the data to my Backend

async sendMail () {
          try {
            await axios.post(process.env.API_URL + '/api/email',this.form, this.to)
            this.$awn.success(this.$t('message_sent'))
            this.error = false
            this.processed = false
            this.response = true
          } catch (e) {
            this.$awn.alert(e.response.data.message)
            this.error = true
            this.processed = false
          }
},

If I send the form without file attachments everything works fine.

When i attach one or multiple files and console.log the form, the files are present in the form data as an array but the files array in the request is empty.

Console logs of the form i’m sending to the API with axios.

enter image description here

Request payload :

{"busy":false,"successful":false,"errors":{"errors":{}},"originalData":{"subject":null,"to":null,"email":null,"message":null,"files":[],"allowedmedia":"gif,png,jpg,jpeg,ogg,mp3,flac,avi,mpg,mpeg,mkv,webm,pdf,txt,odt,ott,ods,ots,odp,otp,odg,otg","human":"test"},"subject":"test","to":"admin@domain.tld","email":"test@test.com","message":"test","files":[{},{}],"allowedmedia":"gif,png,jpg,jpeg,ogg,mp3,flac,avi,mpg,mpeg,mkv,webm,pdf,txt,odt,ott,ods,ots,odp,otp,odg,otg","human":""}

As you can see the files array in the request contains two empty objects [{},{}].

I don’t understand what i did wrong here so any help will be greatly appreciated , thank you.
If you need to see the GO code of the backend just let me know but i’m pretty sure i did something wrong on the frontend.

7 thoughts on “How to send mail with multiple file attachements”

Leave a Comment