RSS聚合器是一種特別適合于使用標準AJAX引擎進行構建的應用程式，然而，要實現對RSS回饋的跨域的AJAX請求往往是非常難的。在本文中，我將向你展示怎么利用一個簡單的PHP函數來實現"橋接"AJAX引擎和RSS內容。

　　一、 引言

　　目前，研發一個RSS聚合器已不再是困難的事情，不過研發一個高質量的RSS聚合器卻仍然存在相當的難度。另一方面，創建一個制定聚合器一般不是非常難，并且在這種聚合器內能夠提供一個你自己選擇的接口。RSS聚合代表了一類特別適合于一個AJAX應用程式所消費的數據，這是因為：他是XML格式的，并且AJAX能夠良好地顯示新的回饋而不必進行頁面刷新。然而問題總是存在：在一個標準的AJAX引擎中實現跨域的AJAX請求是不可能的。在本文中，我將向你展示怎么利用一個非常簡單的PHP函數來橋接AJAX引擎和遠程內容（在本文中他指的是RSS回饋）。

　　【提示】 本文假定你已對PHP有一個基本理解并且有使用AJAX和分析XML的經驗。要全方面理解本文所提供的示例，你需要下載相應的源碼文件。

　　二、 開始

　　在我們正式開始前，我想簡短地介紹一下我們將用于發出請求的AJAX引擎。該引擎能夠簡化AJAX調用并且有助于消除當發出請求和調度響應時存在的大量冗余。我不會周詳討論他的組成代碼，而僅向你簡短地介紹我們在本文中怎么使用他。

　　首先，我們需要導入構成該引擎的所有JavaScript文件。包含在我們的index.html文件中的代碼看起來如下所示：

＜script type="text/javascript" src="http://www.knowsky.com/js/model/HTTP.js"＞＜/script＞
＜script type="text/javascript" src="http://www.knowsky.com/js/model/Ajax.js"＞＜/script＞
＜script type="text/javascript" src="http://www.knowsky.com/js/model/AjaxUpdater.js"＞＜/script＞

　　一旦我們導入該JavaScript文件，我們就能通過編寫類似下列的代碼來發出一個請求：

AjaxUpdater.Update(GET， url，callbackMethod);"＞

　　該AjaxUpdater是個對象，他負責處理我們的AJAX調用。我們簡單地調用他的Update方法并且傳遞請求的方法，我們請求的URL，及我們想把該響應代理到的回調方法。

　　當發出我們的請求時，這就是所有我們需要關心的。目前，讓我們集中于制定RSS聚合器的功能。

　　三、 入口點

　　指向該聚合器的入口是index.html文件，我們從瀏覽器中對他進行調用。下面是描述該index的代碼：

＜html＞
＜head＞
＜title＞RSS Aggregation with PHP and Ajax＜/title＞
＜link href="css/layout.css" rel="stylesheet" type="text/css" /＞
＜script type="text/javascript" src="http://www.knowsky.com/js/model/HTTP.js"＞＜/script＞
＜script type="text/javascript" src="http://www.knowsky.com/js/model/Ajax.js"＞＜/script＞
＜script type="text/javascript" src="http://www.knowsky.com/js/model/AjaxUpdater.js"＞＜/script＞
＜script type="text/javascript" src="http://www.knowsky.com/js/controller/Aggregator.js"＞＜/script＞
＜script type="text/javascript" src="http://www.knowsky.com/js/view/Feed.js"＞＜/script＞
＜/head＞
＜body＞

＜div id="Aggregator"＞
＜form name="feedForm" method="post" action="javascript:AjaxUpdater.Update(GET， bridge/rss.php?feed= + document.feedForm.feed.value， Aggregator.Read);"＞
＜div class="header"＞
＜input type="text" name="feed" id="feed" size="50"＞
＜input type="submit" name="submit" value="Add Feed"＞

＜/div＞
＜/form＞
＜div class="leftColumn"＞
＜div id="titles"＞＜/div＞
＜div id="loading"＞＜/div＞
＜/div＞
＜div class="rightColumn"＞
＜div id="description"＞＜/div＞
＜/div＞

＜/div＞

＜/body＞
＜/html＞

