如何在href中使用#不截断链接？CSV下载遇#截断问题求助

问题根源在于**#是URL的锚点标识符**，encodeURI不会对它进行编码，当你直接把编码后的data URI赋值给window.location时，浏览器会把#后面的内容当作页面锚点，而非CSV数据的一部分，导致内容被截断。

给你两种可行的解决办法：

方法一：用encodeURIComponent编码完整数据 #

把CSV内容用encodeURIComponent处理，它会将#编码为%23，避免被浏览器识别为锚点：

const csvContent = "sep=;\r\n a;b;c#;d;e;f ";
const encodedData = encodeURIComponent(csvContent);
const encodedUri = `data:text/csv;charset=utf-8,${encodedData}`;
window.location = encodedUri;

方法二：通过Blob创建下载链接（更推荐） #

这种方式完全绕开data URI的字符限制和锚点问题，还能指定下载文件名，稳定性更高：

const csvContent = "sep=;\r\n a;b;c#;d;e;f ";
// 创建Blob对象存储CSV内容
const blob = new Blob([csvContent], { type: 'text/csv;charset=utf-8;' });
// 生成临时URL
const url = URL.createObjectURL(blob);
// 创建a标签触发下载
const a = document.createElement('a');
a.href = url;
a.download = 'my_data.csv'; // 自定义下载文件名
document.body.appendChild(a);
a.click();
// 清理资源
document.body.removeChild(a);
URL.revokeObjectURL(url);

内容的提问来源于stack exchange，提问作者Shail