如何正确下载包含我自己数据的 CSV？答案

【问题标题】：How do I correctly download a CSV with my own data?如何正确下载包含我自己数据的 CSV？
【发布时间】：2013-10-02 02:44:18
【问题描述】：

我正在编写一个小插件，它基本上从 facebook API 中提取信息，循环，从我想要的数据中创建一个格式化的字符串，但是，据我所知，一旦它运行就会强制下载，我正在正确格式化字符串，但我无法打开 csv（除非我很愚蠢，很可能是这种情况......）。

演示： http://jsfiddle.net/shannonhochkins/vUnF9/848/

但是，这是一个非常简单的示例，我如何格式化我的回复我正在格式化我的回复：

var string = "a","b","c","d","e","f","etc";

据我所知，这就是 csv 文件所期望的方式，但是当我将该信息强制输入靠近小提琴顶部的 window.open 命令而不是将其传递给我的自定义字符串时，它甚至都不起作用。

我知道这是一大段代码，但我不确定我还能在这里做什么？

即使我直接运行 :window.open("data:text/csv;charset=utf-8," + escape("a","b","c","d","e","f","etc"))，csv 也会正确下载并打开，但没有数据..

任何帮助都会很棒！

【问题讨论】：

标签： jquery string csv download

【解决方案1】：

你有几个问题：

1) 你下载得太早了。 FB api调用是ajax(aynch)调用，成功后才需要下载

2）你检查response.length，response是一个对象，它没有长度属性。

3) 使用 window.open 下载 csv，您可以尝试使用 HTML5 锚download 属性。

你可以在这些方面做一些事情：

for (var i = 0; i < ids.length; i++) {
    FB.api(ids[i], 'get', function (response) {
        if (response) {
            //csvString = toCsv(response);   
            csvString += (hasRun == false ? getArrayValue(response, true) : getArrayValue(response, false));
            console.log(csvString);
            hasRun == true;

        }

        $('#keys').html(csvString);
           var tmpAnc=document.createElement('a');
           tmpAnc.textContent='download';
           tmpAnc.download="myFileName.csv";
           tmpAnc.href='data:text/csv;charset=utf-8,'+escape(csvString);
           tmpAnc.click();

    });
    //updateprogressBar(i + 1, ids.length);
}

Fiddle

此外，您似乎在每一行之后都缺少换行符，所有内容都显示在单行中

这是另一个例子：

$("#download").click(function() {
    var tempAnc    = document.createElement('a');
    tempAnc.href    = 'data:attachment/csv,' + escape($("#csv").val());
    tempAnc.target   = '_blank';
    tempAnc.download   = 'myFile.csv';
    tempAnc.click();
});

Fiddle

Fiddle- Combined request

【讨论】：

啊，当然，非常感谢，新行应该很容易:) 再次感谢！
你介意我问一下window.open 命令和你创建锚点的方式有什么区别吗？
@ShannonHochkins 这是我第一次从客户端下载真正的文件。不知何故 window.open 不起作用。所以尝试了这个选项来创建一个临时锚标记，但它仍然可以在不同的浏览器中检查一次。
@ShannonHochkins 让我用 window.open 玩 arnd，更改后好像没有下载文件但没有文件名...
好的，我现在遇到的问题是，因为我需要多次调用 'FB' api，以继续添加到变量 csvString，它会尝试下载文件和以上，而不是制作字符串，然后下载它，你能想出一个让它工作的技巧吗？ jsfiddle.net/shannonhochkins/vjvyE/1

【解决方案2】：

如果您使用重音符号，请考虑在前面加上 \ufeff

我使用上面的文字，稍作改动。这是因为如果没有这个，您在没有 BOM 的情况下执行 UTF-8，添加后它将适用于 pt-br 和其他使用重音符号的语言。

tmpAnc.href='data:text/csv;charset=utf-8,\ufeff'+escape(csvString);

【讨论】：