Question

是否可以将JSON数据保存到本地文本文件中？所以稍后我可以再次使用它来加载该文件并获取存储的JSON数据。其实我真的想要做的是在文本文件中导出JSON数据，以便我以后可以用作import.Any建议或解决方案在这里？

这是我想用来导出到文本的一些例子。

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

Answer 1

是否可以将JSON数据保存到本地文本文件中？

是。目前链接jsfiddle的JavaScript会创建一个.txt文件，而不是有效的JSON文件。

您可以使用try..catch..finally和JSON.parse()来检查<textarea>元素的输入是否有效JSON。如果.value的{{1}}有效<textarea>，请使用JSON或Blob URL构造函数创建Blob，并将MIME File属性设置为{{ 1}}。和type，否则通知用户输入无效"application/json"。

URL.createObjectURL()

JSON

(function () {

 let file, url, reader = new FileReader;
 
 function createJSONFile(json) {
    let e = void 0;
    try {
      JSON.parse(json)
    } catch (err) {
      e = err;
      code.textContent = e;
    }
    finally {
      if (e) {
        code.classList.add("invalid");
        return "Invalid JSON";
      }
      else {
        code.classList.remove("invalid");
        file = new File([json], "info.json", {type:"application/json"});
        url = URL.createObjectURL(file);
        return url;
      }
    }
  };
  
  function revokeBlobURL() {
    window.removeEventListener("focus", revokeBlobURL);
    URL.revokeObjectURL(url);
    if (file.close) {
      file.close();
    }    
  }
  
  function readJSON(e) {
    reader.readAsText(input.files[0]);
  }
 
  let create = document.getElementById("create"),
    textbox = document.getElementById("textbox"),
    code = document.querySelector("code"),
    input = document.querySelector("input[type=file]"),
    pre = document.querySelector("pre");

  create.addEventListener("click", function () {
    var link = document.createElement("a");
    link.setAttribute("download", "info.json");
    var json = createJSONFile(textbox.value);
    if (json !== "Invalid JSON") {
      link.href = json;
      document.body.appendChild(link);
      code.textContent = "Valid JSON";
      link.click();
      window.addEventListener("focus", revokeBlobURL);
    } else {
      code.textContext = json;
    }
  }, false);
  
  reader.addEventListener("load", function() {
    pre.textContent = JSON.stringify(reader.result, null, 2);
  });
  
  input.addEventListener("change", readJSON);
})();

Answer 2

你问是否可能，你的例子清楚地表明它是。我想你想知道如何在创建后阅读文本文件。在这种情况下，您可以按照以下问题回答：Read a local text file using Javascript

JSON只是一个格式化的字符串，允许JavaScript重建对象，这意味着您只需将字符串存储到文本文件中，然后再次读取它，并使用JSON.parse()将其转换为对象。

这是一个有效的例子：

＆＃13;

(function () {
var textFile = null,
  makeTextFile = function (text) {
    var data = new Blob([text], {type: 'text/plain'});

    // If we are replacing a previously generated file we need to
    // manually revoke the object URL to avoid memory leaks.
    if (textFile !== null) {
      window.URL.revokeObjectURL(textFile);
    }

    textFile = window.URL.createObjectURL(data);

    return textFile;
  };


  var create = document.getElementById('create'),
    textbox = document.getElementById('textbox');

  create.addEventListener('click', function () {
    var link = document.createElement('a');
    link.setAttribute('download', 'info.txt');
    link.href = makeTextFile(textbox.value);
    document.body.appendChild(link);

    // wait for the link to be added to the document
    window.requestAnimationFrame(function () {
      var event = new MouseEvent('click');
      link.dispatchEvent(event);
      document.body.removeChild(link);
		});
    
  }, false);
})();

		var fileInput = document.getElementById('files');
		var fileDisplayArea = document.getElementById('test');

		fileInput.addEventListener('change', function(e) {
			var file = fileInput.files[0];
			var textType = /text.*/;

			if (file.type.match(textType)) {
				var reader = new FileReader();

				reader.onload = function(e) {
					fileDisplayArea.innerText = reader.result;
				}

				reader.readAsText(file);	
			} else {
				fileDisplayArea.innerText = "File not supported!"
			}
		});

＆＃13;

<textarea id="textbox">Type something here</textarea> <button id="create">Create file</button> 

<input type="file" id="files" name="files" multiple />
<output id="list"></output>
<div id = "test">

</div>

＆＃13;

将您的json字符串保存到文本文件，然后阅读它。这只是一个指南。

将JSON数据保存到文本文件并读取它

2 个答案: