Google Ajax Search 参考

简介:  Google AJAX Search API参考Google AJAX Search API是一种允许您设置Google查寻到您的网页和其他 Web应用程序上的Javascript类库。
 
Google AJAX Search API 参考
Google AJAX Search API 是一种允许您设置 Google查寻 到您的网页和其他 Web 应用程序上的 Javascript 类库。 要使用 API ,您首先将需要 申请一个API 钥匙签名 然后遵守指示如下。
Google AJAX Search API 提供有一定数量限制的 Google 服务,能执行逐行搜索简单的网络对象 ( 网络查寻、本地查寻、视频查寻、 Blog 查寻和新闻查寻 ) 如果您的网页被设计帮助用户创造内容 (e g. 留言簿、 blogs 等等。 ) API 被设计成为允许用户动态的将查寻结果直接复制到他们的消息当中。
API 是新的概念,并且其特性的设置主要取决于客户的踊跃参与。请加入我们在帮助塑造 API 及其特征,您可以参加 Google AJAX Search API讨论组 给出反馈意见和讨论有关 API 的话题。
目录
观众
本文献是为熟练掌握 JavaScript 编程以及面向对象的编程技术概念的人设计的。在网上有许多 JavaScript讲解 可利用。
介绍
“Hellow World” Google AJAX SEARCH API
开始学习 API 最容易的方法就是看一个简单例子。 以下网页显示了一次关键字为“ VW GTI ”逐行查寻的结果。搜索结果中包含本地查寻、网络查寻、视频和 Blog 查寻的结果。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>Hello World - Google AJAX Search API Sample</title>
    <link href="http://www.google.com/uds/css/gsearch.css"
        type="text/css" rel="stylesheet"/>
    <script src="http://www.google.com/uds/api?file=uds.js&amp;v=1.0"
        type="text/javascript"></script>
    <script language="Javascript" type="text/javascript">
    //<![CDATA[
 
    function OnLoad() {
      // Create a search control
      var searchControl = new GSearchControl();
 
      // Add in a full set of searchers
      var localSearch = new GlocalSearch();
      searchControl.addSearcher(localSearch);
      searchControl.addSearcher(new GwebSearch());
      searchControl.addSearcher(new GvideoSearch());
      searchControl.addSearcher(new GblogSearch());
      searchControl.addSearcher(new GnewsSearch());
 
      // Set the Local Search center point
      localSearch.setCenterPoint("New York, NY");
 
      // tell the searcher to draw itself and tell it where to attach
      searchControl.draw(document.getElementById("searchcontrol"));
 
      // execute an inital search
      searchControl.execute("VW GTI");
    }
 
    //]]>
    </script>
 </head>
 <body onload="OnLoad()">
    <div id="searchcontrol"/>
 </body>
