javascript - Javascript 到 csv 导出编码问题

Question

我需要将 javascript 数组导出到 excel 文件并下载它，我正在这段代码中执行此操作。data 是一个 javascript 对象数组。

var csvContent = "data:text/csv;charset=utf-8,";
data.forEach(function(dataMember, index)
{
    dataString = dataMember.join(",");
    csvContent += index < data.length ? dataString+ "\n" : dataString;
}); 

var encodedUri = encodeURI(csvContent);
var link = document.createElement("a");
link.setAttribute("href", encodedUri);
link.setAttribute("download", "upload_data" + (new Date()).getTime() + ".csv");
link.click();

所有这些东西都可以正常工作，直到我拥有包含非英语字符的字符串属性，例如西班牙语、阿拉伯语或希伯来语。如何使用所有这些非 ASCII 值进行导出？

score 107 · Accepted Answer

您应该在文本的开头添加 UTF-8 BOM，例如：

var csvContent = "data:text/csv;charset=utf-8,%EF%BB%BF" + encodeURI(csvContent);

它适用于 Excel 2013。

演示小提琴

score 103 · Accepted Answer

您可以先添加 BOM，使用此代码并尝试

var BOM = "\uFEFF"; 
var csvContent = BOM + csvContent;

然后用数据创建文件头：“text/csv;charset=utf-8”

score 18 · Accepted Answer

Excel 在检测编码方面真的很糟糕，尤其是 OSX 上的 Excel。

最好的解决方案是使用默认的 Excel 编码对 CSV 进行编码：windows-1252（也称为 ANSI，基本上是 ISO-8859-1 的子集）。

我在https://github.com/b4stien/js-csv-encoding上放了一个完整的例子来说明如何做到这一点。

两个主要部分是字符串编码（用于在 windows-1252 中编码 CSV 的内容）和FileSaver.js（用于下载生成的 Blob）。

看起来像：

var csvContent = 'éà; ça; 12\nà@€; çï; 13',
    textEncoder = new TextEncoder('windows-1252');


var csvContentEncoded = textEncoder.encode([csvContent]);
var blob = new Blob([csvContentEncoded], {type: 'text/csv;charset=windows-1252;'});
saveAs(blob, 'some-data.csv');

score 6 · Accepted Answer

选项1

使用iconv-lite库并将输出编码为 ascii，然后再将其发送回用户。例子：

var iconv = require('iconv-lite');
buf = iconv.encode(str, 'win1255'); // return buffer with windows-1255 encoding

选项 2

在文件头写上UTF-8编码的BOM头。例子：

res.header('Content-type', 'text/csv; charset=utf-8');
res.header('Content-disposition', 'attachment; filename=excel.csv'); 
res.write(Buffer.from('EFBBBF', 'hex')); // BOM header

// rest of your code

选项 3

使用 base64 url 格式，如data:text/csv;base64,77u/Zm9vLGJhcg0KYWFhLGJiYg==. 此方法也适用于客户端（IE10+、FF、Chrome、Opera、Safari）。

例如：

window.location = "data:text/csv;base64,77u/" + btoa("foo,bar\r\naaa,bbb");

score 2 · Accepted Answer

不知何故发现带有 utf-16le 编码和 BOM 的 Tab-Separated-CSV 适用于 WIN/MAC Excel

遵循 b4stien 的回答，但存档有所不同：

var csvContent = 'éà; ça; 12\nà@€; çï; 13',
    textEncoder = new TextEncoder('utf-16le');
var csvContentEncoded = textEncoder.encode([csvContent]);
var bom = new Uint8Array([0xFF, 0xFE]);
var out = new Uint8Array( bom.byteLength + csvContentEncoded.byteLength );
out.set( bom , 0 );
out.set( csvContentEncoded, bom.byteLength );
var blob = new Blob([out]);
saveAs(blob, 'some-data.csv');

使用 Linux /usr/bin/file 测试：

Little-endian UTF-16 Unicode text, with very long lines, with CRLF line terminators

score 2 · Accepted Answer

 data=`"red","मुकेश&quot;`
 var processdata = "data:text/csv;charset=utf-8,%EF%BB%BF" + encodeURIComponent(data);

score 0 · Accepted Answer

B4stien，谢谢你的回答！在测试了几个基于字符集“utf8”的解决方案后，编码 windows-1252 是唯一能让我在 Excel 365 中保持口音的解决方案！

Manetsus，b4stien 的答案和他的链接对我的情况非常有用：我必须将法语和德语数据导出到 csv 文件中：没有基于“utf8”的解决方案有效......只有他使用“ANSI”的解决方案（窗口-1252) 编码器...

我给他的代码示例，你可以从链接下载依赖的 encoding-indexes.js、encoding.js 和 FileSaver.js...

    <!doctype html>
    <html>

    <head>
        <meta charset="utf-8">
        <script type="text/javascript" src="encoding-indexes.js"></script>
        <script type="text/javascript" src="encoding.js"></script>
        <script type="text/javascript" src="FileSaver.js"></script>
    </head>

    <body>
        <a href="#" id="download-csv">Click me to download a valid CSV !</a>

        <script type="text/javascript">
            var csvContent = 'éà; ça; 12\nà@€; çï; 13',
                textEncoder = new CustomTextEncoder('windows-1252', {NONSTANDARD_allowLegacyEncoding: true}),
                fileName = 'some-data.csv';

            var a = document.getElementById('download-csv');
            a.addEventListener('click', function(e) {
                var csvContentEncoded = textEncoder.encode([csvContent]);
                var blob = new Blob([csvContentEncoded], {type: 'text/csv;charset=windows-1252;'});
                saveAs(blob, fileName);
                e.preventDefault();
            });
        </script>
    </body>

    </html>

尽管如此，由于Excel在语言和格式的支持上相对开放，我不排除UTF8在我的开发环境中是不支持的，因为它的安装方式......

注意：我在 Windows 7 上使用 Firefox、Chrome 和 IE 11 以及 Excel 365 进行测试...

score 0 · Accepted Answer

要导出包含多字节字符的 CSV 并使其在多个操作系统平台（Windows、Linux、MacOS）的文本编辑器和 Excel 上可读，应应用以下规则：

用制表符而不是逗号分隔字段（以便 MacOS 上的 Excel 可以正确显示生成的 CSV 文件）
使用 UTF-16 little endian (UTF16-LE) 而不是 UTF-8 对字符串/内容进行编码
在序列化流的开头添加 RFC2781 第 3.2 节中指定的字节顺序标记 (BOM) 0xFEFF，以显式提供使用 UTF16-LE 编码的内容的“签名”

可以在这篇文章中看到关于 NodeJS 的进一步阐述、用例和示例代码。

score 0 · Accepted Answer

这是对我有用的解决方案

参考：导出 CSV 文件 - 编码

var csv = 'السلام عليكم, Student name\n';
        
var hiddenElement = document.createElement('a');
        //workaround to support encoding
hiddenElement.href = **'data:text/csv;charset=utf-8,%EF%BB%BF'+encodeURIComponent(csv);**

hiddenElement.download = 'Course Students Progress - ' + new Date().toLocaleString() + '.csv';
hiddenElement.click();

javascript - Javascript 到 csv 导出编码问题

9 回答 9

Related

Reference