如何让浏览器显示“另存为对话框”,以便用户可以将字符串内容保存到系统中的文件中?
例如:
var myString = "my string with some stuff";
save_to_filesystem(myString,"myString.txt");
导致类似这样的事情:
答案 0 :(得分:27)
万一有人还在想......
我是这样做的:
<a href="data:application/xml;charset=utf-8,your code here" download="filename.html">Save</a>
无法记住我的来源,但它使用以下技术\功能:
找到参考:
http://paxcel.net/blog/savedownload-file-using-html5-javascript-the-download-attribute-2/
编辑: 正如您可以从评论中收集的那样 NOT 在
中工作答案 1 :(得分:9)
有一个javascript库,请参阅FileSaver.js on Github
但是saveAs()
函数不会向浏览器发送纯字符串,您需要将其转换为blob
:
function data2blob(data, isBase64) {
var chars = "";
if (isBase64)
chars = atob(data);
else
chars = data;
var bytes = new Array(chars.length);
for (var i = 0; i < chars.length; i++) {
bytes[i] = chars.charCodeAt(i);
}
var blob = new Blob([new Uint8Array(bytes)]);
return blob;
}
然后在blob上调用saveAs
,如:
var myString = "my string with some stuff";
saveAs( data2blob(myString), "myString.txt" );
当然请记住使用<script src=FileSaver.js>
答案 2 :(得分:9)
这可以使用HTML5 saveAs
函数的这种跨浏览器javascript实现:https://github.com/koffsyrup/FileSaver.js
如果您只想保存文本,那么上述脚本适用于所有浏览器(包括所有版本的IE),只使用JS。
答案 3 :(得分:6)
有一个名为Native File System API的新规范,可让您像this一样正确地执行此操作:
const result = await window.chooseFileSystemEntries({ type: "save-file" });
有一个演示here,但是我相信它使用的是原始版本试用版,因此除非您注册或启用配置标志,否则它only works in Chrome可能无法在您自己的网站中运行。如果您要制作Electron应用程序,则可以选择。
答案 4 :(得分:0)
仅使用javascript的解决方案
function saveFile(fileName,urlFile){
let a = document.createElement("a");
a.style = "display: none";
document.body.appendChild(a);
a.href = urlFile;
a.download = fileName;
a.click();
window.URL.revokeObjectURL(url);
a.remove();
}
let textData = `El contenido del archivo
que sera descargado`;
let blobData = new Blob([textData], {type: "text/plain"});
let url = window.URL.createObjectURL(blobData);
//let url = "pathExample/localFile.png"; // LocalFileDownload
saveFile('archivo.txt',url);
答案 5 :(得分:-5)
使用execComand:
<input type="button" name="save" value="Save" onclick="javascript:document.execCommand('SaveAs','true','your_file.txt')">
在下一个链接中: execCommand