使用JavaScript和锚标记触发文件下载

Question

我想使用锚标记来绑定文件下载。我试过了：

<a href="https://cdn.jsdelivr.net/npm/es6-promise@4/dist/es6-promise.auto.js" download>Download</a>

但是它不起作用。请帮助

Answer 1

[经过一些测试，我发现<a>标记下载文件不是本机Windows格式的文件有问题。在这种情况下就像“ .js”。您有2种解决方案，可以使用JavaScript创建下载按钮，或将文件保存为txt。

Answer 2

这有点棘手，并且需要允许CORS的主机。您的网页需要下载脚本，然后将其文本放入dataURL：

const filename = 'es6-promise.auto.js';
const scriptURL = 'https://cdn.jsdelivr.net/npm/es6-promise@4/dist/' + filename;

document.getElementById('dl').addEventListener('click', async function(e) {
  e.preventDefault();
  const content = await fetch(scriptURL)
    .then(r => r.text());
  var dl = document.createElement('a');
  dl.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(content));
  dl.setAttribute('download', filename);
  dl.click();
});

<a id="dl" href="">Download Script</a>