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

摘要:

del.icio.us提供了多種可重用的數據格式。而它提供了通用API訪問和類似PHP的輸出格式，使這些數據也可以被JavaScript開發者將 其作為JSON格式所使用。Google AJAX Search API提供一些簡單的web對象。如何把這兩項技術結合在一起呢？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提供了多種可重用的數據格式。而它提供了通用API訪問和類似PHP的輸出格式，使這些數據也可以被JavaScript開發者將其作為JSON格式所使用。

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

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

什么是Google AJAX Search API ？


圖-1 這就是Google AJAX Search API?


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

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

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

示例

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

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

Troubleshooting

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

API回顧

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

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

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

什么是Dishy？


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


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

Dishy能做什么？

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

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

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

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

改進Dishy的engage方法


圖-5 “進化”才剛開始

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

使用Tags+Search模式豐富頁面的相關性


圖-6 內容的關聯性是提高UE的重要元素


Tags+Search模式

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

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

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


具體實現第一步：增加Dishy對tag的過濾能力

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


具體實現第二步：封裝Google AJAX Search API和頁面request類
????????...
具體實現第三步：完成測試頁面
????????...
具體實現第四步：與網站集成