Десериализация JSON в объект JavaScript

У меня есть строка в серверном приложении Java, доступ к которой осуществляется с помощью AJAX. Это выглядит примерно так:

var json = [{
    "adjacencies": [
        {
          "nodeTo": "graphnode2",
          "nodeFrom": "graphnode1",
          "data": {
            "$color": "#557EAA"
          }
        }
    ],
    "data": {
      "$color": "#EBB056",
      "$type": "triangle",
      "$dim": 9
    },
    "id": "graphnode1",
    "name": "graphnode1"
},{
    "adjacencies": [],
    "data": {
      "$color": "#EBB056",
      "$type": "triangle",
      "$dim": 9
    },
    "id": "graphnode2",
    "name": "graphnode2"
}];

когда строка извлекается с сервера, есть ли простой способ превратить это в живой объект JavaScript (или массив)? Или мне нужно вручную разделить строку и построить объект вручную?

8 ответов


поддержка современных браузеров JSON.parse().

var arr_from_json = JSON.parse( json_string );

в браузерах, которые этого не делают, вы можете включить на json2 библиотека.


весь смысл JSON заключается в том, что строки JSON могут быть преобразованы в собственные объекты, ничего не делая. Проверьте это ссылке

можно использовать eval(string) или JSON.parse(string).

, eval - это рискованно. От json.org:

функция eval очень быстрая. Однако он может компилировать и выполнять любую программу JavaScript, так что могут возникнуть проблемы с безопасностью. Использование eval указывается, когда источник является надежным и компетентным. Гораздо безопаснее использовать парсер JSON. В веб-приложениях через XMLHttpRequest, сообщение разрешается только тому же источнику, который предоставьте эту страницу, чтобы она была надежной. Но это может оказаться неуместным. Если сервер не является строгим в своей кодировке JSON, или если он не скрупулезно проверяет все свои входные данные, затем он может доставить недопустимый текст JSON, который может содержать опасный скрипт. Функция eval выполнит сценарий, высвободив свою злобу.


сделайте как jQuery делает! (сущность)

function parseJSON(data) {
    return window.JSON && window.JSON.parse ? window.JSON.parse( data ) : (new Function("return " + data))(); 
}
// testing
obj = parseJSON('{"name":"John"}');
alert(obj.name);

таким образом, вам не нужна внешняя библиотека, и она все еще работает в старых браузерах.


чтобы собрать весь элемент массива и вернуть объект JSON

collectData: function (arrayElements) {

        var main = [];

        for (var i = 0; i < arrayElements.length; i++) {
            var data = {};
            this.e = arrayElements[i];            
            data.text = arrayElements[i].text;
            data.val = arrayElements[i].value;
            main[i] = data;
        }
        return main;
    },

для анализа тех же данных, которые мы проходим, как это

dummyParse: function (json) {       
        var o = JSON.parse(json); //conerted the string into JSON object        
        $.each(o, function () {
            inner = this;
            $.each(inner, function (index) {
                alert(this.text)
            });
        });

}

вы также можете использовать eval() но JSON.parse() - это более безопасный и простой способ, так почему бы вам?

и

var yourJsonObject = JSON.parse(json_as_text);

я не вижу причин, почему вы предпочитаете использовать eval. Это только ставит под угрозу ваше заявление.

что сказал - это is также возможно.

плохо - но работает

var yourJsonObject = eval(json_as_text);

почему eval плохой идея?

рассмотрим следующий пример.

некоторая третья сторона или пользователь предоставили данные строки JSON.

var json = `
[{
    "adjacencies": [
        {
          "nodeTo": function(){
            return "delete server files - you have been hacked!";
          }(),
          "nodeFrom": "graphnode1",
          "data": {
            "$color": "#557EAA"
          }
        }
    ],
    "data": {
      "$color": "#EBB056",
      "$type": "triangle",
      "$dim": 9
    },
    "id": "graphnode1",
    "name": "graphnode1"
},{
    "adjacencies": [],
    "data": {
      "$color": "#EBB056",
      "$type": "triangle",
      "$dim": 9
    },
    "id": "graphnode2",
    "name": "graphnode2"
}]
`;

ваш серверный скрипт обрабатывает эти данные.

используя JSON.parse:

window.onload = function(){
  var placeholder = document.getElementById('placeholder1');
  placeholder.innerHTML = JSON.parse(json)[0].adjacencies[0].nodeTo;
}

кину:

Uncaught SyntaxError: Unexpected token u in JSON at position X. 

функция не будет выполняться.

вы в безопасности.

используя eval():

window.onload = function(){
  var placeholder = document.getElementById('placeholder1');
  placeholder.innerHTML = eval(json)[0].adjacencies[0].nodeTo;
}

выполнит функцию и вернет текст.

если я заменю эту безвредную функцию на ту, которая удаляет файлы из папки вашего сайта, Вы были взломаны. В этом примере не будет ошибок/предупреждений.

вы не в безопасности.

я смог манипулировать текстовой строкой JSON, поэтому она действует как функция, которая будет выполняться на сервере.

eval(JSON)[0].adjacencies[0].nodeTo ожидает обработайте строку JSON, но на самом деле мы просто выполнили функцию на нашем сервере.

это также может быть предотвращено, если мы на стороне сервера проверять все пользовательские данные перед передачей их в


и если вы также хотите, чтобы десериализованный объект имел функции, вы можете использовать мой маленький инструмент:https://github.com/khayll/jsmix

//first you'll need to define your model
var GraphNode = function() {};
GraphNode.prototype.getType = function() {
   return this.$type;
}

var Adjacency = function() {};
Adjacency.prototype.getData =n function() {
    return this.data;
}

//then you could say:
var result = JSMix(jsonData)
    .withObject(GraphNode.prototype, "*")
    .withObject(Adjacency.prototype, "*.adjacencies")
    .build();

//and use them
console.log(result[1][0].getData());

Если вы вставляете строку на стороне сервера в html, вам не нужно ничего делать:

для простой java в jsp:

var jsonObj=<%=jsonStringInJavaServlet%>;

для распорки ширины jsp:

var jsonObj=<s:property value="jsonStringInJavaServlet" escape="false" escapeHtml="false"/>;

Я думаю, это должно помочь:

также документы также доказывают, что вы можете использовать require() для файлов json: https://www.bennadel.com/blog/2908-you-can-use-require-to-load-json-javascript-object-notation-files-in-node-js.htm

var jsonfile = require("./path/to/jsonfile.json");
node = jsonfile.adjacencies.nodeTo;
node2 = jsonfile.adjacencies.nodeFrom;
node3 = jsonfile.adjacencies.data.$color;
//other things.