【问题标题】:How to programmatically create a client side file in Javascript that can be downloaded by the user? [duplicate]如何以编程方式创建用户可以下载的 Javascript 客户端文件? [复制]
【发布时间】:2013-02-27 08:32:52
【问题描述】:

我想尝试创建一个 Javascript 应用程序,该应用程序从用户的表单中获取输入,然后根据用户的表单输入生成一个文件。

然后用户应该可以在不接触服务器的情况下下载该文件。

您如何使用 JavaScript 在客户端创建文件,以及该文件可以存储在客户端的什么位置,以便无需先在服务器上创建就可以下载它?

更新:更具体地说,正如 Graham 回答的那样,我正在寻找创建文件的方法,而不必触及文件系统本身,而只是创建一个可由用户下载的文件对象(Blob)。谢谢格雷厄姆!

【问题讨论】:

  • 是否有您所针对的特定浏览器和浏览器版本? (我问是因为我认为您需要为此使用data: URL 协议,并且并非所有浏览器版本都支持它。)
  • 你总是可以尝试喷堆:P
  • 这些链接非常有用。 Flash 不是一个可行的解决方案,并且其他线程的解决方案在浏览器中不能很好地工作。我发现了这个:html5rocks.com/en/tutorials/file/filesystem,但仍然不太令人满意。
  • 实际上不只是Chrome支持,很多浏览器都实现了Filesystem API。而且,实际上,它是官方的 w3 规范,所以,是的,它是“HTML5”的一部分。

标签: javascript file client-side


【解决方案1】:

无需使用文件系统即可做到这一点的一种方法是创建 blob。假设我们有一堆数据(在您的情况下,来自表单),我们希望将其保存到文本“文件”中。我们实际上可以这样做:

var formBlob = new Blob([someStringVariable], { type: 'text/plain' });

从这里,我们可以链接用户以将其作为实际文件下载,如下所示:

someLink.href = window.URL.createObjectURL(formBlob);

如果我们希望这些数据持久存在,我们可以将我们的 blob 序列化为 base64 字符串并将其保存到 localStorage 或任何其他持久类型的存储。将 blob 转换为 base64 有点超出此答案的范围,但您可以在此处找到一个很好的参考/库:http://blog.danguer.com/2011/10/24/base64-binary-decoding-in-javascript/

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2010-12-11
    • 2016-09-14
    • 2017-03-30
    • 2018-09-08
    • 1970-01-01
    • 1970-01-01
    • 2017-08-30
    相关资源
    最近更新 更多