使用JSONP從另一台服務器獲取JSON數據

Question

我正在嘗試從公司托管的網站收集JSON數據。 我不在同一個域，所以我不能只訪問它。 從標題看，它們似乎也不使用CORS。 所以我嘗試使用JSONP來解析數據，但它似乎不起作用。 我已經嘗試過$ .getJSON和$ .ajax，但是那些拋出錯誤並且不調用函數。 這是我迄今為止的解決方案，在服務器的響應中，它仍然沒有將數據包裝在getResults中。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<script type="text/javascript" src="jquery/js/jquery-1.9.0.min.js"></script>

<script>
function getResults(data) {
    console.log(data[0].name);
}
</script>
<script type='text/javascript' src='https://solstice.applauncher.com/external/contacts.json?callback=getResults'></script>

我是HTML，JavaScript和jQuery的新手，所以我真的很困惑為什么響應被包裝在函數中並且控制台日志不起作用。 任何幫助，將不勝感激。

Answer 1

您可以使用多種方法，但兩個最方便的方法是AJAX調用或使用jQuery的getJSON（）方法

使用AJAX調用

$(document).ready(function() {
  $(".btn").click(function() {
    $.ajax({type: "get",
            url: "http://api.forismatic.com/api/1.0/",
            data: {method: "getQuote",format: "jsonp",lang: "en"},
            dataType: "jsonp",
            jsonp: "jsonp",
            jsonpCallback: "myJsonMethod"
    }); 
  });
});
function myJsonMethod(response){
  console.log (response);
}

在上面的方法中， response Object包含來自API調用的所有JSON數據。

使用getJSON（）

$(document).ready(function() {
  $(".btn").click(function() {
    $.getJSON("http://api.forismatic.com/api/1.0/?method=getQuote&format=jsonp&lang=en&jsonp=myJsonMethod&?callback=?");
  });
});
function myJsonMethod(response){
  console.log (response);
}

在上面的方法中，同樣的事情發生了。

注 - > JSONP采用要在其上發送響應的回調函數的名稱。

Answer 2

JSONP是一種技術，通過它您可以將請求放入腳本標記URL（允許任何域），並在該URL中傳入一個參數，該參數指示您希望返回調用的結果腳本的函數名稱。傳遞你的數據。 在這種情況下，您似乎指定回調函數名為getResults 。

要使JSONP正常工作，您發送請求的服務器必須專門支持它，因為它需要特定類型的響應格式，並且它允許來自任何瀏覽器的任何域發出請求，這不是所有站點都想要啟用的。

因此，您需要了解的第一件事是，您要求數據的服務器是否支持JSONP，如果是，請確保您確切了解它將如何格式化響應以及它如何期望回調函數是指定（常見約定是使用callback=xxx URL參數，但不一定要這樣做。

如果您想要數據的服務器不支持JSONP，那么您根本無法使用JSONP從中獲取數據。 如果它不支持某些其他跨域請求策略，那么您無法通過瀏覽器網頁從中獲取數據，並且必須從瀏覽器以外的其他內容（如其他服務器）執行請求。

Answer 3

JSONP是服務器必須實現的方法。

如果您確定服務器接受並理解JSONP，那么您用來傳遞回調名稱的參數可能不是callback 。 如果有文檔，請查看他們的文檔。

否則，您無法從瀏覽器獲取json數據。

Answer 4

來自這里的現場樣本：

JSONP - 帶填充的JSON，即。 javascript對象包含在回調中，在我們的例子中是jsonCallback

這是文件的內容：

jsonCallback(
    {
        "sites":
        [
            {
                "siteName": "JQUERY4U",
                "domainName": "http://www.jquery4u.com",
                "description": "#1 jQuery Blog for your Daily News, Plugins, Tuts/Tips &amp; Code Snippets."
            },
            {
                "siteName": "BLOGOOLA",
                "domainName": "http://www.blogoola.com",
                "description": "Expose your blog to millions and increase your audience."
            },
            {
                "siteName": "PHPSCRIPTS4U",
                "domainName": "http://www.phpscripts4u.com",
                "description": "The Blog of Enthusiastic PHP Scripters"
            }
        ]
    }
);

用於檢索文件的代碼：

(function($) {
var url = 'http://www.jquery4u.com/scripts/jquery4u-sites.json?callback=?';

$.ajax({
   type: 'GET',
    url: url,
    async: false,
    jsonpCallback: 'jsonCallback', <-- callback here
    contentType: "application/json",
    dataType: 'jsonp',
    success: function(json) {
       console.dir(json.sites);
    },
    error: function(e) {
       console.log(e.message);
    }
});

})(jQuery);

使用JSONP從另一台服務器獲取JSON數據

問題描述

4 個解決方案

解決方案1
5 2015-08-24 20:22:34

解決方案2
2 2014-02-11 23:52:40

解決方案3
1 2014-02-11 23:53:29

解決方案4
1 2014-02-11 23:59:38

使用JSONP從另一台服務器獲取JSON數據

問題描述

4 個解決方案

解決方案1 5 2015-08-24 20:22:34

解決方案2 2 2014-02-11 23:52:40

解決方案3 1 2014-02-11 23:53:29

解決方案4 1 2014-02-11 23:59:38

解決方案1
5 2015-08-24 20:22:34

解決方案2
2 2014-02-11 23:52:40

解決方案3
1 2014-02-11 23:53:29

解決方案4
1 2014-02-11 23:59:38