jQuery .ajax（）調用失敗

我試圖做一個jQuery .ajax()調用公共Web服務，我無法找到正確的語法。jQuery .ajax（）調用失敗

我試過幾種不同的實現。這一個：

$.ajax({ 
    url: 'http://www.geognos.com/api/en/countries/info/all.jsonp', 
    dataType: "jsonp", 
    success: function() { 
    alert('JSONP call succeeded!'); 
    } 
});

它失敗，出現以下錯誤：

all.jsonp:1 Uncaught ReferenceError: callback is not defined

這一個：

XMLHttpRequest cannot load http://www.geognos.com/api/en/countries/info/all.json. Origin http://localhost:8888 is not allowed by Access-Control-Allow-Origin.

我：

$.ajax({ 
    url: 'http://www.geognos.com/api/en/countries/info/all.json', 
    dataType: "json", 
    success: function() { 
    alert('JSON call succeeded!'); 
    } 
});

與此錯誤失敗通過我的本地IIS7實例爲頁面提供服務。我也嘗試過$.getJSON()的各種組合，結果相似。我錯過了什麼？

Here's a JSFiddle上述代碼。

更新：雖然認爲我們有一個解決方案，但在進行JSONP調用時仍然會出現callback is not defined錯誤，即使警報/日誌代碼被調用。響應URL看起來是這樣的：

http://www.geognos.com/api/en/countries/info/all.jsonp?callback=undefined&157148585

和JSON響應被包裹這樣的：用在.ajax()添加到URL的末尾回調名

callback({"StatusMsg": "OK", "Results": {"BD": {"Name": "Bangladesh", "Capital": {"DLST": "null", "TD": 6.0, "Flg": 2, "Name": "Dhaka", ...

我發現的例子配置，但是當我嘗試獲得相同的結果時，只會將其添加到查詢字符串的末尾。

來源

2011-12-29 Josh Earl

請勿使用'alert（）'進行調試。使用'console.log（）'。 – 2011-12-29 20:32:58

由於same origin policy，此常規JSON調用將不起作用。這是你的錯誤告訴你的：is not allowed by Access-Control-Allow-Origin。

正確JSONP語法是：

$.ajax({ 
    url: 'http://www.geognos.com/api/en/countries/info/all.jsonp', 
    dataType: "jsonp", 
    jsonpCallback: 'callback', 
    success: function(data) { 
     console.log(data); 
    } 
});

DEMO

來源

2011-12-29 20:33:41

我知道相同的來源政策。但是，JSONP不是。但是我很難用jQuery找出正確的回調語法。 – 2011-12-29 20:36:37

@JoshEarl我還在爲JSONP作品添加語法修復。這將工作正常。 – 2011-12-29 20:43:56

是的，效果很好。仍然不確定我是否理解'jsonpCallback'語法。它是否告訴瀏覽器期望包裝函數將被調用？到目前爲止，我發現的所有示例都會將所需的任何名稱附加到URL的末尾。也許這個API只是不支持命名你自己的回調。 – 2011-12-29 21:17:20

你可以讓你創建一個代理加載的URL，你這工作。

$.ajax({ 
    url: 'proxy.php?url=http://www.geognos.com/api/en/countries/info/all.json', 
    dataType: "json", 
    success: function() { 
     alert('JSON call succeeded!'); 
    } 
});

這裏proxy.php將加載http://www.geognos.com/api/en/countries/info/all.json爲您服務。

關於JSONP部分，您的語法無效。有關更多信息，請參閱http://api.jquery.com/jQuery.ajax/。

來源

2011-12-29 20:38:05

使用JSONP將解決此問題。這個答案是不正確的。介紹一個代理是過度設計一個有更簡單答案的東西。 – 2011-12-29 20:43:31

糟糕！沒有檢查geognos.com支持jsonp。 – 2011-12-29 20:52:43

如果您需要對不同來源的域進行Web服務調用（即基本URL），則需要使用代理來執行此操作。代理不一定有義務對相同的域限制。

它們根據您使用的平臺而不同，即.NET/LAMP。

本網站有關於如何創建的多個帖子。

來源

2011-12-29 20:39:35 Ken

正確的用法被埋在$.ajax()的文檔中。搜索jsonpCallback選項。

$.ajax({ 
    url: 'http://www.geognos.com/api/en/countries/info/all.jsonp', 
    dataType: "jsonp", 
    jsonpCallback: function() { 
    alert('JSONP call succeeded!'); 
    } 
});

小提琴：http://jsfiddle.net/gya3b/3/

來源

2011-12-29 20:42:04

謝謝，馬特。 'jsonpCallback'片斷是我錯過的。 – 2011-12-29 20:46:02

您會在我的回答中看到，您可以指定字符串「callback」，它將有效地使用您的'success：function（）'。 – 2011-12-29 20:47:28

或者你這樣做，並使用一個較少的財產。 :) – 2011-12-29 20:48:42

這裏是你如何解決這個問題的例子。通過設置你的jsoncallback。

$.ajax(url, { dataType: 'jsonp', jsonp: 'jsoncallback' }) 
    .then(function(data, status, xhr) { 
     console.log(status); 
     console.log('success (promises): ' + data.name); 
}, function(xhr, status, error) { 
    console.log('failed (promises): ' + error); 
});

來源

2014-06-11 18:29:13

jQuery .ajax（）調用失敗

回答

相關問題