可以将 JavaScript 变量保存为文件吗? [复制]
Posted
技术标签:
【中文标题】可以将 JavaScript 变量保存为文件吗? [复制]【英文标题】:Is possible to save JavaScript variable as file? [duplicate] 【发布时间】:2014-09-13 21:40:32 【问题描述】:有没有办法将字符串从 JavaScrip 变量转换为用户可以在单击按钮时下载的可下载文件?
感谢您的建议。
<div id="txt">Lorem Ipsum</div>
<br />
<button id="test">Download text as file !</button>
【问题讨论】:
您需要某种服务器来写入文件系统。 Node.js、php、Python等。单靠javascript是做不到的。 ***.com/questions/3665115/… 首先感谢您提出这个问题,我正在寻找它,但标题不同。请你可以让标题更通用,比如“使用 Javascript 将文本下载为文件”,这样会更容易找到恕我直言。 【参考方案1】:是的,您可以在 html5 中使用download
属性执行类似的操作
function download_txt()
var textToSave = document.getElementById('txt').innerHTML;
var hiddenElement = document.createElement('a');
hiddenElement.href = 'data:attachment/text,' + encodeURI(textToSave);
hiddenElement.target = '_blank';
hiddenElement.download = 'myFile.txt';
hiddenElement.click();
document.getElementById('test').addEventListener('click', download_txt);
FIDDLE
【讨论】:
非常感谢,这对我来说是一个很好的解决方案。 @MohamedHussain - 如果你先使用JSON.stringify
对其进行字符串化。
这在 Chrome 上运行良好,但是:对于 OSX 上的 Firefox(43.0.3,2016 年初)根本不起作用。在 Safari 上工作一半;文件下载,但使用默认名称并打开一个空白选项卡。
Fiddle 似乎根本无法在 Firefox 45 (Ubuntu) 上运行 - 有什么办法吗?
仅适用于 Windows 7 上的 Chrome。不适用于 firefox 或 IE。【参考方案2】:
要存储一个javascript变量,我建议你使用libraries of data storage just like this one。您可以在其中设置变量,获取它,删除它...
$.setData("key","value");
$.getData("key");
$.removeData("key");
但要将其存储在文件中并使其可下载,您必须通过服务器,除非您使用 javascript 技巧下载不存在的文件,您只需声明这些函数
var Download =
click : function(node)
var ev = document.createEvent("MouseEvents");
ev.initMouseEvent("click", true, false, self, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
return node.dispatchEvent(ev);
,
encode : function(data)
return 'data:application/octet-stream;base64,' + btoa( data );
,
link : function(data, name)
var a = document.createElement('a');
a.download = name || self.location.pathname.slice(self.location.pathname.lastIndexOf('/')+1);
a.href = data || self.location.href;
return a;
;
Download.save = function(data, name)
this.click(
this.link(
this.encode( data ),
name
)
);
;
当你想下载一个文件时,你可以这样做
Download.save("data to be on a file","FileName.txt");
最后,你需要结合数据存储和文件下载解决方案来得到你想要的结果
【讨论】:
太可怕了,为什么不用一个函数呢?创建点击、链接和编码有什么意义???这是一个糟糕的编程示例。【参考方案3】:您可以使用 adeneo 的答案中的 data: URI,但另一种方法是使用 HTML5 Blob and createObjectURL(类似地使用下载属性创建下载链接)。
使用 createObjectURL 的好处是大多数浏览器中的数据 URI 都有严格的大小限制。
来自链接文章的示例代码:
var typedArray = GetTheTypedArraySomehow();
var blob = new Blob([typedArray], type: 'application/octet-binary');
// pass a useful mime type here
var url = URL.createObjectURL(blob);
// url will be something like: blob:d3958f5c-0777-0845-9dcf-2cb28783acaf
// now you can use the url in any context that regular URLs can be used
// in, for example img.src, etc.
【讨论】:
在现代浏览器中,数据 URI 的长度是无限的,一些旧浏览器会将其限制为大约 65000 个字符,所以我不会说“严格的大小限制”! 我真的可以使用示例的其余部分(实际下载的东西为 .json)以上是关于可以将 JavaScript 变量保存为文件吗? [复制]的主要内容,如果未能解决你的问题,请参考以下文章
有没有办法将 JavaScript 对象保存到 JSON 文件中,我可以选择保存它的目录吗?
我可以将变量从我的 javascript 传递到 jsp 文件吗?
如何将javascript变量或console.log(变量)保存到文件中