Multipart form data using XHR - Invalid Request

Question

I'm using FileUploader UI5 element to upload a file using XMLHttpRequest (POST operation), here below is my code snippet -

      var input = document.querySelector('input[type="file"]');
      var data = new FormData();
      data.append("files", input.files[0]);
      var xhr = new XMLHttpRequest();
      xhr.open("POST","https://URL");
      xhr.setRequestHeader('Content-Type', 'multipart/form-data');
      xhr.setRequestHeader("apikey", "XXXXXXXXXXXXXXXXX");
      xhr.setRequestHeader("accept", "application/json");
      xhr.send(data);

But while pushing a request, i am getting below exception. Not sure why my post operation is getting failed, any help would be appreciated.

error description - This service requires at least 1 file. Please put your file(s) into the files field of the POST request"

---

This is how the request header and payload looks like -

Request Header - 

Accept:*/*
Accept-Encoding:gzip, deflate, br
Accept-Language:en-US,en;q=0.8
apikey:RGIukzqxB0GWhRaMMcCTmYGHnEWgk5qI
Connection:keep-alive
Content-Length:15
Content-Type:text/plain;charset=UTF-8
Host:sandbox.api.sap.com
Origin:https://webidetesting2532276-be010f3f7.dispatcher.us1.hana.ondemand.com
Referer:https://webidetesting2532276-be010f3f7.dispatcher.us1.hana.ondemand.com/extended_runnable_file.html?hc_orionpath=%2Fbe010f3f7%24S0015741697-OrionContent%2Fsap.ui.unified.sample.FileUploaderComplex&origional-url=index.html&sap-ui-appCacheBuster=&sap-ui-xx-componentPreload=off
User-Agent:Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.36



Request Payload -
[object Object]

Answer 1

You've explicitly set the Content-Type but it is missing the MIME boundary parameter. Omit the header entirely and allow XHR to infer the Content-Type from the FromData object.