ローカルのJSONファイルを変数にロード

Question

javascriptの変数に.jsonファイルをロードしようとしていますが、動作させることができません。それはおそらくほんの小さなエラーですが、私はそれを見つけることができません。私はこのようなスタティックデータを使用する場合

すべてが正常に動作します：

var json = { 
      id: "whatever", 
      name: "start", 
      children: [{ 
         "id":"0.9685","name":" contents:queue"},{ 
         "id":"0.79281","name":" contents:mqq_error"}}] 
     } 

ここで説明するようなので、私はcontent.jsonファイルに{}でだすべてのものを入れて、ローカルのjavascript変数にそれをロードしようとしました：load json into variable

var json = (function() { 
     var json = null; 
     $.ajax({ 
      'async': false, 
      'global': false, 
      'url': "/content.json", 
      'dataType': "json", 
      'success': function (data) { 
       json = data; 
      } 
     }); 
     return json; 
    })(); 

私はクロームデバッガでそれを実行し、それが常に変数JSONの値がnullであることを私に伝えます。 content.jsonは、それを呼び出す.jsファイルと同じディレクトリにあります。

私は何を欠席しましたか？

Answer 1

オブジェクトを直接content.jsonに貼り付けた場合、jsonは無効です。 jsonキーのAND値は、値が数値でない限り、二重引用符で囲まなければなりません（単一ではありません）。以下は、あなたのオブジェクトが有効なjsonとなります。

{ 
    "id": "whatever", 
    "name": "start", 
    "children": [{ 
    "id":"0.9685","name":" contents:queue"},{ 
    "id":"0.79281","name":" contents:mqq_error"}] 
} 

（あなたも、余分な}を持っていた）

Answer 2

考えられる原因は2つあります

1. AJAXは非同期ですので、あなたは、外側の関数から戻ったときjsonは不定となります。ファイルがロードされると、コールバック関数はjsonに何らかの値を設定しますが、その時点では誰も気にしません。

   'async': falseでこれを修正しようとしています。これが機能するかどうかを確認するには、コードに次の行を追加して、ブラウザのコンソールをチェックしてください。

   console.log(['json', json]); 
   

2. パスが間違っているかもしれません。 HTMLドキュメントでスクリプトを読み込むのと同じパスを使用します。したがって、スクリプトがjs/script.jsの場合は、js/content.json

   を使用してください。ブラウザによっては、アクセスしようとしたURLとその方法（成功/エラーコード、HTMLヘッダーなど）を表示するブラウザがあります。ブラウザの開発ツールで何が起こっているかを確認してください。

Answer 3

私のソリューションは、hereに答えとして、使用することです：

var json = require('./data.json'); //with path 

ファイルは一度だけロードされ、さらに要求がキャッシュを使用しています。