Question

我有一个包含一些信息的javascript对象。我想将其转换为JSON并将其下载为.json文件。似乎我只能将JSON.stringify(obj)转换为JSON 但是我实际上如何将其下载为.json文件？

Answer 1

如果您只是想通过JavaScript下载数据，我不确定这是一个特定于React的问题，但是我使用的以下代码段创建了一个链接来下载数据内容，实际上是单击该元素，最后从DOM中删除它。它应该同时支持现代浏览器和较旧的IE：

private exportToJson(objectData: SomeObject) {
    let filename = "export.json";
    let contentType = "application/json;charset=utf-8;";
    if (window.navigator && window.navigator.msSaveOrOpenBlob) {
      var blob = new Blob([decodeURIComponent(encodeURI(JSON.stringify(objectData)))], { type: contentType });
      navigator.msSaveOrOpenBlob(blob, filename);
    } else {
      var a = document.createElement('a');
      a.download = filename;
      a.href = 'data:' + contentType + ',' + encodeURIComponent(JSON.stringify(objectData));
      a.target = '_blank';
      document.body.appendChild(a);
      a.click();
      document.body.removeChild(a);
    }
  }

还值得注意的是，引述in this SO question的方法有很多种。

Answer 2

您将无法直接在计算机的文件系统上创建文件，因为这将带来巨大的安全风险。您无法使用JavaScript在网页上执行此操作。

您可以编写服务器端服务以将您的状态发布到该服务，并创建一个文件-然后您可以下载该文件，或者对服务器端存储该文件的位置感到满意。

通过inMemory Create a file in memory for user to download, not through server

的另一种方法

Answer 3

对于那些到达这里并寻找更简单解决方案的人：

         <button
            href={`data:text/json;charset=utf-8,${encodeURIComponent(
              JSON.stringify(YOURJSON)
            )}`}
            download="filename.json"
          >
            {`Download Json`}
          </button>

将对象转换为JSON并在React中作为.json文件下载

3 个答案: