原帖地址：http://www.javaeye.com/topic/41337

摘要:

del.icio.us提供了多種可重用的數(shù)據(jù)格式。而它提供了通用API訪問和類似PHP的輸出格式，使這些數(shù)據(jù)也可以被JavaScript開發(fā)者將 其作為JSON格式所使用。Google AJAX Search API提供一些簡單的web對象。如何把這兩項技術(shù)結(jié)合在一起呢？Google AJAX Search API+TAG=美味的站點？由于本文長達25頁，詳細閱讀請下載原文和源代碼。

原文地址：http://www.matrix.org.cn/resource/article/2006-12-20/c5a99539-8ffb-11db-ab77-2bbe780ebfbf.html

前言

????????del.icio.us提供了多種可重用的數(shù)據(jù)格式。而它提供了通用API訪問和類似PHP的輸出格式，使這些數(shù)據(jù)也可以被JavaScript開發(fā)者將其作為JSON格式所使用。

????????Google AJAX Search API提供一些簡單的web對象：它們執(zhí)行建立在各種Google服務(wù)（頁面搜索、本地搜索、視頻搜索、Blog搜索、新聞搜索）之上的內(nèi)嵌（inline）搜索。

????????如何把這兩項技術(shù)結(jié)合在一起呢？Google AJAX Search API+TAG=美味的站點？由于本文長達25頁，所以下面僅列出了一些摘要性段落，詳細閱讀請下載原文和源代碼：
??

什么是Google AJAX Search API ？


圖-1 這就是Google AJAX Search API?


????????Google AJAX Search API是提供在頁面和web應(yīng)用中嵌入Google Search的JavaScript代碼庫。當(dāng)然像其它Google開發(fā)API相同，在使用它之前，你首先需要注冊一個API key。

????????Google AJAX Search API提供一些簡單的web對象：它們執(zhí)行建立在各種Google服務(wù)（頁面搜索、本地搜索、視頻搜索、Blog搜索、新聞搜索）之上的內(nèi)嵌 （inline）搜索。如果你設(shè)計頁面是為了幫助用戶建立內(nèi)容（比如信息板、blog等），而這個API可以設(shè)計成：通過允許它們直接把搜索結(jié)果復(fù)制到它 們的信息中的方式來支持前面的這些活動。

????????Google AJAX Search API是最新發(fā)布的，它的特性被廣泛地用戶使用，你可以通過加入Google AJAX Search API討論組來進行反饋和技術(shù)討論。

示例

????????注意：這里的示例僅提供了相關(guān)的Javascript代碼而并非全部的HTML文件。你可以將這些代碼插入到HTML文件或者通過點擊下載鏈接下載完整的HTML文件。

基本功能
????????下面的代碼建立了一個搜索控制，并配置它用以完成跨越本地搜索、頁面搜索、視頻搜索、blog搜索的搜索，然后將搜索控制放置在頁面中。
????????...
GSearcherControl 繪制（Draw）模式
????????...
搜索者對象（Searcher Objects）
????????...
搜索者選項（GsearcherOptions）
????????...
控制展開模式
????????...
保持搜索結(jié)果
????????...
設(shè)置站點限制
????????...
搜索控制回調(diào)方法
????????...
自定義Search Form
????????...
高級的商標用法
????????...
附加示例
????????...

Troubleshooting

????????如果你在編寫代碼時遇到問題，請參考下面的步驟找出、修正問題：
????????確認你的API key是有效的。
????????查看輸入的代碼。請記住JavaScript是一種大小寫敏感的語言。
????????使用JavaScript調(diào)試器。在Firefox中，你可以使用JavaScript console或是Venkman Debugger。在IE中，你可以使用Microsoft Script Debugger。
????????搜索AJAX Search API討論組。如果你找不到問題的答案，請將你的問題和能
????????重現(xiàn)問題的頁面鏈接發(fā)表在討論組。
????????查看來自第三方開發(fā)者的其它資源。

API回顧

????????Google AJAX Search API由下面的類組成：