</html>
您可以 下载这个例子 编辑和运行,但您在文件中的 AJAX SEARCH API钥匙 必须使用您自己申请的钥匙 .
要在您的网站之内使用 Search API ,您需要包含 Google AJAX Search API JavaScript 类库的 URL ( http://www.google.com/uds/api?file=uds.js&v=1.0&key=ABCDEFG ). 这个类库包含为设置 Google Search API 结果在您的页的对象和标记。在您试图使用查寻控件功能之前,一定要确保在标记 <script> 之内包含此类库。
Google AJAX Search API 主要使用的是一个 GSearchControl 的实例对象。它的子类协调一次查寻与搜索服务间的连接。
如上述例子所示,子类对象 GlocalSearch , GwebSearch , GvideoSearch , GblogSearch GnewsSearch 通过 addSearcher () 方法增加到查寻控件中,这些搜寻者对象决定了该执行哪些查寻控件操作搜索服务。
查寻控件通过过程 GSearchControl draw() 方法将自己显示在网页内 ; 这个方法也将查寻控件绑定在页面上 ( DOM 之内 ) 默认情况下,查寻控件使用 “linear” 布局 ; 您也可以指定控件“ 选中的 ”布局。待会再讨论这些 draw 方式。
除了可供选择的布局选项之外,查寻控件还允许您容易地从查寻结果中分离 查寻表单 对此的一个用途是可以使得查寻表单跟随您的滚动条而搜索结果则固定在页面中心。
用户输入查寻条件,然后按 ENTER 键或点击在查寻控件文本域右侧的查寻按钮,这样该查寻被初始化。查寻控件将自动开始并行搜索扫描被请求的 Google 服务器。 您也可以通过查寻条件的特征使用查寻控件的一个叫 execute() 方法初始化程序式查寻。
Google AJAX Search API 当前支持 Firefox 1.5+, IE 6, Safari, Opera 9+
API 更新
URL http://www.google.com/uds/api?file=uds.js&v=1.0 v 参数代表 API 的版本号 ( 在这里版本号为“ 1.0 ). 当我们做出一次重大更新到 API 时,我们会“提升” 版本号和在 AJAX SEARCH API讨论组 发布一条通知 . 注明所有必需的代码改变,并且当您的 URL 兼容时将会更新到新的版本。
在发布一个新版本之后, Google 将在一段时期内同时支持老和新的版本,这段时间大约是一个月。到期之后,客户端请求使用老的 API 不再将被接受,因此改变您的代码,当您注意到一个新版本。
在无需要求版本更新时, Google AJAX Search API 团队也将周期性地更新 API 以及最近错误修复和表现的改进。 至于大部分依然对您是透明的,但我们也许会因疏忽断开了一些 API 客户端。 请到 AJAX SEARCH API讨论组 报告这样问题。
注:以下每一个例子仅显示相关的 JavaScript 代码,不是一份完整的 HTML 文件。您可以将代码填入及前面显示的 HTML 文件结构中,或者您可以通过点击在每个例子以后的链接下载完全的 HTML 文件。
以下例子 ( 与前面的 JavaScript 代码例子 Hello World 代码相同 ) 在页面中创建了查寻控件,设置它通过本地查寻、网络查寻、视频和 Blog 查寻搜索,然后将控件设置在页面中。
// create a search control
var searchControl = new GSearchControl(null);
 
// add in a full set of searchers
searchControl.addSearcher(new GlocalSearch());
searchControl.addSearcher(new GwebSearch());
searchControl.addSearcher(new GvideoSearch());
searchControl.addSearcher(new GblogSearch());
searchControl.addSearcher(new GnewsSearch());
 
// tell the searcher to draw itself and tell it where to attach
// Note that an element must exist within the HTML document with id "search_control"
searchControl.draw(document.getElementById("search_control"));
我们可以编程实现用不同的 draw 方式显示查寻控件。 GdrawOptions 对象通过它的 setDrawMode () 方法控制这种行为。 该方法有以下属性:
·         GSearchControl.DRAW_MODE_LINEAR
·         GSearchControl.DRAW_MODE_TABBED
实际上 GdrawOptions 对象作为一个参数到查寻控件的 draw() 方法,从而设置查寻控件对象的 draw 方式。
// create a drawOptions object
var drawOptions = new GdrawOptions();
 
// tell the searcher to draw itself in linear mode
drawOptions.setDrawMode(GSearchControl.DRAW_MODE_LINEAR);
searchControl.draw(element, drawOptions);
// tell the searcher to draw itself in tabbed mode
drawOptions.setDrawMode(GSearchControl.DRAW_MODE_TABBED);
searchControl.draw(element, drawOptions);
另一通过这个方法应用较普遍的选项是,能从查寻结果中分离 查寻表单 " GdrawOptions 对象通过 setSearchFormRoot () 方法控制这种行为。 这个方法接受作为查寻表单容器的一个 DOM 元素。
// create a drawOptions object
var drawOptions = new GdrawOptions();
drawOptions.setSearchFormRoot(document.getElementById("searchForm"));
 
searchControl.draw(element, drawOptions);
查寻控件对象的方法 addSearcher () 决定查寻控件操作哪些搜索服务。 这个方法拥有二个属性,一指定服务对象,二指定服务选项。当前支持以下搜寻者对象 ( 服务 )
·         GlocalSearch
·         GwebSearch
·         GvideoSearch
·         GblogSearch
·         GnewsSearch
假设 Google AJAX SEARCH API 开发工作有进展,所支持的服务列表将随着时间改变。
When adding individual searchers to the search control, an optional second parameter, the GsearcherOptions object, controls each service's default expansion mode, which affects how search results are displayed in that service's location on the web page. The expansion mode may be one of the following:
GsearchControl.EXPAND_MODE_OPEN
Results are displayed as fully as possible within the object
GSearchControl.EXPAND_MODE_CLOSED
Results are hidden from view, unless opened through use of a UI element (e.g. an arrow).
GSearchControl.EXPAND_MODE_PARTIAL
Results are shown as a subset of the "open" expansion mode
// create a searcher options object
// set up for open expansion mode
// load a searcher with these options
var options = new GsearcherOptions();
options.setExpandMode(GSearchControl.EXPAND_MODE_OPEN);
searchControl.addSearcher(new GwebSearch(), options);
Controlling Expansion Mode
The following example demonstrates the use of a search control in which each searcher is operating in a different expansion mode. Note that if the searcher is being drawn in tabbed mode, expansion mode is ignored. In that case the searcher always operates in open mode.
// local search, partial
options = new GsearcherOptions();
options.setExpandMode(GSearchControl.EXPAND_MODE_PARTIAL);
searchControl.addSearcher(new GlocalSearch(), options);
// web search, open
options = new GsearcherOptions();
options.setExpandMode(GSearchControl.EXPAND_MODE_OPEN);
searchControl.addSearcher(new GwebSearch(), options);
Controlling Searcher Results Location
In some applications, it is desirable to project search results for a given service into an arbitrary location on the web page. This mode of operation is supported by using the setRoot() method of the service's corresponding searcher object.
// web search, open, alternate root
var options = new GsearcherOptions();
options.setExpandMode(GSearchControl.EXPAND_MODE_OPEN);
options.setRoot(document.getElementById("somewhere_else"));
searchControl.addSearcher(new GwebSearch(), options);
The samples so far have focused on embedding search results on your page for display only, without the capability to store those results to another application. While this is a perfectly appropriate use of the Google AJAX Search API, it does not demonstrate its true potential. The Google AJAX Search API is designed to allow users to distribute search results to others, primarily through content creation applications like blog posts, message boards, etc.
The GSearchControl object provides this functionality through its setOnKeepCallback() method. Using this method, applications specify an object and method that is called whenever a user indicates the wish to save a search result by clicking the "Copy" link below the result.
This link is only provided if applications have called setOnKeepCallback() method. When a user clicks the link, the registered callback recieves a GResult instance representing the search result. This search results object contains a number of searcher specific properties, as well as a uniform html property that contains an HTML element representing the entire search result. The simplest way to handle the callback is to clone the html node and attach it to a node in your application's DOM.
// establish a keep callback
searchControl.setOnKeepCallback(this, MyKeepHandler);
function MyKeepHandler(result) {
// clone the result html node
var node = result.html.cloneNode(true);
// attach it
var savedResults = document.getElementById("saved_results");
savedResults.appendChild(node);
}
In some situations, you might want to restrict a web search, news search, or blog search to a specific site or blog. When you apply restrictions like this, you would typically also want to set your own custom label on the associated section of search results, and you might want to style this section of results differently.
All of these capabilities are supported by using a combination of methods exposed by the searcher options. The following sample demonstrates the use of .setUserDefinedLabel() , .setUserDefinedClassSuffix() , and .setSiteRestriction() . The sample creates a search control where one instance of GwebSearch is site restricted to only return results from amazon.com, uses "Amazon.com" as the search section label, and applies some amount of custom css styling to this section (bold title, orange keeper button, etc.). A similar section showing site restrictions on a GblogSearch and on GnewsSearch is also demonstrated.
<style type="text/css">
/* customize checkbox for -siteSearch section and
* set section title and keep label to bold
*/
.gsc-resultsRoot-siteSearch .gsc-keeper {
background-image : url('../../css/orange_check.gif');
font-weight : bold;
}
.gsc-resultsRoot-siteSearch .gsc-title { font-weight : bold; }
...
// site restricted web search with custom label
// and class suffix
var siteSearch = new GwebSearch();
siteSearch.setUserDefinedLabel("Amazon.com");
siteSearch.setUserDefinedClassSuffix("siteSearch");
siteSearch.setSiteRestriction("amazon.com");
searchControl.addSearcher(siteSearch);
// site restricted web search using a custom search engine
siteSearch = new GwebSearch();
siteSearch.setUserDefinedLabel("Product Reviews");
siteSearch.setSiteRestriction("000455696194071821846:reviews");
searchControl.addSearcher(siteSearch);
In some situations, you want to use the search control because it provides all the UI that you need, but you have a need to see and partially process search results as they arrive. Instead of resorting to the GSearch layer where you have this capability, but are then responsible for the UI, the search control exposes a pair of callbacks. You can use these to request notification before a search executes, and after a search completes. Note, you can not count on a given execute resulting in a completion. The completion may never occur, so don't code yourself into a deadlock. A typical example if this occurs when you might want to plot local search results on a nearby map.
The following code snippet demonstrates the use of this capability.
searchControl.setSearchCompleteCallback(this, App.prototype.OnSearchComplete);
searchControl.setSearchStartingCallback(this, App.prototype.OnSearchStarting);
App.prototype.OnSearchComplete = function(sc, searcher) {
// if we have local search results, put them on the map
if ( searcher.results && searcher.results.length > 0) {
for (var i = 0; i < searcher.results.length; i++) {
var result = searcher.results[i];
// if this is a local search result, then proceed...
if (result.GsearchResultClass == GlocalSearch.RESULT_CLASS ) {
...
App.prototype.OnSearchStarting = function(sc, searcher, query) {
alert(The Query is: " + query);
...
The following sample is a more complete demonstration of these APIs. It shows how to use these two callbacks to process local search results and place them on an adjacent map. View example (sc-callbacks.html)
When using the GSearchControl, your application is able to take advantage of the integrated "search form". This form provides a text input element, a search button, a clear button, as well as "google branding". If your application is not using the search control, and instead is using the raw GSearch layer, the GSearchForm() object is designed just for you... Using this object, you get all of the advantages and branding of the search form thats integrated into the search control, but packaged as a standalone object that you control both behavior and placement.
The following code snippet demonstrates the use of this capability.
// create a search form without a clear button
// bind form submission to my custom code
var container = document.getElementById("searchFormContainer");
this.searchForm = new GSearchForm(false, container);
this.searchForm.setOnSubmitCallback(this, App.prototype.newSearch);
// called on form submit
App.prototype.newSearch = function(form) {
if (form.input.value) {
this.searchControl.execute(form.input.value);
}
return false;
}
The following sample demonstrates the use of this object: View example (places.html)
When using the GSearchControl, or the GSearchForm, your users are naturally exposed to "powered by Google" branding. They are able to associate the search services exposed by your site with Google. When your application does not use either of these forms, it is important to still communicate the Google brand to your users. The GSearch.getBranding() method is designed to help you with this. This method accepts an HTML DOM element and attaches the "powered by Google" branding into that element. Alternatively, a "powered by Google" HTML DOM element can be returned to you so that you can attach it directly.
The following code snippet demonstrates the use of this capability.
// attach "powered by Google" branding
GSearch.getBranding(document.getElementById("branding"));
...
<div id="branding">Loading...</div>
The following sample demonstrates the use of this object: View example (branding.html)
Additional usage samples demonstrate many of these concepts but in the context of larger application fragments.
If you encounter problems with your code:
¡¤ Make sure your API key is valid.
¡¤ Look for typos. Remember that JavaScript is a case-sensitive language.
¡¤ Use a JavaScript debugger. In Firefox, you can use the JavaScript console or the Venkman Debugger. In IE, you can use the Microsoft Script Debugger.
¡¤ Search the AJAX Search API discussion group. If you can't find a post that answers your question, post your question to the group along with a link to a web page that demonstrates the problem.
¡¤ See Other Resources for third party developer resources.
The Google AJAX Search API is made up of several classes of objects:
¡¤ GSearchControl - This class provides the user interface and coordination over a number of searcher objects, where each searcher object is designed to perform searches and return a specific class of results (Web Search, Local Search, etc.).
¡¤ GSearch - This base class is the class from which all "searchers" inherit. It defines the interface that all searcher services must implement.
¡¤ GResult - This base class encapsulates the search results produced by the searcher objects.
¡¤ GsearchOptions - This class configures the behavior of searcher objects when added to a search control.
This is the expected pattern of use for these classes:
// create a searcher object
var sc = new GSearchControl();
// add one or more searchers, specifying options as needed
var options = new GsearcherOptions();
options.setExpandMode(GSearchControl.EXPAND_MODE_OPEN);
sc.addSearcher(new GwebSearch(), options);
...
// activate the search control by calling it's .draw() method
sc.draw(document.getElementById("myDiv"));
Once you have followed these basic steps, the search control is active. Additional searchers cannot be added and searcher options cannot be modified once a search control is drawn. If you need to change your search control's behavior, you must construct and activate a new search control.
For more information, see the Search API class reference.
Coming Soon...
Coming Soon...
 
 
相关文章
|
6月前
|
编解码 开发框架 人工智能
Google Earth Engine(GEE)——基于粮农组织秘鲁Penman-Monteith的参考ET网格化数据库(PISCOeo_pm)
Google Earth Engine(GEE)——基于粮农组织秘鲁Penman-Monteith的参考ET网格化数据库(PISCOeo_pm)
41 0
|
6月前
|
编解码 定位技术
Google Earth Engine谷歌地球引擎GEE图层投影信息与参考坐标系及其空间转换参数获取
Google Earth Engine谷歌地球引擎GEE图层投影信息与参考坐标系及其空间转换参数获取
145 1
|
XML JSON 前端开发
Ajax学习参考文档
Ajax学习参考文档
298 1
Ajax学习参考文档
|
编解码 关系型数据库
Google Earth Engine——南极洲参考高程模型(REMA)是一个高分辨率、有时间戳的南极洲数字表面模型(DSM),具有2米和8米的空间分辨率
Google Earth Engine——南极洲参考高程模型(REMA)是一个高分辨率、有时间戳的南极洲数字表面模型(DSM),具有2米和8米的空间分辨率
228 0
Google Earth Engine——南极洲参考高程模型(REMA)是一个高分辨率、有时间戳的南极洲数字表面模型(DSM),具有2米和8米的空间分辨率
Google Earth Engine——干旱指数(KBDI)是一个连续的参考量表,用于估计土壤和煤层的干燥程度。该指数在没有下雨的每一天都会增加(增加的数量取决于每日的最高温度)
Google Earth Engine——干旱指数(KBDI)是一个连续的参考量表,用于估计土壤和煤层的干燥程度。该指数在没有下雨的每一天都会增加(增加的数量取决于每日的最高温度)
344 0
Google Earth Engine——干旱指数(KBDI)是一个连续的参考量表,用于估计土壤和煤层的干燥程度。该指数在没有下雨的每一天都会增加(增加的数量取决于每日的最高温度)
|
编解码 区块链
Google Earth Engine——WWF/HydroSHEDS/03DIR水文信息数据集提供了一套不同尺度的地理参考数据集(矢量和栅格),包括河流网络、流域边界、排水方向和流量积累。
Google Earth Engine——WWF/HydroSHEDS/03DIR水文信息数据集提供了一套不同尺度的地理参考数据集(矢量和栅格),包括河流网络、流域边界、排水方向和流量积累。
217 0
Google Earth Engine——WWF/HydroSHEDS/03DIR水文信息数据集提供了一套不同尺度的地理参考数据集(矢量和栅格),包括河流网络、流域边界、排水方向和流量积累。
|
数据库
Google Earth Engine ——非洲参考蒸发量(RET)数据集FAO/WAPOR/2/L1_RET_D
Google Earth Engine ——非洲参考蒸发量(RET)数据集FAO/WAPOR/2/L1_RET_D
157 0
Google Earth Engine ——非洲参考蒸发量(RET)数据集FAO/WAPOR/2/L1_RET_D
|
数据库
Google Earth Engine ——非洲参考蒸发量(RET_E)数据集FAO/WAPOR/2/L1_RET_E
Google Earth Engine ——非洲参考蒸发量(RET_E)数据集FAO/WAPOR/2/L1_RET_E
131 0
Google Earth Engine ——非洲参考蒸发量(RET_E)数据集FAO/WAPOR/2/L1_RET_E
App is not indexable by Google Search; consider adding at least one Activity with an ACTION-VIEW in
App is not indexable by Google Search; consider adding at least one Activity with an ACTION-VIEW in
117 0