使用jQueryAjax获取新闻提要

我需要使用ajax调用从google API获取新闻提要，我有以下代码：

function submitSearch(){
        var query = "business";
        var target = "https://ajax.googleapis.com/ajax/services/search/news?v=1.0&q=" + query + "&callback=processResults";

        $.ajax({
            url: target,
            cache: false,
            success: function(data) {
                $('#resultSet').html(data);
            },
            error: alert(target)
        });
    }

---

由于某些原因，在浏览器中直接使用URL会起作用，而使用AJAX调用会导致错误。

您不能跨域发出AJAX请求。（查找跨域源策略）

---

也就是说，有一个解决方法：JSONP。这本质上是一个黑客，但它完成了任务。至于JQuery特定的实现：

由于同源策略，您不能进行跨域ajax请求，或者您可以使用jsonp，即带填充的json

同源策略（SOP）是一种浏览器安全措施，它限制JavaScript代码与来自其他网站的资源（即从任何其他域和/或端口加载的资源）对话。在上的网页中运行的JS无法与从加载的数据交互，甚至无法与加载的数据交互

围绕SOP工作

a） 服务器中的代理：在应用程序中创建一个端点，该端点与外部url对话并返回结果

b） 将JSON响应加载到标签jsonp中，即带有填充的JSON

与此同时进行的服务器端更改。。请阅读如何为您的脚本语言执行此操作

基本上，响应应该是这样的：

 jsonCallback({"Name": "Random", "Id" : 2432, "Rank": 453})

参考：

您需要设置

数据类型：“jsonp”

并从url末尾删除

&callback=processData

var query = "business";
var target = "https://ajax.googleapis.com/ajax/services/search/news?v=1.0&q="+query;
$.ajax({
    url: target,
    cache: false,                   
    dataType:'jsonp',          
    success: function(data) {
        alert(data.responseData.results[0].GsearchResultClass);

    },
    error: function(jxhr,e){
    alert(jxhr.status+" - "+e.responseText);        
    }
});

这是小提琴

var query = "business";
var target = "https://ajax.googleapis.com/ajax/services/search/news?v=1.0&q="+query;
$.ajax({
    url: target,
    cache: false,                   
    dataType:'jsonp',          
    success: function(data) {
        alert(data.responseData.results[0].GsearchResultClass);

    },
    error: function(jxhr,e){
    alert(jxhr.status+" - "+e.responseText);        
    }
});