如何用javascript下载文件？答案

【问题标题】：How to download file with javascript?如何用javascript下载文件？
【发布时间】：2019-02-11 08:02:56
【问题描述】：

我希望能够在按下按钮时下载给定的文件。该文件将通过API 调用提供。现在，我将其保存在我的本地存储中。所以我的文件夹是这样的：

rootFolder
-JS file
-HTML file
-download file (`sample.csv`)

如何创建下载link？到目前为止，我已经尝试过： <a download="sample.csv"></a> 我也尝试过使用onclick 事件：

<a download="sample.csv" onclick="download()"></a>

function download|(){
   .....code that calls the `api`
}

我不知道这两个如何匹配：the download API（如果有）和click 事件处理程序（如果您打算在下载时执行其他逻辑）。

【问题讨论】：

“现在我将把它放在我的本地存储中” - 你的意思是developer.mozilla.org/en-US/docs/Web/API/Window/localStorage，还是你只是在谈论文件位于服务器文件中你描述的地方的系统？
该文件位于我描述的位置的服务器文件系统中。
好的，那么你只需要正确地做事，它应该可以工作......你仍然需要使用链接的href属性来引用文件； download 是您添加的额外属性。 developer.mozilla.org/en-US/docs/Web/HTML/Element/a#Attributes

【解决方案1】：

您可以提供此功能的链接以下载文件：

function downloadURI(uri, name) 
{
    var link = document.createElement("a");
    link.download = name;
    link.href = uri;
    link.click();
}

【讨论】：

【解决方案2】：

由于@saibbyweb 的答案在我写这篇文章时不适用于所有浏览器，我推荐其他但类似的解决方案，在最新（截至撰写时）Firefox、Chrome、Opera、Edge、Safari、移动 Safari 中测试和工作，移动 Chrome：

function downloadUrl(url){
    window.open(url, '_self');
}

不用说，您也可以使用 _blank 而不是 _self 在新选项卡中打开链接，但您可能会通过使用 Javascript 打开新选项卡/窗口来吓到弹出窗口阻止程序。

【讨论】：

【解决方案3】：

您可以通过 HTML <a href="/path/to/sample.csv"></a> 来完成，但如果您必须在 JS 中完成，则有 https://github.com/eligrey/FileSaver.js/ 库。

【讨论】：