将字符串数组的字符串解析回数组

Question

我有一个数组字符串数组保存在数据库列中作为varchar：

[["ben"],["john","mike"],["ben"]]

我想将数据解析回数组数组，因此我可以在屏幕上显示数据。在尝试这样做时，我遇到了一个尴尬和恼人的问题：

这是在服务器上生成并发送回客户端的JSON响应：

var response = "[{\"Names\":\""+ rows[i].Names + "\"}]";
res.send(response);

这是我编写的用于解析数据的客户端代码：

jQuery.ajax({
  type: "GET",
  url: ...,
  dataType: 'json',
  contentType: "application/json; charset=utf-8"
}).done(function(data) {
  jQuery.each(JSON.parse(data), function(i, parsedData) {
    var names = JSON.parse(parsedData.Names);
    var labels = "";
    for (var n = 0; n < names.length; n++) {
      var label = "<label>" + names[n] + "</label>";
      labels = labels + label;
    }
    console.log(labels);
  });
});

这是我得到的错误：

这是JSON验证：

我该如何解决这个问题？

Answer 1

有一条简单的规则：

永远不要使用字符串工具来创建或修改JSON。没有字符串连接（+），没有字符串替换，上帝禁止没有正则表达式。

生成JSON的唯一方法是在数据结构上使用JSON序列化程序。操作JSON的唯一方法是解析它，修改数据结构，然后再次序列化它。对于所有意图和目的，JSON本身将被视为常量。

您的服务器代码违反了该规则。改变它：

var responseData = [{
    Names: rows[i].Names
}];

var response = JSON.stringify(responseData);

在上文中，responseData是一种数据结构。您可以自由修改它。 response源于此。您不可以自由修改它，您可以使用response唯一能够将其写入客户端。

请注意，rows[i].Names本身可能是JSON，因此您的回复中最终会出现双重编码值。

如果服务器发送Content-Type: application/json标头，客户端可以使用：

jQuery.get("...").done(function(data) {
  // data is already parsed here, you don't need to parse it

  jQuery.each(data, function(i, item) {
    // item.Names is not yet (!) parsed here, so we need to parse it
    var names = JSON.parse(item.Names);

    var labels = names.map(function (name) {
      return $("<label>", {text: name});
    }

    console.log( labels );
  });
});

如果您不想在客户端上拨打JSON.parse()，则必须在服务器上调用它：

var responseData = [{
    Names: JSON.parse(rows[i].Names)
}];

var response = JSON.stringify(responseData);