将客户端 Json 下载为 CSV

Posted 2023-03-07

【中文标题】将客户端 Json 下载为 CSV

【英文标题】：Download Client Side Json as CSV

【发布时间】：2013-03-19 08:43:27

【问题描述】：

我使用 angularJS 前端框架和 nodejs/express 作为后端服务器来发送和接收 JSON。后端向前端发送了一个大的 JSON 对象，我想知道是否可以从前端以 CSV 格式下载 JSON 对象。

数据以 json 格式存储在范围变量中：$scope.data 在角度控制器中。然后我将数据转换为变量$scope.CSVdata中的CSV格式的字符串。如何从客户端浏览器下载 CSV 数据？

我知道 nodejs 可以设置为以 CSV 格式发送文件，但最好让后端保持干净的 JSON api。

【问题讨论】：

拿到后为什么不直接在客户端转换呢？由于您使用的是 Node，因此无论如何它都是相同的代码，这样您就可以让您的 API 完全是 JSON。另外，你到底在问什么？将 JSON 转换为 CSV，或将数据获取到 Angular 中的下载按钮，或两者兼而有之？

我在问如何从 Angular 获取 CSV 格式的数据以从客户端下载。我不太关心将其转换为 CSV 格式。我会在几秒钟内更新问题。

这里有一个非常好的解决方案：***.com/a/13903928/1804678

【参考方案1】：

参考 this post 我已经快速演示了如何使用 AngularJS 完成此操作：

javascript Demo (Plunker)

我已将引用的 Base64 代码包装在服务中，并按以下方式使用它：

$scope.downloadCSV = function() 
  var data = Base64.encode($scope.CSVData);
  window.location.href = "data:text/csv;base64," + data;
;

这个方法有are some disadvantages，但是如 cmets 中所述。我已经从 Wikipedia 页面中提取了一些关于这个主题的要点。前往那里查看完整列表。

数据 URI 不会与其包含的文档（例如 CSS 或 html 文件）分开缓存，因此会下载编码数据 每次重新下载包含的文档时。 Internet Explorer 8 将数据 URI 的最大长度限制为 32 KB。 （Internet Explorer 9 没有此限制） 在 IE 8 和 9 中，数据 URI 只能用于图像，而不能用于导航或 JavaScript 生成的文件下载。[7] Base64 编码的数据 URI 的大小是其等效二进制文件的 1/3 倍。 （但是，如果使用 HTTP 服务器使用 gzip 压缩响应） 数据 URI 没有像普通链接文件那样携带文件名。保存时，指定 MIME 类型的默认文件名是 常用。 [ . . . ]

【讨论】：

使用这种方式（客户端下载）数据大小是否受限？我认为是。

查看这种方法的缺点：en.wikipedia.org/wiki/Data_URI_scheme#Disadvantages

感谢您提供更多信息 - 我已更新答案以包含它。