少年幃禿的煩惱


心情也微微的...凸

最近的學習心得 都改放到 少年幃禿的煩惱@Google Sites

2008/07/14

Google AJAX Feed API (2) - Introduction

Javascript 與 XMLHttpRequest 使用 Same-Origin Policy (SOP). 根據這個規則, 只允許 script 從相同主機的來源存取資料. 這是為了防止使用者遭受到某些種類的 scripting 攻擊, 但同時也限制了開發者撰寫基於 AJAX 的混搭. Google AJAX Feed API 提供一個 workaround 的方法來取得 web 上特殊類型的資料: syndication feeds. 請看 security notes 有更多的細節關於 AJAX Feed API 如何作安全性處理.

The "Hello, World" of the Google AJAX Feed API
接下來的範例將取得 Digg RSS Feed 並且顯示文章標題給使用者看.

&lt;html> &lt;head> <script type="text/javascript" src="//www.google.com/jsapi?key=YOUR_KEY_HERE"></script> <script type="text/javascript"> google.load("feeds", "1"); function initialize() { var feed = new google.feeds.Feed("http://www.digg.com/rss/index.xml"); feed.load(function(result) { if (!result.error) { var container = document.getElementById("feed"); for (var i = 0; i < result.feed.entries.length; i++) { var entry = result.feed.entries[i]; var div = document.createElement("div"); div.appendChild(document.createTextNode(entry.title)); container.appendChild(div); } } }); } google.setOnLoadCallback(initialize); </script> &lt;/head> &lt;body> <div id="feed"></div> &lt;/body> &lt;/html> 你可以由 Google 下載這個範例, 但是必須將 key 換成你自己的 Google API key.

Including the AJAX Feed API on Your Page
引用 AJAX Feed API, 需要同時引用 Google AJAX APIs 標籤與呼叫 google.load("feeds", "1");
<script type="text/javascript" src="//www.google.com/jsapi?key=YOUR_KEY_HERE"></script> <script type="text/javascript"> google.load("feeds", "1"); </script>
JSON and XML Result Formats
AJAX Feed API 回傳兩種格式的 feeds: JSON 和 XML. 預設是使用 JSON 格式.
AJAX Feed API JSON 格式是一種精簡且規範的版本. 它使用一組共通的 JSON 屬性, 映射到 Atom 與 RSS 屬性上, 像是 title, description, 和 summary, 使用統一的方法來存取 Atom 與 RSS. 舉例來說, JSON 格式在回傳 RSS 屬性 description 時, 使用 JSON 的 content 屬性, 跟 Atom 一樣. 同樣的, RSS 的 pubDate 回傳時是使用 JSON 的 publishedDate 屬性. JSON 格式對於存取標準的 RSS 與 Atom 時是非常好用的, 你不需要考慮到兩種格式之間的差異. 其他細節部分可以參考 JSON result format specification.

如果你使用 setResultFormat 來指定回傳 XML 格式, AJAX Feed API 將會回傳完整的 XML 結果來取代 JSON 結果. 你可以使用瀏覽器內標準的 XML DOM 函數來取得 XML 文件. XML 格式在需要取得 feed 額外拓展元素的時候非常有用, 像是 digg:diggCount. 其他細節部分可以參考 XML result format specification.

你也可以同時取得 JSON 與 XML 格式. 請看 combined XML/JSON example 這範例使用 JSON 取得 feed 的內容, 但是使用 XML DOM 去取得 Digg 的 digg:diggVotes.