是否有 Google 自定义搜索休息 API 的工作示例？答案

【问题标题】：Is there a working sample of the Google custom search rest API?是否有 Google 自定义搜索休息 API 的工作示例？
【发布时间】：2014-03-06 11:28:53
【问题描述】：

我需要创建一个自动进行 Google 搜索的屏幕。我知道 JavaScript，我正在努力让 GSE 工作。

我有一个搜索引擎和一个 API 密钥。问题是 Google 的文档是循环的，即页面相互指向。没有工作样本可供我开始研究。

如果您知道工作示例，请提供帮助。

我读过的文件是：

【问题讨论】：

标签： google-custom-search

【解决方案1】：

我知道这是一个老问题，但我这样做是为了使 API 结果的格式类似于 Google Site Search 过去提供的格式，因为他们正在结束付费帐户并且现在会有广告。 API 方式仍然可以选择为每天超过 100 次搜索付费，所以继续这样做，但仍然必须格式化结果，并使用现有的方式构建 css 来进行类似的样式设置。

进入这个页面的搜索表单很简单：

<form action="search-results.htm" id="cse-search-box">
        <div>
            <input class="" name="q" type="text"> 
            <input class="" type="submit">
        </div>
    </form>

然后是搜索结果页面：

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <title>JSON/Atom Custom Search API Example</title>
    <!--<link href="default.css" rel="stylesheet" type="text/css">-->
    <link href="google.css" rel="stylesheet" type="text/css">
</head>
<body>
    <div class="gsc-result-info" id="resInfo-0"></div>
    <hr/>
    <div id="googleContent"></div>

<script>
    //Handler for response from google.
    function hndlr(response) {
        if (response.items == null) {
            //Sometimes there is a strange thing with the results where it says there are 34 results/4 pages, but when you click through to 3 then there is only 30, so page 4 is invalid now.
            //So if we get to the invalid one, send them back a page.
            window.location.replace("searchresults.htm?start=" + (start - 10) + "&q=" + query);
            return;
        }
        //Search results load time
        document.getElementById("resInfo-0").innerHTML = "About " + response.searchInformation.formattedTotalResults + " results (" + response.searchInformation.formattedSearchTime + " seconds)";
        //Clear the div first, CMS is inserting a space for some reason.
        document.getElementById("googleContent").innerHTML = "";
        //Loop through each item in search results
        for (var i = 0; i < response.items.length; i++) {
            var item = response.items[i];
            var content = "";

            content += "<div class='gs-webResult gs-result'>" +
                "<table class='gsc-table-result'><tbody><tr>";
            //Thumbnail image
            if (item.pagemap.cse_thumbnail != null)
                content += "<td class='gsc-table-cell-thumbnail gsc-thumbnail'><div class='gs-image-box gs-web-image-box gs-web-image-box-portrait'><a class='gs-image' href='" + item.link + "'>" +
                    "<img class='gs-image' class = 'gs-image-box gs-web-image-box gs-web-image-box-portrait' src='" + item.pagemap.cse_thumbnail[0].src + "'></a></td>";
            //Link
            content += "<td><a class='gs-title' href='" + item.link + "'>" + item.htmlTitle + "</a><br/>";
            //File format for PDF, etc.
            if (item.fileFormat != null)
                content += "<div class='gs-fileFormat'><span class='gs-fileFormat'>File Format: </span><span class='gs-fileFormatType'>" + item.fileFormat + "</span></div>";
            //description text and URL text.
            content += item.htmlSnippet.replace('<br>','') + "<br/><div class='gs-bidi-start-align gs-visibleUrl gs-visibleUrl-long' dir='ltr' style='word-break:break-all;'>" + item.htmlFormattedUrl +"</div>" +
                "<br/></td></tr></tbody></table></div>";
            document.getElementById("googleContent").innerHTML += content;
        }
        //Page Controls
        var totalPages = Math.ceil(response.searchInformation.totalResults / 10);
        console.log(totalPages);
        var currentPage = Math.floor(start / 10 + 1);
        console.log(currentPage);
        var pageControls = "<div class='gsc-results'><div class='gsc-cursor-box gs-bidi-start-align' dir='ltr'><div class='gsc-cursor'>";
        //Page change controls, 10 max.
        for (var x = 1; x <= totalPages && x<=10; x++) {
            pageControls += "<div class='gsc-cursor-page";
            if (x === currentPage)
                pageControls += " gsc-cursor-current-page";
            var pageLinkStart = x * 10 - 9;
            pageControls+="'><a href='search-results.htm?start="+pageLinkStart+"&q="+query+"'>"+x+"</a></div>";
        }
        pageControls += "</div></div></div>";
        document.getElementById("googleContent").innerHTML += pageControls;
    }

    //Get search text from query string.
    var query = document.URL.substr(document.URL.indexOf("q=") + 2);
    var start = document.URL.substr(document.URL.indexOf("start=") + 6, 2);
    if (start === "1&" || document.URL.indexOf("start=") === -1)
        start = 1;

    //Load the script src dynamically to load script with query to call.
    // DOM: Create the script element
    var jsElm = document.createElement("script");
    // set the type attribute
    jsElm.type = "application/javascript";
    // make the script element load file
    jsElm.src = "https://www.googleapis.com/customsearch/v1?key=yourApikeyhere&cx=yoursearchengineidhere&start="+start+"&q=" +query +"&callback=hndlr";
    // finally insert the element to the body element in order to load the script
    document.body.appendChild(jsElm);
</script>
</body>
</html>

【讨论】：

感谢您的示例！在结果页面上，由于连字符 (-) 前后都有空格，因此页面 URL 通常无效。你知道这是什么原因吗？

【解决方案2】：

rest api 开始的地方在这里：https://developers.google.com/custom-search/json-api/v1/introduction

例子：

<div id="content"></div>
<script>

    // Remember to replace YOUR_API_KEY below.

    function hndlr(response) {
      for (var i = 0; i < response.items.length; i++) {
        var item = response.items[i];
        // in production code, item.htmlTitle should have the HTML entities escaped.
        document.getElementById("content").innerHTML += "<br>" + item.htmlTitle;
      }
    }
</script>
<script src="https://www.googleapis.com/customsearch/v1?key=YOUR_API_KEY&cx=017576662512468239146:omuauf_lfve&q=cars&callback=hndlr">
</script>

这是一个小提琴：http://jsfiddle.net/AGjCH/

【讨论】：

cx 属性是什么？我应该更改它以匹配我的项目吗？
这是你的引擎的id，你可以在控制面板google.com/cse中找到它