AJAX / javascript: parsing JSON that contains an array

Question

I'm trying to parse a JSON message that my page gets through an AJAX response however, it keeps throwing the following error and I have no clue why:

"SyntaxError: JSON.parse: expected ',' or ']' after array element of the JSON data"

Here is what my page's javascript looks like:

var xhttp = new XMLHttpRequest();

xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
         var Response = JSON.parse(xhttp.responseText);
    }
}

And here is what the JSON the server returns looks like:

{
    "Error": "",
    "ClientInfo": [{
        "ID": 1,
        "Name": "Bill"
    }, {
        "ID": 2,
        "Name": "Sally"
    }]
}

Any idea what I'm doing wrong? JSON validators say it's valid JSON....

Answer 1

更新

正是Error:密钥使得解析器将其呕吐回来。看演示。 更新了演示，以包含带有Error:的JSON来比较结果。不幸的是，我不得不注释控制台记录了error JSON，因为调试器立即在Script error上获取了。幸运的是，该演示仍然可以运行，因此您可以在加载后忽略初始错误。

TEST 1

1. 首先尝试info按钮。 [结果：莎莉]
2. 然后点击error0按钮。 [结果：莎莉]
3. 然后尝试error1按钮。 [结果：未定义]

所以，如果你似乎解析：

1. 删除Error:""   OR
2. 将Error: ""放入数组中。

TEST 2

复制info JSON然后验证它。 JSONLint

使用JSONLint时，必须将其剥离：

{
    "ClientInfo": [
        {
            "ID": 1,
            "Name": "Bill"
        },
        {
            "ID": 2,
            "Name": "Sally"
        }
    ]
}

现在复制error JSON并验证它。

{
    "Error": "",
    "ClientInfo": [{
        "ID": 1,
        "Name": "Bill"
    }, {
        "ID": 2,
        "Name": "Sally"
    }]
}

它们都应该有效，但调试器和解析器拒绝error JSON。

<强>段

// Prepare JSON
var info =
  '{"ClientInfo": [' +
  '{"ID": 1, "Name": "Bill"},' +
  '{"ID": 2, "Name": "Sally"} ]}';

var error0 =
  '{"ClientInfo": [' +
  '{"ID": 1, "Name": "Bill"},' +
  '{"ID": 2, "Name": "Sally"},' +
  '{"Error": ""} ]}';


var error1 =
  '{"Error": ""},' +
  '{"ClientInfo": [' +
  '{"ID": 1, "Name": "Bill"},' +
  '{"ID": 2, "Name": "Sally"} ]}';


// Create a function that parses JSON Object

function JSONObj(json) {
  var jsonObj = JSON.parse(json);
  return jsonObj;
}

// A function that logs results one at a time so we can compare results

function processLog(result) {
  console.log('Result: ' + result);
}

/* Test info and errors */

var lastClient = JSONObj(info).ClientInfo[1].Name;

var errorA = JSONObj(error0).ClientInfo[1].Name;

var errorB = JSONObj(error1).ClientInfo[1].Name;

<script src="http://gh-canon.github.io/stack-snippet-console/console.min.js"></script>

<ol>
  <li>Remove this: <pre><code>"Error": "",</code></pre>
  </li>
  <li>Separate into segments (see script)</li>
  <li>Wrap each segment with single quotes `'`</li>
  <li>Add a `+` after each segment</li>
</ol>

<button onclick="processLog(lastClient);">info</button>
<button onclick="processLog(errorA);">error0</button>
<button onclick="processLog(errorB);">error1</button>

Answer 2

Json解析器接受json字符串并解析它。你已经有了一个json对象