Question

On Firefox 3.6 and Chrome, using xhr.send(file) just puts the raw contents into the body of the request and it is not a true multipart/form-data upload.

Tried doing this: http://kaply.com/weblog/2010/05/20/post-multipart-form-xhr/

But, can’t really mix string with File contents during send().

Any workarounds?

Answer 1

xhr.sendAsBinary() is non-standard. Instead, use xhr.send(FormData), which does create a multipart/form-data request, allows appending files, and arbitrary form data.

var formData = new FormData();
formData.append(file.name, file);

var xhr = new XMLHttpRequest();
xhr.open('POST', '/upload', true);
xhr.onload = function(e) { ... };

xhr.send(formData);  // multipart/form-data

See http://www.html5rocks.com/en/tutorials/file/xhr2/#toc-send-formdata