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()的各种组合以及类似的结果。我错过了什么？

Here's a JSFiddle上述代码。

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

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末尾添加了回调名称的示例，但是当我尝试时，我得到相同的结果，只有它被添加到我的查询的末尾字符串。

Answer 1

由于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

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

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

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

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

Answer 5

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

jQuery .ajax（）调用失败

5 个答案: