如何自动调用Google自定义搜索引擎进行搜索

查看源码

谷歌自定义搜索引擎（CSE）为我们提供了很好的谷歌搜索支持，作为对博客搜索程序的扩充，Google搜索很好的完成了更高阶的搜索任务。然而试想这样一个场景，用户首先使用了Wordpress自带的搜索引擎进行搜索，并没有获取到想要的结果，假设你在搜索结果界面又放了一个Google自定义搜索框，用户还需要再次键入关键字点击搜索，才能转到Google自定义搜索结果页面。那么有没有办法让Google自定义搜索引擎自动进行搜索呢？答案是肯定的，我们需要借助一些简单的Google CSE API。

关于如何申请 CSE 这里不再赘述，假设你已经申请好了 CSE。

HTML

<div id=”cse-search-form” style=”width: 100%;display:none;”>Loading</div>

JS

<script src=”http://www.google.com.hk/jsapi" type=”text/javascript”></script>
<script type=”text/javascript”>
  google.load(‘search’, ‘1’, {language : ‘zh-CN’});
  google.setOnLoadCallback(function() {
    //获取需要搜索的关键词并执行搜索，如下两行为关键代码
    var query = ‘苹果教程网’;
    customSearchControl.execute(query);
    var customSearchOptions = {};  var customSearchControl = new google.search.CustomSearchControl(
      ‘001212031995655897722:skb-lu6f7zo’, customSearchOptions);
    customSearchControl.setResultSetSize(google.search.Search.SMALL_RESULTSET);
    var options = new google.search.DrawOptions();
    options.setSearchFormRoot(‘cse-search-form’);
    options.setAutoComplete(true);
    customSearchControl.setAutoCompletionId(‘001212031995655897722:skb-lu6f7zo+qptype:1’);
    customSearchControl.draw(‘cse’, options);
  }, true);
</script>

搜索结果

<link rel=”stylesheet” href=”http://www.google.com/cse/style/look/default.css" type=”text/css” />
<div id=”cse” style=”width:100%;”></div>

简单来说，整个功能的核心语句就是

customSearchControl.execute(query);

自行判断在合适的位置调用该语句即可实现自动搜索（无需用户点搜索按钮，关键词需要预先设置好，即query变量）

google