JavaScript Upload FormData

readme.md

<form id="form">
  <input type="name" name="full_name" />
  <input type="file" name="image" />
  <button type="submit">Submit</button>    
</form>

// Fetch

const form = new FormData(document.querySelector('#form'))

fetch('/', {
  method: 'POST',
  body: form,
  headers: {
    'Content-Type': 'multipart/form-data'
  }
})

// Axios

const form = new FormData(document.querySelector('#form'))

axios.post('/', form)

// The "Content-Type: multipart/form-data" header's will automatically injected by axios.

// Empty FormData

const form = new FormData()
form.append('full_name', 'Mulia Nasution')
form.append('image', document.querySelector('#form input[name="image"]'))

axios.post('/', form)