vue项目通过Blob对象下载文件的方法（文件名中文转成utf-8）以及使用fileReader来读取文件

function exportFile(url, payload) {
const downloadBlob = (data, fileNameS) =>{
if (!data) {
return
}
let blob = new Blob([data]， {type: "application/zip"})
let fileName = ${fileNameS}
///通过 使用a标签的download方法下载文件
if ('download' in document.createElement('a')) {
// 静态方法会创建一个 DOMString，其中包含一个表示参数中给出的对象的URL。
// 这个 URL 的生命周期和创建它的窗口中的 document 绑定。这个新的URL 对象表示指定的 File 对象或 Blob 对象
let url = window.URL.createObjectURL(blob)
let link = document.createElement('a')
link.href = url
link.style.display = 'none'
link.setAttribute('download', fileName)
document.body.appendChild(link)
link.click()
document.body.removeChild(link);
// 静态方法用来释放一个之前通过调用 URL.createObjectURL() 创建的已经存在的 URL 对象。
// 当你结束使用某个 URL 对象时，应该通过调用这个方法来让浏览器知道不再需要保持这个文件的引用了。
window.URL.revokeObjectURL(url)
} else {
window.navigator.msSaveBlob(blob, fileName)
}
}
io.post(url, payload, res => {
// 第二个参数为下载的文明名称
downloadBlob(res, payload.filename)
//读取本地文件，以gbk编码方式输出
var reader = new FileReader();
reader.readAsText(res,"gbk");
reader.onload = function(){
//读取完毕后输出结果
console.log(reader.result);
}
}, e => {}, {
responseType: 'blob'
})
}

export {exportFile}

// 页面的使用
import {exportFile} from 'file'
exportFile (url, {data})

data结构

参考文献： https://blog.csdn.net/qq_40298902/article/details/121779944
https://blog.csdn.net/SunFlower914/article/details/123558341
http://t.zoukankan.com/dongxixi-p-11005607.html //用fileReader来读取文件