如何从 xhr 请求中制作浏览器下载文件答案

【问题标题】：How to make browser download file from xhr request如何从 xhr 请求中制作浏览器下载文件
【发布时间】：2017-05-14 01:28:18
【问题描述】：

我正在向服务器发送xhr 请求以下载文件。我将授权令牌包含在请求中，因此如果不使用xhr，我将无法下载文件。当收到来自服务器的响应时，我应该采取哪些步骤让浏览器下载文件？服务器应该包含哪些标头？

【问题讨论】：

您可以将服务器响应填充到数据 URL 中，将其放在 <a download> 上并触发点击。请注意download 属性是not well supported。或者，您可以使用普通表单提交（不是 XHR），将令牌发送到隐藏输入而不是请求标头中。
@Amadan，谢谢。这些是唯一的选择，对吧？
我不会这么说 - 但我能想到的只有这些。
看来this one 可以吗？
是的，这就是“将服务器响应填充到数据 URL 中，将其放在 <a download> 并触发点击”的代码。

标签： javascript xmlhttprequest

【解决方案1】：

这是一段对我有用的代码。我用它来测试，所以它不是我猜的最干净的方式。但它可以显示图片。

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
    var downloadUrl = URL.createObjectURL(xhttp.response);
    var a = document.createElement("a");
    document.body.appendChild(a);
    a.style = "display: none";
    a.href = downloadUrl;
    a.download = "";
    a.click();
}
};
xhttp.open("GET", fileUrl, true);
xhttp.responseType = "blob";
xhttp.setRequestHeader('Authorization', token);
xhttp.send();

这块并不重要，我只是在我的情况下需要它：

xhttp.setRequestHeader('Authorization', token);

此链接也很有用：Sending and Receiving Binary Data

【讨论】：