Javascript 如何使用window.open设置文件名

我正在尝试下载由JavaScript计算的临时结果。假设我有一个字符串

str

，我想下载一个包含

str

的文件，并将其命名为

data.csv

，我使用以下代码：

window.open('data:text/csv;charset=utf-8,' + str);

---

可以成功下载该文件，但如何自动命名文件

data.csv

，而不是每次手动设置名称？

您可以使用

元素的

下载属性来实现这一点。例如：

<a href="1251354216241621.txt" download="your-foo.txt">Download Your Foo</a>

不幸的是，这并不是所有浏览器都支持的，但添加它不会使其他浏览器的情况变得更糟：它们将继续下载带有无用文件名的文件。（这假设您使用的MIME类型是他们的浏览器尝试下载的。如果您试图让用户下载
.html
文件而不是显示它，这在不受支持的浏览器中对您没有任何好处。）
这在最新的Chrome中不起作用，我已经对其进行了修改，下面的代码也可以正常工作

 $("#download_1").on('click', function() {
    var json_pre = '[{"Id":1,"UserName":"Sam Smith"},{"Id":2,"UserName":"Fred Frankly"},{"Id":1,"UserName":"Zachary Zupers"}]';
    var json = $.parseJSON(json_pre);
   
    var csv = JSON2CSV(json);
    var downloadLink = document.createElement("a");
    var blob = new Blob(["\ufeff", csv]);
    var url = URL.createObjectURL(blob);
    downloadLink.href = url;
    downloadLink.download = "data.csv";

    document.body.appendChild(downloadLink);
    downloadLink.click();
    document.body.removeChild(downloadLink);
});

所以当你点击download_1 id按钮时，它会创建一个不可见的下载链接并点击它。我使用了另一个函数来准备js

JSON2CSV函数如下所示：

function JSON2CSV(objArray) {
    var array = typeof objArray != 'object' ? JSON.parse(objArray) : objArray;
    var str = '';
    var line = '';

    for (var i = 0; i < array.length; i++) {
        var line = '';

        for (var index in array[i]) {
           line += array[i][index] + ',';
        }

        line = line.slice(0, -1);
        str += line + '\r\n';
    }
    return str;
}

函数JSON2CSV（objArray）{
var array=typeof objArray！=“object”？JSON.parse（objArray）：objArray；
var-str=''；
var行=“”；
对于（var i=0；i

---

希望它能帮助其他人：）

IE的解决方案是使用msSaveBlob并传递文件名

对于现代浏览器，解决方案是这样的，经过测试：IE11、FF和Chrome

var csvData=newblob（[arg.data]，{type:'text/csv；charset=utf-8；'}）；
//IE11和Edge
if（navigator.msSaveBlob）{
msSaveBlob（csvData，exportFilename）；
}否则{
//必须将In FF链接添加到要单击的DOM中
var link=document.createElement（'a'）；
link.href=window.URL.createObjectURL（csvData）；
link.setAttribute（'download'，exportFilename）；
document.body.appendChild（链接）；
link.click（）；
document.body.removeChild（link）；
}

---

关于这一点有一个很好的讨论

一个较短的已被接受的版本（对于我来说，必须使用unicode）

---

我也有类似的问题需要解决，我在这里发布了我所做的事情。下载链接。点击（）部分未开始下载。我必须手动单击超链接才能执行此操作。在指定的浏览器中不支持任何变通方法。您不必将此元素附加到正文中。只需调用

。单击（）@AchmedzianovDanilian我不得不添加链接，使其在Firefox 59中工作。如果DOM中没有它，click（）似乎什么也做不了。@ManoDestra，你说得完全正确。刚刚检查过，这个.downloadLink.click（）在Safari with ics文件中不适用。Safari不会自动打开文件。使用window.open，它可以工作，但文件名是uknown。什么部分？它在chrome中为我工作，用于下载具有正确名称的文件完美地下载CSV文件！你能帮我把钥匙（Id，用户名）也包括进去吗？它可以不下载就打开吗？对我来说它已经打开了。试着让我知道，不适合我。它开始下载。Safari，MacOS中的Chrome。我认为这是一种浏览器设置。您可以将其设置为打开或下载。
function JSON2CSV(objArray) {
    var array = typeof objArray != 'object' ? JSON.parse(objArray) : objArray;
    var str = '';
    var line = '';

    for (var i = 0; i < array.length; i++) {
        var line = '';

        for (var index in array[i]) {
           line += array[i][index] + ',';
        }

        line = line.slice(0, -1);
        str += line + '\r\n';
    }
    return str;
}

var link = document.createElement("a");
link.href = 'data:text/csv,' + encodeURIComponent("algún texto");
link.download = "Example.csv";
link.click();