如何使用javascript下载文件？

Question

您好，我希望能够在按下按钮时下载给定的文件。该文件将通过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事件处理程序（如果您打算在下载时执行其他逻辑）。

Answer 1

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

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

Answer 2

由于在撰写本文时，@ saibbyweb的答案在所有浏览器中均不起作用，因此我建议使用另一种但类似的解决方案，该解决方案经过测试（在撰写本文时），并且已在最新版本的Firefox，Chrome，Opera，Edge，Safari，移动Safari中运行，移动版Chrome：

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

不用说，您也可以使用_blank（而不是_self）在新选项卡中打开链接，但是您可能通过使用Javascript打开新的选项卡/窗口来使Popup-Blockers震惊。

Answer 3

您可以通过HTML <a href="/path/to/sample.csv"></a>完成此操作，但是如果必须在JS中进行操作，则可以使用https://github.com/eligrey/FileSaver.js/库。