元素
元素
工具
博客
问答

导出CSV时中文乱码怎么办？

爱学习的诗雅 阅读 59
交互

我在用前端导出表格数据为CSV文件，英文和数字都没问题，但一有中文就变成乱码了。我试过用encodeURI包裹内容，也加了BOM头，但下载的文件在Excel里打开还是显示一堆问号或者乱码字符。

这是我现在生成CSV并触发下载的代码：

const csvContent = "data:text/csv;charset=utf-8,uFEFF" + encodeURIComponent(csvString);
const link = document.createElement("a");
link.href = csvContent;
link.download = "data.csv";
link.click();

是不是BOM头加的位置不对？还是Excel根本不认UTF-8？求真实可行的解决方案！

CSV导出数据交互
我来解答 赞 11 收藏
二维码
手机扫码查看
反馈
2 条解答
艳敏 Dev
艳敏 Dev Lv1
编码问题有时候挺烦人。你加的BOM头是对的，但是encodeURIComponent会把所有字符都转成URL编码形式，导致Excel读不懂。你需要先确保字符串是UTF-8编码的，然后直接设置href。这样修改试试：

const csvContent = "data:text/csv;charset=utf-8,uFEFF" + csvString;

const link = document.createElement("a");

link.href = encodeURI(csvContent);

link.download = "data.csv";

link.click();


关键点是去掉encodeURIComponent，直接用encodeURI处理整个csvContent字符串。这样应该能解决乱码问题。复制过去试试。
点赞
2026-03-22 21:10
诸葛培珍
诸葛培珍 Lv1
问题很简单，你代码里有两个坑：

1. BOM头写错了，uFEFF 前面少了个反斜杠，应该是 uFEFF
2. 不该用 encodeURIComponent，这会把内容URL编码成乱码字符串

直接用这个修正后的代码：

// 正确添加BOM头，用Blob方式下载

const csvContent = "uFEFF" + csvString;

const blob = new Blob([csvContent], { type: "text/csv;charset=utf-8;" });

const link = document.createElement("a");link.href = URL.createObjectURL(blob);

link.download = "data.csv";

link.click();


如果你非要用 data URI 那种方式也行，但记住别 encodeURIComponent：

// BOM用 uFEFF，别用 encodeURIComponent

const csvContent = "data:text/csv;charset=utf-8,uFEFF" + encodeURI(csvString);


Excel 认 UTF-8 的，BOM头就是告诉它"这是UTF-8编码"的关键。你之前写成 uFEFF 那就是个普通字符串，Excel根本不认。
点赞
2026-03-17 17:04
相关推荐
元素
元素
工具
博客
问答
登录/注册