使用JavaScript创建导出函数?

使用JavaScript创建导出函数?,javascript,export,local-storage,Javascript,Export,Local Storage,我正在尝试用JavaScript为打包的web应用程序设置一个导出函数,将存储在localStorage中的字符串转换为纯文本文件以供下载。由于JavaScript无法访问计算机的文件系统,我想对其进行设置,以便它创建一个空白文本文件(或者,如果没有设置,则创建一个简单的HTML页面)并在web浏览器中打开;因为它不会访问任何文件系统,所以我希望这是可能的 我正在考虑使用数据URI方案以纯文本形式打开localStorage,如下所示: function exportFile() { wind

我正在尝试用JavaScript为打包的web应用程序设置一个导出函数,将存储在localStorage中的字符串转换为纯文本文件以供下载。由于JavaScript无法访问计算机的文件系统,我想对其进行设置,以便它创建一个空白文本文件(或者,如果没有设置,则创建一个简单的HTML页面)并在web浏览器中打开;因为它不会访问任何文件系统,所以我希望这是可能的

我正在考虑使用数据URI方案以纯文本形式打开localStorage,如下所示:

function exportFile() {
 window.open("data:text/plain;charset=utf-8," + localStorage.WebAppData);
};
但是它比我预期的要慢得多,我猜这是因为它将整个文档粘贴在URL框中。虽然代码可能没有问题,但一些web浏览器,如Google Chrome,不允许我保存生成的文件。(由于某种原因,所有换行符都变成了空格……)


任何解决这些问题的建议或更好的实现类似功能的方法都将不胜感激

您是否尝试过以下方法:

window.open("data:text/plain;charset=utf-8," + localStorage.WebAppData);
对于下载,我想您需要往返到服务器,这将设置一个mime/类型,使下载框弹出

编辑

如果您使用
localStorage
,则可能在您的环境中提供,并且可能有助于提高速度。

这不是一个真正的解决方案,而是一个解决方案,但您的问题和@Mic的回答会引导我走这条路:

只要使用
data:text/html
,就可以使用

  • 我尝试了所有其他方法(所有unicode字符的组合,等等)来在
    text/plain
    中获得换行符,但无法让它们显示出来
    document.write()
    document.body.textContent()
    等也会遇到同样的问题。换行符会被忽略
  • 由于Chrome不允许您保存弹出窗口,因此从弹出窗口中获取文本的唯一方法是复制和粘贴,因此使用
    text/plain
    而不是
    text/html
  • 在允许您保存页面的web浏览器(Firefox)中,您可以选择将页面保存为文本,而不是HTML,因此您仍然可以得到相同的最终结果
  • 编辑:这种方法适用于Chrome,但不适用于Firefox

    win = window.open("", "win")
    win.document.body.innerText = "Line \n breaks?"
    
    但是必须使用
    innerText
    InnerHTML
    textContent
    删除换行符。这对以下两方面都有效:

    win = window.open("", "win")
    win.document.body.innerHTML = "<pre>Line \n breaks?</pre>"
    
    win=window.open(“,”win“)
    win.document.body.innerHTML=“行\n中断?”
    
    var data1 = "Line \n break. And \r\n another one";
    window.open("data:application/octet-stream, " + encodeURI(data1));
    

    那么,也许您可以将所有内容都包装在
    标记中?虽然我猜这两个选项都有与`
    建议相同的“问题”,因为它实际上是在创建HTML文档,而不是文本/纯文本文档。

    为了在使用window导出的数据中保留换行符。open您可以使用encodeURI包装数据:

    var data1 = "Line \n break. And \r\n another one";
    window.open("data:application/octet-stream;base64, " + btoa(data1));
    
    否则,您可以使用btoa功能导出以base64编码的数据:


    谢谢这解决了这个问题,但仍有一些纠结,我想解决。我已经更新了这个问题以适应。