【问题标题】：How to read json file located in project folder in iPhone PhoneGap using Javascript如何使用Javascript读取位于iPhone PhoneGap项目文件夹中的json文件
【发布时间】：2013-08-12 12:39:11
【问题描述】：

我必须从位于项目中的文件夹中读取 JSON 文件。

我正在使用以下代码：

var obj = "www/places.json";

如何使用 Javascript 读取 iPhone PhoneGap 中项目文件夹 www 中的 JSON 文件？

【问题讨论】：

看看stackoverflow.com/questions/14908717/…，它有一个如何读取文件并将其解析为 JSON 的示例。

标签： javascript jquery ios json cordova

【解决方案1】：

您会像在服务器上一样阅读它。

解决方案 1 - jQuery

如果 jQuery 的使用没有问题，那么像这样使用它：

//Load categories object JSON
jQuery.getJSON("categories.json", function(data){         
    // data is yours parsed object
});

示例：

HTML：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"/>
    <script src="http://www.fajrunt.org/js/jquery-1.9.1.min.js"></script>       
    <title>Read JSON Demo</title>

    <script>    
        jQuery.getJSON("categories.json", function(data){         
            alert(data.balance);
        });         
    </script>
</head>

<body>
    Read JSON Demo
</body>
</html>

JSON 文件：

{"balance":1000.21,"num":100,"nickname":null,"is_vip":true,"name":"foo"}

解决方案 2 - 纯 javascript

如果您只想使用 vanilla javascript，那么这是适合您的解决方案

var xmlhttp;
var jsonObject;

// code for IE7+, Firefox, Chrome, Opera, Safari
if (window.XMLHttpRequest)
{
    xmlhttp=new XMLHttpRequest();
}
// code for IE6, IE5
else
{
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}

xmlhttp.onreadystatechange=function()
{
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
        jsonObject = JSON.parse(xmlhttp.responseText);
        alert(jsonObject.balance);                       
    }
}

xmlhttp.open("GET","categories.json",true);
xmlhttp.send();

示例：

HTML：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"/>
    <title>Read JSON Demo</title>

    <script>
        var xmlhttp;
        var jsonObject;

        // code for IE7+, Firefox, Chrome, Opera, Safari
        if (window.XMLHttpRequest)
        {
            xmlhttp=new XMLHttpRequest();
        }
        // code for IE6, IE5
        else
        {
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }

        xmlhttp.onreadystatechange=function()
        {
            if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
                jsonObject = JSON.parse(xmlhttp.responseText);
                alert(jsonObject.balance);                       
            }
        }

        xmlhttp.open("GET","categories.json",true);
        xmlhttp.send();
    </script>
</head>

<body>
    Read JSON Demo
</body>
</html>

JSON 文件：

{"balance":1000.21,"num":100,"nickname":null,"is_vip":true,"name":"foo"}

【讨论】：

感谢您不只是假设 jQuery！不过在这种情况下，它确实看起来更有吸引力。
加载失败：跨域请求仅支持协议方案：http、data、chrome、chrome-extension、https。

【解决方案2】：

我遇到了同样的问题并通过以下 sn-p 解决了：

dojo.ready(function(){

   var xhrArgs = {
          url: "file:///Users/Desktop/configJSON.txt",
          handleAs: "json",
          load: function(data){

           targetNode.innerHTML = data;

                   // Your data from JSON
               alert("Name : "+data.fields[0].name+" Type :          "+data.fields[0].type+" Alias : "+data.fields[0].alias
               +" Editable : "+data.fields[0].editable);


      },
      error: function(error){
                      // targetNode.innerHTML = "An unexpected error occurred: " + error;
                      alert("An unexpected error occurred: " + error);
              }
              }

              // Call the asynchronous xhrGet
              var deferred = dojo.xhrGet(xhrArgs);
          });

      </script>

    </head>

    <body>

              <div id="licenseContainer"></div>
<body>

【讨论】：