JSONをJavaScriptオブジェクトに逆シリアル化する

AJAXを使用してアクセスされるJavaサーバーアプリケーションに文字列があります。次のようになります。

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オブジェクト（または配列）に変換する簡単な方法はありますか？または、文字列を手動で分割し、オブジェクトを手動で構築する必要がありますか？

最新のブラウザがサポートしてい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を介したWebアプリケーションでは、そのページを提供するのと同じオリジンへの通信のみが許可されるため、そのページは信頼されます。しかし、それは有能ではないかもしれません。サーバーの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。アプリケーションを危険にさらすだけです。

それは言った-これはも可能。

悪い-でもうまくいく

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;
}

関数を実行し、テキストを返します。

その無害な機能をWebサイトのフォルダーからファイルを削除する機能に置き換えると、ハッキングされたことになります。この例では、エラー/警告はスローされません。

あなたは安全ではありません。

JSONテキスト文字列を操作して、サーバー上で実行される関数として機能させることができました。

eval(JSON)[0].adjacencies[0].nodeTo JSON文字列を処理することを期待していますが、実際には、サーバーで関数を実行しただけです。

これは、eval()関数に渡す前にユーザー提供のすべてのデータをサーバー側でチェックする場合にも防止できますが、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に貼り付ける場合は、何もする必要はありません。

jspのプレーンJavaの場合：

var jsonObj=<%=jsonStringInJavaServlet%>;

jsp幅ストラットの場合：

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

これは役立つと思います：

また、ドキュメントは、jsonファイルにrequire（）を使用できることも証明しています：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.