jQuery .ajax（）调用失败

Question

我正在尝试对公共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

还有这个：

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

失败，出现此错误：

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.

我通过本地IIS7实例提供页面服务。 我也尝试过类似$.getJSON()各种组合。 我错过了什么？

这是上面代码的JSFiddle 。

更新：以为我们有一个解决方案，但是在执行JSONP调用时，我仍然得到callback is not defined错误，即使调用了警报/日志代码。 响应URL如下所示：

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

并且JSON响应包含如下：

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

我已经找到了在.ajax()配置中将URL添加到URL末尾的示例，但是当我尝试得到相同的结果时，只有它被添加到我的查询字符串的末尾。

Answer 1

由于相同的原始策略，此常规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

Answer 2

正确的用法隐藏在$ .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/

Answer 3

如果您创建代理来为您加载网址，则可以使其正常工作。

$.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/ 。

Answer 4

以下是如何解决此问题的示例。 通过设置你的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);
});

Answer 5

如果您需要对不同源的域（即基本URL）进行Web服务调用，则需要使用代理来执行此操作。 代理不一定有义务使用相同的域名限制。

它们根据您使用的平台（即.NET / LAMP）而有所不同。

该网站有多篇关于如何创建的帖子。