　　這個文件負責導入處理我們的聚合器顯示的CSS文件和所有的用于創建該聚合器和發出AJAX請求的JavaScript文件。

　　【提示】本文并沒有討論該CSS文件；我們只集中于討論通過JavaScript實現的聚合和分析。

　　然后，由該索引定義DIV標記，這些標記將用于描述接收到的數據的布局。他還包含一個表單，其中有一個輸入域用來輸入RSS回饋的URL，更有一個提交按鈕用于向他們發送請求。當點擊該按鈕時，將發送一個請求以接收RSS回饋并且把該響應發送到一個稱為Aggregator的對象；我們將在討論使用AJAX技術進行遠程RSS回饋檢索之后來介紹他。

　　四、 跨域AJAX請求

　　跨域AJAX請求是不可能的，不過的確存在一些方法以利用一種服務器端語言來解決這個問題。在這一節中，我要討論怎么使用PHP來創建AJAX請求和一個遠程RSS回饋之間的一個橋接，進而實現成功地跨域請求之目的。我想你非?？赡軙λ绱巳菀椎膶崿F感到驚訝。

　　PHP中提供了一個稱為file_get_contents的本地方法，他能夠把整個文件內容讀取到一個字符串中。如果啟動fopen包裝器的話，這個文件能是個遠程文件；在你安裝PHP時默認情況下是啟動的。如果在php.ini文件內把allow_url_fopen設置為off他才處于禁止狀態。下列代碼相應于該bridge.php文件的內容，當提交表單時我們使用index.html發送請求：

＜?
header("Content-Type: application/xml; charset=UTF-8");
echo file_get_contents($_GET[feed]);
?＞

　　上面代碼中的第一行是個頭（header），他負責把響應的內容類型設置為針對我們的請求對象的有效的XML。然后，調用file_get_contents，并結合回饋URL-這是通過我們的從index.html文件內的表單發出的請求進行傳遞的。一旦這些數據就緒，AJAX引擎即把他們代理到回調方法-我們的Aggregator對象。

　　五、 Aggregator對象

　　該Aggregator對象負責從AJAX引擎中接收響應。下列代碼展示了該對象(一個稱為feedCollection的數組，他將用來存儲所有的通過被檢索的回饋創建的回饋對象)的創建，更有一個稱為Read的方法(相應于從index.html表單中發出的請求的回調方法)。當該回調發生時，通過一個制定AJAX對象方法（他使用一個描述顯示加載消息的DIV元素的字符串作為參數）檢查請求的readyState。

Aggregator = new Object();
Aggregator.feedCollection = new Array();
Aggregator.Read = function()
{
　if(Ajax.checkReadyState(loading) == "OK")
　{
　　var title = Ajax.getResponse().getElementsByTagName(title)[0].firstChild.data;
　　var _link = Ajax.getResponse().getElementsByTagName(link)[0].firstChild.data;
　　var items = Ajax.getResponse().getElementsByTagName(item);

　　var feed = new Feed(Aggregator.feedCollection.length， title， _link， items);
　　Aggregator.feedCollection.push(feed);
　　Aggregator.displayFeedTitles(feed);
　}
}

　　在該Read方法中，我們要做的第一件事情是分析RSS回饋中的標題，鏈接和項。一旦我們擁有這些值，我們就能創建一個新的Feed對象（我們將在后面集中討論）。這個對象使用了feedCollection的長度（作為一個ID），及標題，鏈接和來自回饋的項。然后，該Feed對象被添加到feedCollection和一個稱為displayFeedTitles的方法中以便在該Feed對象中顯示相應于每一項的標題。

Aggregator.displayFeedTitles = function(feed)
{
　document.getElementById(titles).innerHTML += feed.GetTitle();
　Aggregator.DisplayTitles(feed.id);
}

　　這個方法以Feed對象作為一個參數，顯示他的標題，然后調用另一個稱為DisplayTitles的方法：

Aggregator.DisplayTitles = function(id)
{
　var titleArray = Aggregator.feedCollection[id].GetAllTitles();
　var titles = document.createElement("div");
　titles.id = "subTitle_"+ id;
　document.getElementById(title_+id).appendChild(titles);
　for(var i=0; i＜titleArray.length; i++)
　{
　　titles.innerHTML += titleArray[i] +"＜br /＞";
　}
}

　　這個方法接收一個回饋ID并使用他從feedCollection數組中檢索回饋并且得到他的所有標題。一旦接收到這些標題，我們將為該回饋中的項標題創建一個新的DIV元素并且把他添加在相應于特定的回饋的標題之后。這將允許我們通過點擊回饋標題來轉換顯示內容中項的標題。一旦添加該新的DIV元素，我們只需簡單地遍歷所有的標題并且把他們到添加該新的DIV即可。

　　上面兩個方法中的第一個用于實現轉換回饋中項的標題，第二個方法負責顯示一個在index.html文件中使用我們的描述DIV元素中的回饋的內容。這些回饋的內容通過Feed對象的GetDetails方法進行收集（在下一節當我們創建Feed對象時再討論）。

Aggregator.ToggleTitles = function(id)
{
　var titles = document.getElementById(subTitle_+id);
　titles.style.display = (titles.style.display == ) ? none : ;
}
Aggregator.DisplayFeed = function(feedId， id)
{
　var details = Aggregator.feedCollection[feedId].GetDetails(id);
　document.getElementById(description).innerHTML = details;
}
　　六、 Feed對象

　　這個Feed對象是個prototype。通過他的構造器函數，Feed對象接收當我們在Aggregator對象中創建他時傳遞的所有參數。這些參數分別相應于回饋的ID，標題，鏈接和項。在這個函數中，我們設置所有的缺省值，創建一些數組以備后用，并且把項發送到一個稱為parseItems的方法。在這個parseItems方法中，我們將檢索我們的回饋項中的所有的值并且填充我們在構造器中創建的那個數組。

Feed.prototype.parseItems = function(items)
{
　for(var i=0; i＜items.length; i++)
　{
　　var linkTitle = items[i].getElementsByTagName("title")[0].firstChild.nodeValue;
　　var title = "＜a href=# class=title onclick=Aggregator.DisplayFeed("+ this.id +"， "+ i +");＞" + linkTitle +"＜/a＞";
　　this.titleArray.push(title);
　　this.linkTitleArray.push(linkTitle);

　　var _link = items[i].getElementsByTagName("link")[0].firstChild.nodeValue;
　　this.linkArray.push(_link);

　　var description = items[i].getElementsByTagName("description")[0].firstChild.nodeValue;
　　this.descriptionArray.push(description);

　　var pubDate = items[i].getElementsByTagName("pubDate")[0].firstChild.nodeValue;
　　this.pubDateArray.push(pubDate);
　}
}

　　一旦我們把所有的值存儲在數組中，當我們準備好顯示頁面中的數據時我們就能夠使用他們。這個對象中的第三個方法集中于顯示回饋中的數據：

　　? GetTitle負責得到回饋標題（作為一個轉換項標題的鏈接，通過調用Aggregator的toggleTitles方法來實現）。

　　? GetAllTitles簡單地從回饋中返回所有的項標題。

　　? GetDetails負責實現顯示該回饋所有的細節。這個方法基于作為一個參數傳遞的ID檢索Feed對象的數組中的值。然后，這些值被格式化成一個HTML字符串并返回到調用者，然后由該調用者負責把他們添加到索引頁面。

Feed.prototype.GetTitle = function()
{
　return "＜div id=title_"+ this.id +"＞＜br/＞＜a href=# onclick=Aggregator.ToggleTitles("+ this.id +");＞" + this.title + "＜/a＞＜/div＞";
}

Feed.prototype.GetAllTitles = function()
{
　return this.titleArray;
}

Feed.prototype.GetDetails = function(id)
{
　details = "＜a href="+ this.linkArray[id] +" target=_blank＞"+ this.linkTitleArray[id] +"＜/a＞＜br/＞";
　details += this.descriptionArray[id] +"＜br/＞";
　details += this.pubDateArray[id];
　return details;
}

　　七、 小結

　　到目前為止，有關上面創建的Aggregator對象的下一步應該是添加一個timeout以便檢查針對當前被添加到聚合器的RSS回饋的更新。另外，該回饋還能夠被保存到一個數據庫中并且被基于用戶帳戶加以檢索。不過，因篇幅所限，這些功能只好留由讀者你來實現了……