How to send an http multipart POST request with a Blob in it?

Question

I am using multipart XMLHttpRequest to upload files on a Google Drive account, using the syntax described in google's documentation:

https://developers.google.com/drive/web/manage-uploads#multipart

Here is an simplified example of the request's body.

--delim
Content-Type: application/json; charset=UTF-8

*metadata Json object*

--delim
Content-Type: *datatype*

*data*
--delim--

My problem is:

• I'm using JavaScript
• I have to send the data as a Blob
• I can't use Google's JavaScript API
• It must be compatible with Internet Explorer (at least 9).

As you can see, the request consists of 2 strings, with a blob right in between.
But, if I do a concatenation like "a-" + blob + "-b", I of course get the string "a-[object Blob]-b"

So, how can I send a request that contains my blob, and the metadata?

P.S.: I know that I can send the data alone, and then edit the metadata, but it takes two requests,
one too much...

Answer 1

I found the answer, I had to encode in Base 64 the content of my Blob:

var reader = new FileReader
reader.readAsDataURL(blob)
var data = reader.result;
//don't need type informations
data = data.split(",").pop();

and just after the "Content-Type" value in the second part of the request, I added this line:

'Content-Transfer-Encoding: base64'

and now it works!

and don't worry, in my code I used my FileReader in an asynchronous way, I just simplified here for brevity.