如何使用jsonp和jquery加載json文件

Question

我在遠程URL中有一個文件abcjsn.json，如： http ：//abc.com/abcjsn.json Json文件的內容是：

    {
"root": {
    "node": [
        {
            "@attributes": {
                "id": "6",
                "name": "Europe",
                "description": "European Curricula"
            },
            "node": {
                "@attributes": {
                    "id": "2553",
                    "name": "Ireland",
                    "description": "Irish Curricula"
                },
                "node": {
                    "@attributes": {
                        "id": "3083",
                        "name": "Primary School Curriculum",
                        "description": "Primary Curriculum"
                    }
                }
            }
        },
        {
            "@attributes": {
                "id": "7",
                "name": "Middle East",
                "description": "Middle Eastern Curricula"
            }
        },
        {
            "@attributes": {
                "id": "8",
                "name": "North America",
                "description": "North American Curricula"
            }
        },
        {
            "@attributes": {
                "id": "9",
                "name": "South America",
                "description": "South American Curricula"
            }
        }
    ]
}

}

我正在使用以下代碼來訪問它：

var url = "http://abc.com/abcjsn.json"

        $.ajax({
          url: url,
          dataType: 'jsonp',
          data:  {},
          success: function(data) { alert(data); },
          jsonp: 'jsonp'
        });

但我無法訪問它。 它更新得警惕。 我該怎么做。

Answer 1

服務器應該返回類似的東西

myCallBackFunction （'{....}'）

並且你的myCallBackFunction應該調用j Query.parseJSON(...)

然后就沒事了。

Answer 2

假設服務器將JSON包裝在一個函數中，那么這應該工作：

var url = "http://abc.com/abcjsn.json?callback=?";

$.getJSON(url, function(data){
  console.log(data);
}

注意url中的callback參數。

Answer 3

這將允許您從Cross Domain訪問：

---

上面問題中的JSON應該包含在function調用中：

第1步：使function可用：

確保事先在global window object上定義了myCallbackFunc （加載script-tag后將立即執行此功能）。 例如：

window.myCallbackFunc = function(jsonData) {
   // do something with the jsondata
}

第2步：准備remote JSON file ：

確保遠程JSON file正在調用傳遞給它的JSON的myCallbackFunc function 。 例如：

myCallbackFunction({
  "root": {...}
});

第3步：准備並加載script標記：

然后，您應該使用script標記請求此文件，如下所示：

var scriptEl = document.createElement('script');
scriptEl.src =  "http://example.com/abcjsn.json?callback=myCallbackFunc";
scriptEl.type = "text/javascript";
document.body.appendChild(scriptEl);

注意：我們需要在query-string添加callback ，其值具有我們function的name （在本例中為myCallbackFunc ）。 加載文件后將執行此功能。

祝好運...

Answer 4

做這個

 var url = "http://abc.com/abcjsn.json"

    $.ajax({
      url: url,
      dataType: 'json',
      data:  {},
      success: function(data) { alert(data); }
    });

編輯

JsonP被刪除了，因為如果你使用jsonp你正在下載的源應該是這樣的

myLocalFunc({
    // Contnet of that json;
});

加載時，執行名為myLocalFunc的函數。 你打電話的只是一個json。 我假設你有跨域訪問權限。

編輯

如果您沒有跨域訪問權限，那么您必須在服務器中實現一個代理，該代理將請求遠程服務器並將結果提供給您或用戶在此處討論的一些跨域技術。 但請注意，僅當您有權訪問目標域時，它們才適用。