Нет стресса RSS с Google Feed API

В недавней серии статей Крейга о форматах данных Ajax мы узнали о JSON, чистом и эффективном формате для работы с данными на ваших страницах Ajax. Но если вы имеете дело с блогами, источниками новостей или общими системами управления контентом, RSS по-прежнему является стандартом де-факто, и JSON может быть недоступен. Вы можете взломать ваши источники, чтобы выкладывать нужные вам данные в JSON, или вы могли бы написать часть промежуточного программного обеспечения для преобразования RSS для вас, но иногда это невозможно или нецелесообразно.

Если это так, почему бы не проверить Google Feed API? Это быстрый и простой способ получить RSS-каналы и сразу же использовать их в качестве объектов JSON: без суеты, суеты или странных усилий по анализу с вашей стороны! Вы извлекаете кэшированную копию RSS от Google, поэтому она быстрая и надежная; это также приведет к меньшему воздействию на сайт, обслуживающий канал, для загрузки. Чтобы показать вам, насколько это просто, мы создадим быстрый виджет заголовков JavaScript с использованием последних новостей из RSS-канала SitePoint.

Сначала вам нужно получить ключ API Google. Это необязательно, но быстро и просто, и Google настоятельно рекомендует вам сделать это.

Чтобы начать использовать API-интерфейс Feed на наших страницах, нам нужно включить загрузчик Google в заголовок документа. Добавьте этот ключ API в качестве переменной в URL src вашего скрипта:

 <script type="text/javascript" src="https://www.google.com/jsapi?key=YOURKEY"></script> 

Далее в нашем собственном скрипте мы загрузим API-интерфейс Google Feed следующим образом:

  google.load("feeds", "1"); 

В этой строке указывается нужный нам модуль ( feeds ) и версия, которая на данном этапе все еще является версией 1. Этот материал google.load выглядит знакомым? Если вы видели это раньше, возможно, это связано с тем, что вы потратили некоторое время на использование Карт Google в своем приложении или, возможно, вам нравится использовать размещенные в Google библиотеки JavaScript или веб-шрифты. Существует довольно много различных модулей, поэтому, если вы используете более одного, вы можете загрузить их все вместе, например:

  google.load("feeds", "1"); google.load("jquery", "1.5.1"); google.load("maps", "2"); 

Далее нам нужно указать функцию, которая будет выполняться после полной загрузки документа — мы делаем это с помощью google.setOnLoadCallback . Просто для чего-то необычного, я покажу свой канал с помощью функции showFeed :

 google.setOnLoadCallback(showFeed); 

showFeed это место, где происходят все действия, и где мы можем рассмотреть некоторые варианты, которые API Google Feed может предложить нам. Наша первая задача — создать новый объект, который называется feed . Требуется только один аргумент, URL:

 function showFeed() { var feed = new google.feeds.Feed("http://www.sitepoint.com/feed/"); } 

По умолчанию API выдаст нам только четыре элемента из ленты. Используя метод setNumEntries , мы попросим еще немного — скажем, десять:

 function showFeed() { var feed = new google.feeds.Feed("http://www.sitepoint.com/feed/"); feed.setNumEntries(10); } 

Существует метод setResultFormat который позволяет нам указать формат: один из XML, JSON или комбинированный результат с обоими. Поскольку API обслуживает JSON по умолчанию, нет необходимости фактически указывать его как таковой; если вам интересно, это будет выглядеть так:

 feed.setResultFormat(google.feeds.Feed.JSON_FORMAT); 

Если вы хотите получить более старые записи RSS, Google может вернуть сохраненные копии предыдущих элементов в фиде. Это ловкий трюк! Канал SitePoint содержит достаточно записей, чтобы мы могли его использовать, поэтому мы можем пропустить его в нашем скрипте, но вы будете использовать его так:

 feed.includeHistoricalEntries(); 

Мы настроили все, что нам нужно, чтобы захватить канал — теперь давайте продолжим и загрузим его. Мы хотели бы, чтобы каждая запись RSS отображалась как элемент списка в списке с идентификатором headlines , показывающим заголовок, ссылку и автора каждого элемента. API может предоставить все это и многое другое — контент, категории, дату публикации и медиа. Следует отметить возможность автоматического создания фрагмента содержимого каждой записи для нас, что приятно. Давайте добавим это туда!

Метод .load запрашивает канал и выдает результат. В результате мы получим хороший, толстый объект JSON или код ошибки и сообщение, если он потерпит неудачу. Обратный вызов воздействует на этот результат: в случае успеха мы переберем каждый элемент в объекте JSON и вставим элемент списка для каждого. В противном случае мы вежливо провалимся со ссылкой на SitePoint:

 feed.load(function(result) { if (!result.error) { var container = document.getElementById("headlines"); for (var i = 0; i < result.feed.entries.length; i++) { var entry = result.feed.entries[i]; var li = document.createElement("li"); li.innerHTML = '<h3><a href="' + entry.link + '">' + entry.title + '</a>' + <cite>by ' + entry.author + '</cite></h3>'; li.innerHTML += '<p>' + entry.contentSnippet + '</p>'; container.appendChild(li); } } else { var container = document.getElementById("headlines"); container.innerHTML = '<li><a href="http://www.sitepoint.com">Get your geek news fix at SitePoint</a></li>'; } }); 

Это оно! Вы можете увидеть полный пример этого скрипта в нашей демонстрации. В общем, это заняло всего пару минут — это намного меньше, чем количество времени, которое потребовалось, чтобы объяснить это в этом посте!

Мы видели только часть того, что может предоставить API фидов, но в документации API фидов есть еще много всего . Вот для разборки без стресса!