jQuery+Bing API реализует простую поисковую систему

В июне этого года Microsoft официально выпустила Bing, преемника Live search, а также предоставила очень полный набор API. Как и Google API, используя Bing API, веб-разработчики могут интегрировать различные службы поиска Bing на свои веб-сайты, тем самым расширяя функции веб-сайта и привлекая трафик на веб-сайт. В этой статье CSS9.NET использует полный пример использования, чтобы показать вам, как использовать jQuery для вызова API Bing для реализации простой поисковой системы в Интернете, а также получить базовое представление об API Bing.

Во-первых, давайте проведем опыт восприятия: онлайн-пример

API Bing предоставляет три типа данных результатов поиска: SOAP, XML и JSON. В этом примере интерфейс типа данных json вызывается через jQuery ajax для отображения данных. Давайте посмотрим на его реализацию:

Подготовка :

Microsoft показывает нам подробную документацию по разработке через сайт Bing API:

1. Посетите сайт разработчика Bing: http://bing.com/developers . Вход в Bing API на MSDN также можно найти здесь.
2. Войдите в систему с учетной записью Microsoft (если у вас ее нет, вы можете сначала зарегистрировать только ее)
3. Заполните форму и получите «APP ID» (используется при вызове API, Microsoft должна убедиться, что вы являетесь разработчиком Microsoft)

HTML-часть

Элементы страницы очень просты и в основном состоят из пяти частей: вход для поиска, область отображения результатов, описание результатов, отображение сообщений об ошибках и навигация по странице. Давайте посмотрим на HTML ниже:

<div class="линия поиска-контента">
<div class="столбец столбец три пятых">
<h3 id="results-header"></h3>
<p id="results-summary"></p>
<!--Область отображения результатов-->
<div id="результат поиска">
<h3>Результаты поиска</h3>
<!-- Описание результата, например, сколько всего записей и какие из них предшествуют -->
<div id="result-aggregates" class="results"></div>
<ul id="список-результатов" class="results">
</ul>
<!--Навигация по страницам-->
<ul id="result-navigation" class="result-navigation">
<li id="prev">&laquo;</li>
<li id="next">&raquo;</li>
</ul>
</div>
<!--Отображение сообщения об ошибке-->
<p id="список-ошибок">
</p>
</div>
<!--Искать вход-->
<div class="столбец последний столбец">
<h3>Введите условия поиска:</h3>
<р>
<input id="txtQuery" type="text" title="Условия поиска" />
<button id="btnSearch" type="button" title="Поиск">Поиск</button>
</p>
</div>
</div>

Вызов частей API Bing через jQuery

Определите некоторые параметры, которые необходимо передать в Bing API: //Примененный идентификатор приложения, замените его здесь своим собственным.
var AppId = "AppId=31F3C13DC5D41C42D4A18F9E04DE1DEA73762186";
//Получаем строку поиска по пользователю, вводящему поисковый запрос
вар Запрос = "Запрос="
//Укажите тип источника поиска. Bing предоставляет все типы, такие как веб-страницы, видео, изображения и т. д., см. API.
//Здесь указан тип веб-страницы
var Sources = "Sources=Web";
//Указываем версию API
вар Версия = "Версия = 2.0";
//Указываем регион, например Google. Результаты поиска в каждом регионе разные. Здесь указан Китай.
var Market = "Market=zh-cn";
//Настройка некоторых опций, здесь включается подсветка искомого слова в результатах поиска
var Options = "Options=EnableHighlighting";
//Вернем количество элементов на странице
варВебКаунт = 10;
//Какая страница является текущей, начиная с 0?
варВебОфсет = 0;