如何将JSON保存到本地文本文件

Question

假设我有一个看起来像这样的JavaScript对象：

  var data = {
      name: "cliff",
      age: "34",
      name: "ted",
      age: "42",
      name: "bob",
      age: "12"
    }

var jsonData = JSON.stringify(data);

我将其转换为JSON格式。如何将此JSON保存到本地文本文件中，以便可以在记事本等程序中打开它。

- thatOneGuy

Answer 1

Node.js：

var fs = require('fs');
fs.writeFile("test.txt", jsonData, function(err) {
    if (err) {
        console.log(err);
    }
});

浏览器 (Web API)：

function download(content, fileName, contentType) {
    var a = document.createElement("a");
    var file = new Blob([content], {type: contentType});
    a.href = URL.createObjectURL(file);
    a.download = fileName;
    a.click();
}
download(jsonData, 'json.txt', 'text/plain');

- Rafał Łużyński

---

可以使用type=file的input标签，就像这里提供的示例一样：https://dev59.com/_WYr5IYBdhLWcg3wYpUg。请注意保持原文意思，同时使内容更加易懂。 - Rafał Łużyński

当我这样做时，会出现[object Object]的结果。 - Jack

@JackNicholson 我也刚刚得到了 [object Object].. 我必须先调用 JSON.stringify()，然后传递该值，而不是对象本身。 - ne1410s

在调用 a.click() 后，我们需要调用 revokeObjectURL 方法来告诉浏览器不再保留对文件的引用：URL.revokeObjectURL(a.href)。更多信息请参考：https://developer.mozilla.org/en-US/docs/Web/API/URL/revokeObjectURL。 - andreivictor

@Enrique 在 node.js 中当然可以。在 webapi 中，用户选择目标目录，所以不行。 - Rafał Łużyński

Answer 2

这是我保存本地数据到文本文件的解决方案。

function export2txt() {
  const originalData = {
    members: [{
        name: "cliff",
        age: "34"
      },
      {
        name: "ted",
        age: "42"
      },
      {
        name: "bob",
        age: "12"
      }
    ]
  };

  const a = document.createElement("a");
  a.href = URL.createObjectURL(new Blob([JSON.stringify(originalData, null, 2)], {
    type: "text/plain"
  }));
  a.setAttribute("download", "data.txt");
  document.body.appendChild(a);
  a.click();
  document.body.removeChild(a);
}

<button onclick="export2txt()">Export data to local txt file</button>

- dabeng

---

非常感谢。使用纯JavaScript的绝妙而简单的解决方案。 - jonny789

太棒了！！ :D - Jcc.Sanabria

感谢关于更好的JSON格式JSON.stringify(originalData, null, 2)的缩进提示。如果文件是JSON文件，则将文件命名为"data.json"应该更加合适。 - Patronaut

我支持@Patronaut的评论。另外，请将 type: "text/plain" 更改为：type: "application/json"。 - WinEunuuchs2Unix

Answer 3

这里有一个纯JS的解决方案。你可以使用HTML5 saveAs来实现。例如，这个库可能会有所帮助：https://github.com/eligrey/FileSaver.js
查看演示：http://eligrey.com/demos/FileSaver.js/
顺便说一下，没有关于JSON保存的信息，但是你可以将文件类型更改为"application/json"并将格式更改为.json。

import { saveAs } from 'file-saver'

let data = { a: 'aaa' , b: 'bbb' }

let blob = new Blob([JSON.stringify(data)], { type: 'application/json' })
    
saveAs(blob, 'export.json')

- aslantorret

---

"application/json"和.json与HTML文件系统配合良好。同时使用这个来防止任何JSON解析错误，如“JSON中的意外标记？”。谢谢。 - Ajay Singh

Answer 4

我采用了dabeng的解决方案，并将其转录为类方法。

class JavascriptDataDownloader {

    constructor(data={}) {
        this.data = data;
    }

    download (type_of = "text/plain", filename= "data.txt") {
        let body = document.body;
        const a = document.createElement("a");
        a.href = URL.createObjectURL(new Blob([JSON.stringify(this.data, null, 2)], {
            type: type_of
        }));
        a.setAttribute("download", filename);
        body.appendChild(a);
        a.click();
        body.removeChild(a);
    }
} 

new JavascriptDataDownloader({"greetings": "Hello World"}).download();

- Jcc.Sanabria

---

我喜欢这个答案，因为它甚至可以在控制台中运行。谢谢。 - Hayyaun

在iPhone设备上，文件保存在哪里？ - undefined