浏览器文件下载，实际项目经验记录！

1.使用JavaScript来实现浏览器文件下载：

function downloadFile(url, filename) {
  // 创建一个隐藏的<a>标签
  var a = document.createElement('a');
  a.style.display = 'none';
  a.href = url;
  a.download = filename;

  // 将<a>标签添加到页面中
  document.body.appendChild(a);

  // 触发<a>标签的点击事件，开始下载文件
  a.click();

  // 移除<a>标签
  document.body.removeChild(a);
}

// 使用示例
downloadFile('http://www.baidu.com/file.txt', 'my.txt');

(1)定义了一个函数，它接受两个参数：文件的URL和要保存的文件名。

(2)该函数创建一个隐藏的<a>标签，将文件的URL和文件名设置为其属性，然后将其添加到页面中。最后，触发<a>标签的点击事件，浏览器会自动下载文件。

(3)下载完成后，我们将<a>标签从页面中移除。

2.直接通过a标签的href属性：（get请求）

<a href='www.baidu.com?id=12' download="name.txt">下载</a>

3.下载文件流 （post请求）

axios({
     url:'www.baidu.com/downloadBillFreezeInfo?id=' + id,
     method:'post'
     responseType: 'blob'，})
     .then((response) => {
        const url = window.URL.createobjectURL(new Blob([response.data]));
        const link = document.createElement('a');
        link.href = url;
        link.setAttribute('download',fileName);
        document.body.appendchild(link);
        link.click();
        document.body.removechild(link);
})

responseType是Axios中的一个配置选项，用于指定服务器响应的数据类型。它可以设置为以下几种类型：

• arraybuffer：返回一个包含二进制数据的ArrayBuffer对象。
• blob：返回一个包含二进制数据的Blob对象。
• document：返回一个HTML文档对象。
• json：返回一个JavaScript对象，该对象是从服务器返回的JSON数据解析而来。
• text：返回一个字符串，该字符串是从服务器返回的文本数据。

默认responseType设置为json，即Axios会自动将服务器返回的JSON数据解析为JavaScript对象。

如果你需要获取其他类型的数据，可以通过设置responseType来实现。

例如，如果你需要下载一个二进制文件，可以将responseType设置为arraybuffer或blob。