??????????GSearchControl：提供用戶接口和對搜索者對象的控制，每個搜索者對象被設(shè)計用來執(zhí)行指定類型的搜索并返回相應(yīng)類型的結(jié)果（網(wǎng)頁搜索、本地搜索等）。
??????????GSearch：所有搜索者類的基類，它定義了所有搜索者服務(wù)必須實現(xiàn)的接口。
??????????GResult：用來封裝搜索者對象產(chǎn)生的搜索結(jié)果的基類。
??????????GsearchOptions：用于在將搜索者對象添加到搜索控制時，配置搜索者對象的行為。
????????...

使用JSON和Dishy輕松集成美味書簽

什么是Dishy？


圖-4 馬賽克的魅力（Dishy）


????????Dishy是一種對del.icio.us JSON REST API 的JavaScript封裝。在使用時你所需做的事首先是將它包含到你的HTML文檔中
????????...

Dishy能做什么？

????????社會書簽網(wǎng)站：del.icio.us，提供了多種可重用的數(shù)據(jù)格式。而它提供了通用API訪問和類似PHP的輸出格式，使這些數(shù)據(jù)也可以被JavaScript開發(fā)者將其作為JSON格式所使用。

????????Dishy：使用del.icio.us提供的JSON REST API來獲得關(guān)于Tag的JSON格式的工具。

????????Dishy與tag一起協(xié)力是用戶獲得以下益處:
????????1.你可以接收你的鏈接或者tag數(shù)據(jù)，而不是用服務(wù)器端代理。
????????2.獲得的數(shù)據(jù)被自動緩存。
????????3.在頁面被裝載后根據(jù)需要摘取數(shù)據(jù)，并且沒有增加頁面的負擔(dān)。
????????4.由于搜索引擎不愿索引那些顯示你的頁面的相關(guān)性的del.icio.us鏈接這類的事情不再發(fā)生，你的pagerank將會提高。

Dishy屬性和方法
????????...
下載Dishy
????????...
Dishy示例
????????...

改進Dishy的engage方法


圖-5 “進化”才剛開始

????????Dishy的核心方法engage：使用提供的參數(shù)訪問使用del.icio.us JSON REST API的URL，然后執(zhí)行返回的字符串。
????????...

使用Tags+Search模式豐富頁面的相關(guān)性


圖-6 內(nèi)容的關(guān)聯(lián)性是提高UE的重要元素


Tags+Search模式

????????Tags+Search模式是指利用頁面中的Tags，對與Tags相關(guān)的資源進行搜索、羅列。
使用Dishy+AJAX Search API實現(xiàn)Tags+Search模式
????????前提條件：為了方便后面的tag搜索工作，首先要將文章的標題作為書簽的description值提交到del.icoi.us。

????????如何添加書簽：我在《如何定制Roller blog》介紹了如何在blog中添加美味書簽的方法，在頁面上添加美味書簽的過程應(yīng)該與之類似。當(dāng)然，你也可以使用程序在文章發(fā)布時自動將其信息提交到美味書簽，此方法就留給大家思考吧。

???????? 實現(xiàn)過程：我使用Dishy根據(jù)文章標題找到此文章在del.icoi.us中相應(yīng)的Tags，并對Tags中的多個tag進行隨機抽取組成search 關(guān)鍵字，然后使用Google AJAX Search API對search 關(guān)鍵字進行搜索，并將搜索結(jié)果放到頁面適合的位置（比如網(wǎng)站的sidebar）。這將大大增加頁面的信息相關(guān)性。


具體實現(xiàn)第一步：增加Dishy對tag的過濾能力

????????這里簡要說一下如何結(jié)合Tags和Google Search兩項技術(shù)。請注意：這里的代碼使用到了prototype.js（1.4版）,而JavaScript類使用了prototype（也被稱為原型）的風(fēng)格。...


具體實現(xiàn)第二步：封裝Google AJAX Search API和頁面request類
????????...
具體實現(xiàn)第三步：完成測試頁面
????????...
具體實現(xiàn)第四步：與網(wǎng)站集成