js实现文件流式下载文件方法详解及完整代码

实现文件流式下载文件的方法主要有两种：使用Blob对象和使用流式传输。

方法一：使用Blob对象

首先，我们需要将文件数据转换成Blob对象，然后使用URL.createObjectURL()方法创建URL，将该URL赋值给下载链接的href属性，接着使用a标签的click()方法触发下载操作。

完整代码如下：

function downloadFile(filename, data) {
var blob = new Blob([data]);
var url = URL.createObjectURL(blob);
var a = document.createElement('a');
a.href = url;
a.download = filename;
a.style.display = 'none';
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
URL.revokeObjectURL(url);
}

使用示例：

var filename = 'example.txt';
var data = 'This is some example text.';
downloadFile(filename, data);

方法二：使用流式传输

首先，我们需要创建一个Blob对象，然后使用XMLHttpRequest对象发送GET请求，设置responseType为"blob"，接着在load事件中获取服务器返回的Blob对象，接下来使用a标签的download属性设置文件名，将Blob对象赋值给下载链接的href属性，最后使用a标签的click()方法触发下载操作。

完整代码如下：

function downloadFile(url, filename) {
var xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.responseType = 'blob';
xhr.onload = function() {
if (xhr.status === 200) {
var blob = new Blob([xhr.response]);
var link = document.createElement('a');
link.href = window.URL.createObjectURL(blob);
link.download = filename;
link.click();
}
};
xhr.send();
}

使用示例：

var url = 'http://example.com/example.txt';
var filename = 'example.txt';
downloadFile(url, filename);

以上两种方法都可以实现文件流式下载文件，具体选择哪种方法取决于你的需求和环境。