I'm aware that jQuery's ajax method cannot handle downloads, and I do not want to add a jQuery plugin to do this.

I want to know how to send POST data with XMLHttpRequest to download a file.

Here's what I've tried:

var postData = new FormData();

postData.append('cells', JSON.stringify(output));



var xhr = new XMLHttpRequest();

xhr.open('POST', '/export/', true);

xhr.setRequestHeader(X-CSRFToken, csrftoken);

xhr.responseType = 'arraybuffer';

xhr.onload = function (e) {

    console.log(e);

    console.log(xhr);

}

xhr.send(postData);

I'm working with Django, and the file appears to be sending back to the client successfully. In the network tab in Chrome, I can see gibberish in the preview tab (which I expect). But I want to send back a zip file, not a text representation of the zip file. Here's the Django back end:

wrapper = FileWrapper(tmp_file)

response = HttpResponse(wrapper, content_type='application/zip')

response['Content-Disposition'] = attachment; filename=export.zip

response['Content-Length'] = tmp_file.tell()

return response

I've searched this for hours now without finding a proper example on how to do this with XMLHttpRequests. I don't want to create a proper html form with a POST action because the form data is rather large, and dynamically created.

Is there something wrong with the above code? Something I'm missing? I just don't know how to actually send the data to the client as a download.