无回调获取JSON响应的jQuery跨域请求

jQuery Cross Domain Request to get JSON Response without Callback(无回调获取JSON响应的jQuery跨域请求)

问题描述

我正在尝试从此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. 不允许使用原点http://stackoverflow.com Access-Control-Allow-Origin。

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

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

响应：

未捕获语法错误：意外标记：

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

{"json_class":"Fortune","tags":["simpsons_homer"],"quote":"Holy Moly!  The bastard's rich!

		-- Homer Simpson
		   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);
   },
});

响应：

未捕获语法错误：意外标记：

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

专家是否有帮助或指示从URL检索JSON？我是从Chrome Dev工具测试的。我知道我可以从服务器端代码调用服务，然后将其发送到客户端。但是我想看看是否可以从客户端单独通过jQuery来完成这项工作。

编辑： 根据凯文·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
    }
});

这将提供预期的响应。

JQuery

这并不是在所有浏览器中都有效，但根据您使用的推荐答案版本，请尝试：

$.support.cors = true;

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

这篇关于无回调获取JSON响应的jQuery跨域请求的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！