JSON 解析文件路径

Posted 2023-02-22

【中文标题】JSON 解析文件路径

【英文标题】：JSON Parse File Path

【发布时间】：2013-06-04 04:30:47

【问题描述】：

我一直在尝试获取本地文件的正确路径。我有以下目录：

Resources ->
   data ->
       file.json
   js ->
     folder ->
        script.js
   html ->
      folder ->
         file1.html

我正在从file1.html执行script.js，带有js代码：

var answers = JSON.parse('../../data/file.json');
alert(answers);

但它不起作用，甚至警报都没有启动。 怎么了？

我也试过这个：

function readJSON(file) 
    var request = new XMLHttpRequest();
    request.open('GET', file, false);
    request.send(null);
    if (request.status == 200)
        return request.responseText;
;

var temp = readJSON('../../data/file.json');
alert(temp);

在这种情况下警报未定义。

【问题讨论】：

Alert undefined for me.，status 是什么，它是否在您的控制台中产生了错误？

最后，if (request.status == 200) 为我提出了问题。即使找到文件，它也会给出 0。如果我删除它，一切正常。谢谢大家！

【参考方案1】：

由于在data/目录下，你需要这样做：

文件路径为'../../data/file.json'

$.getJSON('../../data/file.json', function(data)          
    alert(data);
);

纯 JS：

   var request = new XMLHttpRequest();
   request.open("GET", "../../data/file.json", false);
   request.send(null)
   var my_JSON_object = JSON.parse(request.responseText);
   alert (my_JSON_object.result[0]);

【讨论】：

我没有意识到您可以将 URI 传递给 JSON.parse 并让它为您执行 REQUEST，这是在哪里记录的？

是的..编辑正在进行中..猜测应该在事后回答

因为你的纯 js 警报也没有启动

XMLHttpRequest 无法加载 file:///.../data.json。跨源请求仅支持协议方案：http、data、chrome、chrome-extension、https、chrome-extension-resource。

我在本地开发时遇到同样的XMLHttpRequest 错误。是否有任何非网络调用来加载本地 JSON 文件并对其进行解析以在客户端 javascript 中使用？

【参考方案2】：

此解决方案使用异步调用。它可能比同步解决方案更有效。

var request = new XMLHttpRequest();
request.open("GET", "../../data/file.json", false);
request.send(null);
request.onreadystatechange = function() 
  if ( request.readyState === 4 && request.status === 200 ) 
    var my_JSON_object = JSON.parse(request.responseText);
    console.log(my_JSON_object);
  

【讨论】：

欢迎来到 SO。好答案。我对其进行了编辑，因为最好是当一个答案独立存在时。在 cmets 中可以就其他答案进行对话。

主线程上的同步 XMLHttpRequest 已被弃用，因为它会对最终用户的体验产生不利影响。如需更多帮助，请查看xhr.spec.whatwg.org。

@Evorlor 将第 2 行的 false 更改为 true。否则它是一个同步操作。

【参考方案3】：

Loading local JSON file

使用类似的东西

$.getJSON("../../data/file.json", function(json) 
    console.log(json); // this will show the info in firebug console 
    alert(json);
);

【参考方案4】：

var request = new XMLHttpRequest();
request.open("GET","<path_to_file>", false);
request.send(null);
var jsonData = JSON.parse(request.responseText);

这段代码对我有用。

【参考方案5】：

如果Resources 是根路径，访问file.json 的最佳方式是通过/data/file.json

【讨论】：

其实我是在titan webview中制作的，所以通常资源应该是根路径。如果我制作 document.location.pathname 并在浏览器中启动，我肯定会得到 file:/// ...

【参考方案6】：

我的工作代码是：

var request = new XMLHttpRequest();
request.open("GET", "<path_to_file>", false);
request.overrideMimeType("application/json");
request.send(null);
var jsonData = JSON.parse(request.responseText);
console.log(jsonData);

【参考方案7】：

即使回答了很久，我这里是另一个不需要创建请求的。我创建了一个 lg.js 脚本，其中包含一个类和一些函数（setLg、de、en、...） 每个“lg”函数（de、en、fr、...）都提供一个包含翻译的 json 对象。

"use strict"
class Lg 
  constructor()  this.tr = this.en(); 
  setLg(l) 
    if l == "de" this.tr = this.de(); 
    if l == "en" this.tr = this.en();
  de() 
   "item": "Artikel",
   "login": "Login"
  
  en() 
   "item": "Item",
   "login": "login"
  
 
 var lg = new Lg(); //global accessable object

然后您可以通过“lg.tr.item”使用它 您还可以创建一个小函数，检查“key”是否在 JSON 对象中以进行某种错误检查。