タイトルが示すように、この投稿はjQuery JavaScriptライブラリーを介してGoogle Search APIおよびYahoo Search APIと連携することに専念します。
Yahoo Search AJAX API
まず、
Yahoo Search APIを使用し
ます 。 そして、これには2つの理由があります：
- GoogleサービスはYahooよりもバグが多い（まだグリーン）
- Yahooは属性ref = "nofollow"に注意を払っていないため、発行がより完全になっています。
では、始めましょう。まず、Yahooアカウントを登録し、「
アプリケーションID 」を取得する必要があります。
しばらくの間の「お気に入り」のブックマークは
http://developer.yahoo.com/search/になり
ます 。
次に、興味のある検索を自分で決定します（Yahoo APIのドキュメントの関連セクションへのすべてのリンク）。
- オーディオ検索
- アルバム検索
アーティスト検索
ダウンロード場所
曲検索
自動車カスタム
コンテンツ分析
画像検索
ローカル検索
Myweb 2.0
- 関連タグ
タグ検索
URL検索
ニュース検索
サイトエクスプローラー
- Pages
インリンク
更新通知
ビデオ検索
ウェブ検索
それらの多くがありますが、私たちは1つを選択します-ウェブ検索、その上で私たちは実験を続けます。
RESTリクエストを作成します
上記のリンクを使用して、URLのベースを取得します。Web検索の場合は次のとおりです。
search.yahooapis.com/WebSearchService/V1/webSearch
API ID appid = YahooDemoおよびquery = PHPリクエスト自体を追加します（リクエストを追加する前に、 encodeURIComponent関数を使用して準備する必要があります）
その結果、次のURLが取得されます。
http://search.yahooapis.com/WebSearchService/V1/webSearch?appid=YahooDemo&query=PHP
これは最低限必要ですが、XMLはJavaScriptにとって最も消化しやすい形式ではありません。JSONを好み、さらにJSONPを好むでしょう。 これを行うには、 outputパラメーターを使用して出力形式を指定する必要があります。 JSONPチャームを使用するには、コールバック関数の名前も指定する必要があり、URLは次のようになります。
http://search.yahooapis.com/WebSearchService/V1/webSearch?appid=YahooDemo&output=json&callback=foo&query=PHP
Javascript
ここでjQueryを取得し、次の構成を取得します。
$ .getJSON（ "http://search.yahooapis.com/WebSearchService/V1/webSearch?appid=YahooDemo&output=json&query=PHP&callback=？"、
関数（データ）{
var ul = document.createElement（ "ul"）;
$ .each（data.ResultSet.Result、function（i、val）{
var li = document.createElement（ "li"）;
var inner = '<a href="'+val.Url+'" title="'+val.Url+'" target="_blank">' + val.Title + "</a>";
if（val.Summary！= "" && val.Summary！= "undefined"）{
inner + = "-" + val.Summary;
}
li.innerHTML = inner;
ul.appendChild（li）;
}）;
$（ 'body'）。html（ul）;
}）;
この例は次のようになります。
$ .ajax（{
// AJAXで指定されたURL
url： "http://search.yahooapis.com/WebSearchService/V1/webSearch?appid=YahooDemo&output=json&query=PHP&callback=？"、
dataType： "jsonp"、
//成功イベントを処理します
成功：関数（データ）{
//前の例と等しい
// ...
}
}）;
注 ：リクエストをわずかに変更しました-...で終わります＆コールバック=？ -リクエスト内のコールバック関数の正しい名前をjQueryに置き換える必要があります。 この例のコールバック関数は、LI要素が検索結果と一致するULリストを作成します。 （各タイプの検索には固有のフィールドがあります。詳細については上記のリンクを参照してください）。
ご覧のとおり、すべてが非常にシンプルです-検索結果の結論は、完全にあなたの想像力にかかっています...
Google Search AJAX API
既にGoogle Search AJAX APIを使用している場合は、特定のニーズに合わせてカスタマイズするのに非常に問題のある素晴らしいJavaScriptライブラリがあることがわかります。したがって、Yahoo APIと同様に、JSONPを使用します。 しかし、最初に...「 AJAX Search API Key 」を取得する必要があります 。
私たちの出発点はページです： http : //code.google.com/apis/ajaxsearch/documentation/reference.html
RESTリクエストを作成します
検索のタイプと対応するベースURLを選択します。
3つのパラメーターを指定する必要があります-これはAPIバージョンです-v = 1.0 、APIキーキー= your-key、およびq = PHPリクエスト自体（キーは必須パラメーターではありませんが、強くお勧めします）：
http://ajax.googleapis.com/ajax/services/search/web?v=1.0&q=PHP
注 ：各タイプの検索には固有のパラメーターがあり、それらはすべてドキュメントに記載されています 。
Javascript
今、私たちの最愛のJSONPに戻る-Googleは私たちに不利益をもたらしました-JSONPを整理するために、 コールバックとコンテキストの 2つのパラメーターを提供し、それらは相互に必要であり、コンテキストパラメーターは常に最初のパラメーターとしてコールバック関数で返されますAPIへの同時呼び出しを区別できるように）。 ただし、1つ問題があります。これはjQueryでは機能しません。 jQueryでは、最初のパラメーターとしてデータが必要です。このため、このトリックに進み、中間コールバック関数を作成する必要がありました。
//コールバック関数
関数GoogleCallback（関数、データ）{
window [func]（データ）;
}
これで「質問」する準備ができました。
//キーを変更します!!!
$ .getJSON（ "http://ajax.googleapis.com/ajax/services/search/web?v=1.0?key=your-key&q=PHP&callback=GoogleCallback&context=？"、
関数（データ）{
var ul = document.createElement（ "ul"）;
$ .each（data.results、function（i、val）{
var li = document.createElement（ "li"）;
li.innerHTML = '<a href="'+val.url+'" title="'+val.url+'" target="_blank">' + val.title + "</a>-" + val.content;
ul.appendChild（li）;
}）;
$（ 'body'）。html（ul）;
}）;
注 ：各タイプの結果には独自のプロパティがあります;詳細については、 ドキュメントを参照してください。
ご覧のとおり、今ではGoogle JavaScriptライブラリの「機能」に制限されておらず、実際に達成した裁量でデータを自由に管理できます...
PS：同様のアプローチを使用して、データの表示に関する制限を削除し、最も重要なこととして、サーバーからクライアントに負荷を転送します（ analyser.hohli.comでの検索の構成方法です ）。
クロスポスト： http ://anton.shevchuk.name/