在 Firefox 中导出 javascript 生成的 csv 只导出第一行，在 chrome 中工作正常

Question

这在大约 2 个月前运行良好，突然之间，除了第一行之外，Firefox 不喜欢任何东西。在调试代码时，data变量包含完整的 CSV 文档。但是一旦文件被下载，我只能得到第一行。这在 Chrome 中有效，我发现它有点奇怪，因为它曾经在这两种情况下都有效。

有关如何解决此问题的任何建议？

下面是我的导出脚本。

PerformanceTableController.prototype.exportSplitTimes = function () {
    var resultListId,
        resultList,
        columnId,
        csv = [],
        csvContent,
        row,
        i, l,
        filename,
        data,
        link;

    for (resultListId in this.raceData.resultLists) {
        if (this.raceData.resultLists.hasOwnProperty(resultListId)) {
            resultList = this.raceData.resultLists[resultListId];

            csv.push(this.getCSVClassTitle(resultList));
            csv.push(this.getCSVColumnHeaders());

            for (i = 0, l = resultList.performanceList().length; i < l; i += 1) {
                row = [];

                for (columnId in resultList.performanceList()[i]) {
                    if (resultList.performanceList()[i].hasOwnProperty(columnId)) {
                        if (resultList.performanceList()[i][columnId].value !== undefined) {
                            row.push(resultList.performanceList()[i][columnId].value);
                        }
                    }
                }

                csv.push(row.join(","));
            }
            console.log(csv);
        }
    }

    if (csv.length === 0) {
        return;
    }

    filename = this.raceData.race.event.name + ' - ' + this.raceData.race.name + '.csv';

    csvContent = csv.join("\n");
    if (!csvContent.match(/^data:text\/csv/i)) {
        csvContent = 'data:text/csv;charset=utf-8,' + '\uFEFF' + csvContent;
    }
    data = encodeURI(csvContent);

    link = document.createElement('a');
    link.setAttribute('href', csvContent);
    link.setAttribute('download', filename);
    link.style.display = 'none';
    // Without this line, Firefox is not able to open the CSV
    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);
};

Answer 1

与 chrome 相比，Firefox 对 URI 中设置的字符更加挑剔。某些字符（例如#）是保留字符，如果您的数据包含其中之一，您的文件下载将失败。

您已经调用了encodeURI，但是您是在完整的 URI 上调用的，同时您应该保持标头未编码。

所以，改变csvContent = 'data:text/csv;charset=utf-8,' + '\uFEFF' + csvContent; 以csvContent = 'data:text/csv;charset=utf-8,' + encodeURIComponent(csvContent);和拆除encodeURI(csvContent)是后话应该解决您的问题。