# 字符在下载期间中断 CSV 文件的内容

Question

我有从一些数据下载 CSV 文件的代码。

  const rows = [ ["Html", "Css", "JavaScript"], ["C #", "C++", "Python"] ];

   let csvContent = "data:text/csv;charset=utf-8," 
          + rows.map(e => e.join(",")).join("\n");

 const encodedUri = encodeURI(csvContent);
 const link = document.createElement("a");
 link.setAttribute("href", encodedUri);
 link.setAttribute("download", "my_data.csv");
 document.body.appendChild(link); // Required for FF
 link.click();

当我从数据中删除 # 个字符时，一切正常

据我了解，encodeURL 未对特殊符号进行编码，这就是为什么 href 属性包含 # 符号并忽略其后的所有内容。

我也尝试使用 Blob 但没有结果。

Answer 1

来自 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURI?retiredLocale=it :

encodeURI() 转义所有字符，除了：

A-Z a-z 0-9 ; , / ? : @ & = + $ - _ . ! ~ * ' ( ) #

改为使用 encodeURIComponent，但仅限于数据部分，而不是整个 url。另请注意，要让 Excel 拆分字段，我必须使用分号，逗号不起作用，但这可能是因为我的语言环境设置。

const rows = [ ["Html", "Css", "JavaScript"], ["C #", "C++", "Python"] ];
let csvContent = rows.map(e => e.join(";")).join("\n");
const encodedUri = "data:text/csv;charset=utf-8," + encodeURIComponent(csvContent);
const link = document.createElement("a");
link.setAttribute("href", encodedUri);
link.setAttribute("download", "my_data.csv");
document.body.appendChild(link); // Required for FF
link.click();

# 字符在下载期间中断 CSV 文件的内容

# character breaks content for CSV file during download

javascript

csv

file

download