下载csv 文件后端返回字符流下载文件 ,坑d 的 excel乱码问题-----设置 bom头

最新推荐文章于 2024-07-24 23:00:08 发布

weixin_44191105

最新推荐文章于 2024-07-24 23:00:08 发布

阅读量477

点赞数

文章标签：前端开发语言 javascript vue.js

本文链接：https://blog.csdn.net/weixin_44191105/article/details/127620770

版权

1 返回字符流，就是后端返回字符串，我们需要把它转换成二进制blob 流

const blob = new Blob(['stirng'])

2 然后使用转换成本地的 url，

const URL.createObjectURL(blob)

3 虚拟一个 a 便签，模拟点击，然后再移除它

const eleLink = document.createElement('a');

eleLink.download = filename;

eleLink.style.display = 'none';

eleLink.href = URL.createObjectURL(blob);

document.body.appendChild(eleLink);

eleLink.click();

document.body.removeChild(eleLink);

4 坑 d 的地方：恶心的 bom 头，如果没有设置的话，在微软的excel打开后会乱码

所以需要加上 '\uFEFF'

大功告成

完整代码：

const exportText = (text, filename) =>{

const eleLink = document.createElement('a');

eleLink.download = filename;

eleLink.style.display = 'none';

// 将内容转为 blob

const blob = new Blob(['\uFEFF' + text]);

eleLink.href = URL.createObjectURL(blob);

document.body.appendChild(eleLink);

eleLink.click();

document.body.removeChild(eleLink);

}

参考文章：https://www.meiwen.com.cn/subject/maiqqqtx.html

前端js 实现文件下载_51CTO博客_vue前端文件流下载文件