如何在所有浏览器上从 javascript 变量下载文本?

2024-01-10

我需要一个函数将 javascript 变量中的字符串下载到文本文件(5-7MB)中。该功能应该跨浏览器工作。

我尝试过制作这样的下载功能,但它在 Chrome 上不起作用。 FireFox 会打开“保存”对话框,但 Chrome 不会。另外,当我在 Chrome 中禁用“询问保存文件的位置”时,它会显示“失败 - 网络错误”。由于我在本地做所有事情,所以我不明白为什么会出现这个问题。

function download(filename, text) {
	var element = document.createElement('a');
	element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));
	element.setAttribute('download', filename);

	element.style.display = 'none';
	document.body.appendChild(element);

	element.click();

	document.body.removeChild(element);

}

这不会打开任何用于在 Chrome(版本 76.0.3809.132)上保存文件的对话框。 Microsoft Edge (44.17763.1.0) 也存在同样的问题。我希望它适用于所有浏览器,或者至少适用于 FireFox 和 Chrome。

Edit 1:Chrome 问题似乎在其他计算机上仍然存在,因此不可能是浏览器出现问题。我也更愿意制作自己的功能而不是使用其他项目(公司问题)。

Edit 2:Chrome 中锚点大小似乎限制为 2MB。有解决方法吗?有一些答案建议使用 BLOB,但我不熟悉这个概念。任何解释将不胜感激。


我发现了一个简单的修改,现在可以在我的 FireFox 和 Chrome 上运行。它使用 BLOB 来绕过锚点大小限制。但它仍然无法在 Microsoft Edge 上运行。

