javascript - 如何从另一个文件夹读取 JSON 文件？

Question

我有一个简单的文件夹结构，例如:

project  
│
└───data
│     file.json
│    
└───js
      test.js

我希望读取 test.js 中的 file.json 来执行其他一些后端操作。这是一个类似(但通用)的 JSON 文件:

{"key1": 50, "key2": 6, "key3": 20,
"ke4": 18, "key5": 38, "key6": 30}

到目前为止，我已经尝试过:

var request = new XMLHttpRequest();
request.open("GET", "< path >", false);
request.send(null)
var my_JSON_object = JSON.parse(request.responseText);
alert(my_JSON_object.result[0]);

但是并没有产生结果。

我检查过这个post还有这个one 。他们问类似的问题，但他们已经很老了。

所以，我的问题是:如何做到这一点？是否有一种新的方法(例如获取)来做到这一点？

Answer 1

尽管这些答案有点旧，但过时的代码仍然有效，回答了问题的前半部分。我不会关心已弃用的代码，只要它有效即可。我不确定 jQuery 的这个基本实现有多新，但它的工作原理就像其他解决方案一样:

 $.getJSON('data/file.json', function(data) {
     console.log(JSON.stringify(data));
 });

此外，从您在示例中给出的代码来看，它不起作用，因为您没有正确实现其异步性质。由于是异步操作，因此需要指定一个回调函数，在文件加载后执行:

function readTextFile(file, callback) {
   var request = new XMLHttpRequest();
   request.overrideMimeType("application/json");
   request.open("GET", "< path >", false);
   request.onreadystatechange = function() {
       if (request.readyState === 4 && request.status == "200") {
          callback(request.responseText);
       }
   }
   request.send(null);
}

// Implementation:
readTextFile("data/file.json", function(text){
   var my_JSON_object = JSON.parse(text);
   console.log(my_JSON_object);
   alert(my_JSON_object.result[0]);
});