11

我正在尝试从此 URL 检索 JSON

http://www.iheartquotes.com/api/v1/random?format=json

通过 jQuery。我知道解决方案是 JSONP，但由于我无法控制服务的响应文本或将其包装在我自己的回调函数中，我的目标是使用客户端脚本以某种方式检索上述 URL 的响应。

我已经尝试了 StackOverflow 的几个答案中建议的几乎所有方法。这些是我尝试过的代码块和我得到的响应。

1. 返回预期 Access-Control-Allow-Origin 错误的直接调用

$.getJSON("http://www.iheartquotes.com/api/v1/random?format=json",
   function(data) {
     alert(data);         
   });

回复：

XMLHttpRequest 无法加载 =1376682146029">http://www.iheartquotes.com/api/v1/random?format=json&=1376682146029。Access-Control-Allow-Origin不允许来源http://stackoverflow.com 。

2. 上面添加了回调参数的代码：

$.getJSON("http://www.iheartquotes.com/api/v1/random?format=json&callback=?",
   function(data) {
     alert(data);         
   });

回复：

Uncaught SyntaxError: Unexpected token :

请注意，当我单击错误时，它会将我带到预期的 JSON 响应。

{"json_class":"Fortune","tags":["simpsons_homer"],"quote":"Holy Moly!  The bastard's rich!\n\n\t\t-- Homer Simpson\n\t\t   Oh Brother, Where Art Thou?","link":"http://iheartquotes.com/fortune/show/5501","source":"simpsons_homer"}

这也是预期的，因为响应中没有定义回调函数。

3. 通过jQuery的Ajax方法

$.ajax({ 
   type: "GET",
   dataType: "jsonp",
   url: "http://www.iheartquotes.com/api/v1/random?format=json",
   success: function(data){        
     alert(data);
   },
});

回复：

Uncaught SyntaxError: Unexpected token :

将回调参数添加到上述函数不会更改响应。

从 URL 中检索 JSON 的专家的任何帮助或指示？我正在通过 Chrome 开发工具对此进行测试。我知道我可以从服务器端代码调用服务，然后将其发送到客户端。但我想看看这是否可以从客户端单独通过 jQuery 完成。

编辑：基于 Kevin B 的评论：使用 jQuery 的 Ajax 通过 YQL 获得预期的输出。但我的问题还是一样。由于 YQL 仍然是一个依赖项，是否有一种通过 jQuery 实现的本地方法？

// Using YQL and JSONP
$.ajax({
    url: "http://query.yahooapis.com/v1/public/yql",

    // the name of the callback parameter, as specified by the YQL service
    jsonp: "callback",

    // tell jQuery we're expecting JSONP
    dataType: "jsonp",

    // tell YQL what we want and that we want JSON
    data: {
        q: "select * from json where url=\"http://www.iheartquotes.com/api/v1/random?format=json\"",
        format: "json"
    },

    // work with the response
    success: function( response ) {
        console.log( response.query.results.json ); // server response
    }
});

这给出了预期的响应。

4

1 回答 1

1

这不适用于所有浏览器，但取决于您使用的 JQuery 版本，请尝试：

$.support.cors = true;

显然，这也取决于服务器响应的标头。

于 2014-01-31T05:01:13.453 回答