I'm trying to send an image file to an API from a JavaScript using Axios but viewing the request in the console shows the payload as largely empty.
This is what I'm using to send the request
const formData = new FormData();
formData.append('image', e.files[0], 'logo.png');
axios.request({
url: '/upload',
method: 'post',
data: formData,
headers: {
'Content-Type': 'multipart/form-data'
}
})
The request is being sent, however, the payload for the request is showing only as this
------WebKitFormBoundaryQums9sVMBwuMo7hO
Content-Disposition: form-data; name="image"; filename="logo.png"
Content-Type: image/png
------WebKitFormBoundaryQums9sVMBwuMo7hO--
e.files[0] is a valid File object and I'm able to call text() and slice() on it and see the content. I've tried various image files and it's always the same.
Any help or suggestions would be greatly appreciated.