如何在javascript中重命名从window.open（）下载的文件？答案

【问题标题】：How to rename downloaded files from window.open() in javascript?如何在javascript中重命名从window.open（）下载的文件？
【发布时间】：2017-01-31 02:04:59
【问题描述】：

我最近偶然发现this JSFiddle about how to convert a table to Excel 文件直接没有任何花哨的插件。它确实适合我的需要，但它有一个缺陷，我无法重命名它的文件。 Chrome 将文件重命名为 download，而 Firefox 为其随机命名。

$("#btnExport").click(function (e) {
    window.title = "filename.xls"; // this part doesn't work
    window.open('data:application/vnd.ms-excel,' +     
    $('#dvData').html());
    e.preventDefault();
});

如何重命名下载的文件？

【问题讨论】：

标签： javascript jquery

【解决方案1】：

可以通过 HTTP 标头建议文件名，但没有标准机制可以使用数据 URI 或 window.open 完成相同的事情。

在下载生成的数据时有一些方法可以指定文件名，但 AFAIK 没有任何一种在多个浏览器中支持。

其中一种方法是<a> 元素的新下载属性。例如：

下载你的 Foo 此属性指示应下载文件（而不是显示，如果适用）并指定应为下载的文件使用哪个文件名。

您可以使用下载属性和.click() 生成一个不可见的链接，而不是使用window.open()。

var str = "Name, Price\nApple, 2\nOrange, 3";
var uri = 'data:text/csv;charset=utf-8,' + str;

var downloadLink = document.createElement("a");
downloadLink.href = uri;
downloadLink.download = "data.csv";

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

【讨论】：

这个触发下载而不是打开。

【解决方案2】：

使用带有download 属性的<a> 元素

let file = new Blob([$('#dvData').html()], {type:"application/vnd.ms-excel"});

let url = URL.createObjectURL(file);

let a = $("<a />", {
  href: url,
  download: "filename.xlsx"
})
.appendTo("body")
.get(0)
.click();

jsfiddle https://jsfiddle.net/jWAJ7/4549/

【讨论】：