function download(filename, text, type="text/plain") {
  // Create an invisible A element
  const a = document.createElement("a");
  a.style.display = "none";
  document.body.appendChild(a);

  // Set the HREF to a Blob representation of the data to be downloaded
  a.href = window.URL.createObjectURL(
    new Blob([text], { type })
  );

  // Use download attribute to set set desired file name
  a.setAttribute("download", filename);

  // Trigger the download by simulating click
  a.click();

  // Cleanup
  window.URL.revokeObjectURL(a.href);
  document.body.removeChild(a);
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在所有浏览器上从 javascript 变量下载文本? 的相关文章

  • jqgrid 在编辑框中选择不正确的下拉选项值

    我正在使用表单编辑 表单中有两个选择框 一个选择框是国家 地区 另一个选择框是州 州选择框取决于所选的国家 地区 并将动态填充 例如 Country 美国 期权价值 1 英国 期权价值 2 美国的状态 阿拉巴马州 选项值 1 加利福尼亚州
  • Angular - Safari 无法正确显示 DOM

    我是 Angular 的新手 使用 Angular 4 我尝试通过在关联的组件类文件中设置属性来更新特定元素 但是 除非我尝试强制重新绘制网页 通过调整窗口大小等 否则页面不会更新 我打开检查器 看到 DOM 已更改 但显示与元素检查器中的
  • 无法读取setInterval(Hooks)中的最新状态变量[重复]

    这个问题在这里已经有答案了 我想这是因为 JS 的工作原理 但我想你不会在类中遇到这个问题 在此代码中 let open setOpen React useState false let counter setCounter React u
  • 如何在WebBrowser控件中注入Javascript?

    我试过这个 string newScript textBox1 Text HtmlElement head browserCtrl Document GetElementsByTagName head 0 HtmlElement scrip
  • Flask send_from_directory

    我有一个 Flask Web 应用程序 允许用户上传文件 然后下载或在浏览器中显示它们 我应该使用send from directory在生产时从我的服务器上的上传文件夹提供这些文件 你最好让 nginx 为你的静态文件提供服务 众所周知
  • 无法从 Twin.macro 中的 Prop 获取值

    您可以在这里查看我正在尝试执行的操作的示例 https codesandbox io s vibrant leaf qj8vz https codesandbox io s vibrant leaf qj8vz 注意 这个特定的例子使用双宏
  • 在js中检测浏览器的最佳方法

    JavaScript 中有很多浏览器检测方法 据我所知 使用navigator userAgent或检测特征 例如XMLHttpRequest 等等 谁能告诉我哪种方法最好 最有效 如果你真的需要知道什么browser他们正在使用 你主要需
  • json、rails、javascript 中的解析错误

    我需要将 ruby 数组放入 javascript 数组中 但出现解析错误 var characters 这就是我将 ruby 嵌入到内联 javascript 中的方式 但它出现了解析错误 我应该如何将此 ruby 数组放入 javasc
  • 将 ESLint 与 Airbnb 样式和选项卡结合使用 (React.js)

    我正在开发一个 React js 应用程序 并且正在尝试检查我的代码 我将 ESLint 与 Airbnb 风格一起使用 但出现以下错误 src Test jsx 4 2 error Unexpected tab character no
  • 如何按值删除数组中的多个项目?

    我正在尝试做一个removeAll 函数 它将删除具有该特定值 而不是索引 的数组的所有元素 当我们对循环进行任何更改时 棘手的部分就出现了 索引往往会移动 使其很难像我们想要的那样工作 并且每次更改时都重新启动循环 这在大数组上效率非常低
  • 两个日期之间间隔 15 分钟 javascript

    问题 我需要将两个日期 时间戳之间的所有 15 分钟时隙 日期格式 2016 08 10 16 00 00 创建为 HH mm 格式的数组 其中分钟限制为 00 15 30 45 示例 中午 12 30 到下午 2 30 将 gt 12 3
  • Jquery获取每个div的子子div并将信息抓取到数组中

    我有一些看起来像这样的 html div div class sub main div div
  • 从 html 页面和 javascript 调用 java webservice

    我正在尝试从 javascript 调用 java 实现的 Web 服务 使用 NetBeans IDE 我读过很多关于 jQuery 和 AJAX 的内容 但我似乎无法掌握它 假设我的 Web 服务 WSDL 位于 http localh
  • backbone.js:视图中影响集合中不同模型的按钮

    我刚刚开始使用backbone js 到目前为止 我真的很喜欢它 我有这样的事情 ModelA ModelB ViewA ViewB ModelA 持有 ModelB 的集合 如何使用按钮构建模型 B 的视图 单击该按钮会更改集合中下一个
  • React TypeError:x 不是函数

    我在子组件中从父组件调用函数 booksRefresh 但出现错误 类型错误 booksRefresh 不是函数 我不知道为什么 因为 booksRefresh 是一个函数 有人可以帮我解释为什么会出现这个错误吗 这是我的代码 import
  • 如何在 JavaScript 中从代理对构造 UTF-16 字符?

    以下计算 Unicode 代码点的 UTF 16 代理对 戴着医用口罩的脸 https emojipedia org face with medical mask 但是如何从代理对构造字符以在字符串中使用呢 const codepoint
  • 通过ajax执行后期操作时如何克服CORS重定向问题?

    我可以通过外部登录表单中的 post 方法类型提交表单来登录 roundcube 实例 托管在另一台服务器上 我收到此错误 通过 ajax 签名时 XMLHttpRequest 无法加载https 192 168 0 7 mail http
  • 如何在 JSP 编辑器中激活 javascript 的语法着色 - Eclipse

    在某些情况下 javascript 确实必须位于 JSP 页面中 而不是位于单独的文件中 有些框架还使用Javascript做一些事情 以便用户将其包含到JSP标签中 这样JS就不会出现在
  • 在 Javascript 中创建数组

    我对 javascript 不太熟悉 并且在用 javascript 制作 2d 或者也许我可能需要 3d 数组时遇到了一些麻烦 我目前需要收集 2 条信息 一个 ID 和一个值 因此我创建了以下内容 var myArray var id
  • 如何用时刻找到与给定时间最接近的时间?

    所以我有一个简单的代码 一个工作代码 它使用 moment 获取最接近给定时间的时间 Current time in millis const now moment 10 16 HH mm format x List of times co

随机推荐

  • 如何在 Kusto 中创建任意大小的窗口?

    Using prev https learn microsoft com en us azure data explorer kusto query prevfunction函数我可以单独访问前几行 mytable sort by Time
  • 如何获取用户玩我的游戏的时间? Steamworks API

    如何获取用户玩我的游戏的时间 在 Unity 中使用 Steamworks API 和 C 我已经浏览了文档 但没有找到类似的内容 并认为我遗漏了一些东西 我应该使用一个简单的脚本来记录自己游戏中的比赛时间 但为时已晚 如果有人能给我一个打
  • 当Java TimerTask在Timer中被调度时,它是否已经“执行”了?

    我想澄清一些关于 TimerTask 的事情 当你有下面的代码时 timer schedule task 60000 如果任务计划在接下来的 1 分钟内运行 则任务对象是否已经在执行 因为在我的代码中的某个地方我调用了 task cance
  • 使用 HTML5 数据属性的 AJAX 响应

    我有一个工作环境 我使用 AJAX 响应来填充 HTML 元素 例如 AJAX 响应有两个 或 n 个 对象 如下所示 0 Object id 111 Name abc 1 Object id 112 Name xyz 然后 已经有两个 或
  • 错误消息无法打开包含文件:'gxall.h':没有这样的文件或目录

    我正在尝试构建一些旧的 Visual C 代码 当我这样做时 我收到此错误消息 fatal error C1083 Cannot open include file gxall h No such file or directory 我该如
  • AWS Lambda 任务在 6.00 秒后超时

    我正在使用无服务器框架 我的 Lambda 函数连接到 DynamoDB 表以更新表中的项目 表的读写容量单位为 5 并且 auto scaling 被禁用 AWS Lambda 函数分配了 128MB 内存 我使用 Jmeter 进行性能
  • C++ 中的对话框未接收到某些击键

    当我 最终 学习用 C 编写 Windows 应用程序时 我偶然发现了这一点 我有一个用它创建的对话框CreateDialog 我还有一个默认按钮 然而 每次我按下TAB or ENTER 什么也没有发生 控制焦点也没有改变 默认按钮也没有
  • 使用 TPL 时避免窗口 (WPF) 冻结

    我正在构建一个 WPF 它有一个在 sql server 中执行 sql 查询的按钮 该查询可能需要很长时间才能运行 我想使用 TPL 来做到这一点 这段代码 var result Task Factory StartNew gt comm
  • 使用 PDO 有效获取带有 WHERE 子句的 SELECT 查询返回的行数

    有关于SO的大量讨论 https stackoverflow com search q pdo 20select 20number 20of 20rows 20 5Bmysql 5D关于如何获取运行时返回的行数SELECT使用 PDO 进行
  • 在应用程序中,活动和服务是否会在同一进程中运行?

    面试问题 在一个应用程序中 Activity和Service是运行在同一个进程中还是不同的进程中 我的答案是 在同一过程中 下一个问题 如果是的话 Activity和Service是如何同时运行的 我的答案是 操作系统将负责执行 坦白说 我
  • 将 bigdecimal 转换为 double(不带指数格式)

    我正在对高十进制精度 BigDecimal 对象进行计算 我正在使用需要双精度参数的第三方库 当我尝试将其转换为 double 时 我得到指数格式的值而不是小数 BigDecimal 0 000035000000000 Double 3 5
  • Winforms MDI“桌面”区域边界

    默认的MDI父控件有一个很大的 桌面 区域 可以显示多个子窗体 用户可以将表单拖动到此桌面区域的边缘 以便大部分子表单脱离屏幕 然后 MDI 父级中会出现一个滚动条 我不喜欢这个功能 有没有办法锁定桌面区域的边缘 以便子窗体保持完全可见 我
  • Woocommerce 以编程方式添加产品属性及其相应的值

    我正在构建一个获取产品的脚本 但我陷入了以编程方式添加属性的部分 所以基本上我想检查属性是否存在 如果不存在则添加它 然后检查它的价值是否存在 如果不存在 他们会添加它的价值 并将所有内容附加到我的产品上 这是我获得产品的格式 attrib
  • D 语言是否有多个标准库以及 GC 的问题?

    我想知道 D 有多成熟和稳定 以及它是否可以很好地替代 C C 我知道目前有两个标准库 Phobos 和 Tango 难道还是没有统一的标准库吗 另外 我不久前听说这些语言在 GCed 非 GCed 代码的边界上存在问题 我在D网站上找不到
  • Kotlin 问题“ExpandableRecyclerAdapter 类需要一个类型参数”

    RecyclerAdapter ViewHolder 出现问题 abstract class ExpandableRecyclerAdapter
  • 我应该直接调用 object.__str__() 吗?

    我正在用Python写一个类 我正在写一个 str 函数 以便我的打印语句可以打印该类实例的字符串表示形式 是否有理由直接做这样的事情 myObj Foo params doSomething myObj str 感觉既然还有其他更简洁的方
  • init CBCentralManager:表达式类型不明确,没有更多上下文

    尝试在 Swift 4 2 项目中初始化 CBCentralManager 获取评论中显示的错误 import CoreBluetooth class SomeClass NSObject CBCentralManagerDelegate
  • 在 Visual Studio 上部署到 Windows Phone 10 失败

    发生了很多事情 我不知道从哪里开始 说真的 这不是更简单吗 编辑 这里有人知道我如何联系微软来告诉这个吗 或者甚至 有人可以告诉他们这个问题吗 我有最后一个 Windows 10 桌面 还有 Windows Phone 10 0 10512
  • 从 Facebook 返回的奇怪访问令牌

    我一直在开发 Facebook 应用程序 并且已经使用 Facebook Graph Toolkit 几个月了 一直以来 我的代码都在工作 我可以获得访问令牌 我可以使用它们来检索 Facebook 用户详细信息 发布新闻源等 现在 新的问
  • 如何在所有浏览器上从 javascript 变量下载文本?

    我需要一个函数将 javascript 变量中的字符串下载到文本文件 5 7MB 中 该功能应该跨浏览器工作 我尝试过制作这样的下载功能 但它在 Chrome 上不起作用 FireFox 会打开 保存 对话框 但 Chrome 不会 另外