How to upload from BUFFER?

Ask the community
,
52

@chris-derrell
@russian-dima

Ok, I think that there is very little left to win.
Now my HTML-component looking like that:

<html>
<head>
    <script type="text/javascript">
//PART 01
var openFile = function(event) {
    var msg = {fileName:"", fileType:"", content:"", fileSize:"", accepted:""};
    var input = event.target; 
    var reader = new FileReader();
    var fileName = input.files[0].name;   
    var fileType = input.files[0].type; 
    var fileSize = input.files[0].size;
    var accepted = input.accept;

    reader.readAsDataURL(input.files[0]);

    reader.onloadend = function sendmsg(){
      var buffer = reader.result;   
      msg.fileName = fileName; 
      msg.content = buffer; 
      msg.fileType = fileType;
      msg.fileSize = fileSize;
      msg.accepted = accepted;
      window.parent.postMessage(msg,"*");
      console.log("MSG: ", msg)
    };
//PART 02    
    window.onmessage = (event) => {
    console.log(event.data);
    var url = event.data;
    var formData = new FormData();
    formData.append("upload_token", "");
    var file = {
      value: msg.content,
      options: {
        filename: msg.fileName,
        contentType: msg.fileType
      }
    }
    formData.append("file", file);
    let request = new XMLHttpRequest();
    request.open("POST", url);
    request.send(formData);
  };
  };

  </script>
  </head>

<body>
<label class="custom-file-upload" >
   <input type="file" accept='image/*' onchange='openFile(event)' />
  </label>
</body>
</html>

Part 01 - working on reading the image in base64 and sending message to the front.
Part 02 - working on receiving the message from the front with the url to upload to, and preparing data to Post request.

If I run this code now I get
POST https://upload.wixmp.com/upload/eyJhbGciOi… 500 ERROR

I think the problem is in

request.send(formData);

I can not correctly prepare formData for sending.
I would be grateful for any hints!