Google 网页搜索 API - XMLHttpRequest 无法加载资源

Google Web Search API - XMLHttpRequest cannot load Resources

当我使用 JavaScript 调用 Google 网络搜索 Api 时,出现如下错误。当我在浏览器上 运行 URL 时,它成功 returns JSON.

XMLHttpRequest cannot load https://ajax.googleapis.com/ajax/services/search/web?v=1.0&q=%22opencourseware%22+pdf. No 'Access-Control-Allow-Origin' header is present on the requested resource.

下面是html和JavaScript

<div id="results"></div>

JavaScript

var $results3 = $('#results3');

var websearchurl = "https://ajax.googleapis.com/ajax/services/search/web?v=1.0&q=\"opencourseware\"+pdf";

$.getJSON(websearchurl , function (json) {

    var count3 = 0;

    if (json.responseData.results) {

        var items3 = json.responseData.results;

        items3.forEach(function (item3) {
            html3 += '<a href="'+item3.unescapedUrl+'">'+item3.unescapedUrl+'</a><br/>';
            count3++;
        });
    }

    if (count3 === 0) {
        $results3.html("No Paper found");
    } else {
        $results3.html(html3);
    }
});

只是想问问我是否遗漏了什么,因为我也同样使用 Youtube 和 Coursera API 并且都工作正常。 谢谢

您必须使用 JSONP 进行跨域请求,使用 AJAX。

在你的情况下,这就像:

$.ajax({
    url: "https://ajax.googleapis.com/ajax/services/search/web?v=1.0&q=\"opencourseware\"+pdf",

    // 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: {
       format: "json"
    },

    // Work with the response
    success: function( response ) {
        var count3 = 0;

        if (response.responseData.results) {

            var items3 = response.responseData.results;

            items3.forEach(function (item3) {
                html3 += '<a href="'+item3.unescapedUrl+'">'+item3.unescapedUrl+'</a><br/>';
                count3++;
            });
        }

        if (count3 === 0) {
            $results3.html("No Paper found");
        } else {
            $results3.html(html3);
        }
    }
});