Using formData in Javascript instead of <form> to upload image


#1

Hi,

I’m not familiar with the html form method of posting.

I’m trying to upload an image to uploadcare.

<form method="POST" enctype="multipart/form-data"
  action="https://upload.uploadcare.com/submit/">
  <input type="hidden" name="UPLOADCARE_PUB_KEY" value="demopublickey">
  <input type="hidden" name="UPLOADCARE_ACTION" value="https://my-app.com/my-form-handler/">
  <input type="file" name="my-file">
</form>

Ive changed this to

formData.append('file', file);
formData.append('UPLOADCARE_PUB_KEY', 'XXXXXXXXXX');
formData.append('UPLOADCARE_ACTION', 'http://localhost:3000/server/file/');

But I am getting an error

{error: "Unexpected token < in JSON at position 0", text: "<form action="http://localhost:3000/server/file/" method="post" id="frm">
      <input type="hidden" name="file" value="XXXXXXXX">
  <input type="submit" value="Proceed">
</form>
<script>document.getElementById('frm').submit();</script>
"}

#2

Hi!

If you’re using uploading with formData, you need to have a handler which will resubmit the form with file UUID:

I think in your case, the proper way is to use uploads in request. See the documentation here: