通常，HTML 页面可以链接到可以从服务器下载的文档（PDF 等）。
假设启用了 Javascript 的网页，是否可以从用户浏览器中动态创建文本文档（例如）并添加链接以下载该文档而无需往返服务器（或最少一次）？
换句话说，用户会点击一个按钮，javascript 会生成随机数（例如），并将它们放入一个结构中。然后，javascript（例如 JQuery）会向页面添加一个链接，以将结果作为文本文件从结构中下载。
此目标是将所有（或至少大部分）工作负载保留在用户端。
这是可行的，如果是，如何？
如何在Javascript中创建动态文件+链接以供下载？
IT技术
javascript
file
dynamic
download
creation
2021-03-01 02:21:02
3个回答
这是我创建的一个解决方案，它允许您单击创建和下载文件：
<html>
<body>
<button onclick='download_file("my_file.txt", dynamic_text())'>Download</button>
<script>
function dynamic_text() {
return "create your dynamic text here";
}
function download_file(name, contents, mime_type) {
mime_type = mime_type || "text/plain";
var blob = new Blob([contents], {type: mime_type});
var dlink = document.createElement('a');
dlink.download = name;
dlink.href = window.URL.createObjectURL(blob);
dlink.onclick = function(e) {
// revokeObjectURL needs a delay to work properly
var that = this;
setTimeout(function() {
window.URL.revokeObjectURL(that.href);
}, 1500);
};
dlink.click();
dlink.remove();
}
</script>
</body>
</html>
我通过改编此 HTML5 演示中的代码并弄乱事情直到它起作用来创建它，所以我确定它存在问题（如果您有改进，请发表评论或编辑！）但它是一个有效的单击解决方案.
（至少，它适用于 Windows 7 中最新版本的 Chrome）
一个PDF文件？不，一个txt文件。是的。使用最近的 HTML5 blobURI。代码的一个非常基本的形式如下所示：
window.URL = window.webkitURL || window.URL;
window.BlobBuilder = window.BlobBuilder || window.WebKitBlobBuilder || window.MozBlobBuilder;
var file = new window.BlobBuilder(),
number = Math.random().toString(); //In the append method next, it has to be a string
file.append(number); //Your random number is put in the file
var a = document.createElement('a');
a.href = window.URL.createObjectURL(file.getBlob('text/plain'));
a.download = 'filename.txt';
a.textContent = 'Download file!';
document.body.appendChild(a);
您可以使用其他答案中提到的其他方法作为后备，也许，因为 BlobBuilder 可能没有得到很好的支持。
注意： BlobBuilder似乎已被弃用。请参阅此答案以了解如何使用Blob代替BlobBuilder. 感谢@limonte 的提醒。
其它你可能感兴趣的问题