What I need to do :
I need to open the file in a new tab in Firefox(other browser support isn't important)
That filename needs to match the Content-Disposition.
So I send data in my POST to a server, then I receive a PDF file in response. The headers of the response are (an example):
Content-Type: application/pdf
Access-Control-Expose-Headers: Content-Disposition
Content-Disposition: attachment; filename="file name.pdf"
Content-Length: 234
My response is the PDF file itself.(Blob --> application/pdf)
Also it's possible to have multiple request at the same time
What is done :
Now the file is open in a new window, but with the wrong file name(filename isn't use). Also it's block by Firefox.
My code(not all of it, only the important part):
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
if (this.readyState == 4 && this.status == 201){
var filename = this.getResponseHeader('Content-Disposition').split('=')[1];
filename = filename.substr(1, filename.length-2);
var url = window.URL.createObjectURL(this.response);
window.open(url);
}
};
xhr.open('POST', host + this.getLink('preview', this.collection.jsonSchemaSwapData).href);
xhr.setRequestHeader("Content-type","application/json");
xhr.responseType = 'blob';
xhr.send(JSON.stringify(this.toJSON()));
The problems :
- The browser block the new tab as a Popup(a element, then click on it is also blocked)
- CreateObjectURL doesn't work with file name
- Can't see the pdf in the page, because we can open a few a the same time
