|
盡管本文所使用的是php語言,但是請記住任何服務(wù)器端語言都會正常工作。為了理解本文,我假定你基本理解JavaScript和php或一類似服務(wù)器端語言。
本文示例使用AJAX來把一請求從一個RSS饋送發(fā)送到一定制的php對象。該php對象復(fù)制一份在本地服務(wù)器上的該饋送并返回這一路徑。該請求對象收到這一路徑,分析它,并且把數(shù)據(jù)以HTML形式顯示給用戶。這聽起來涉及很多步驟,其實(shí)它僅由4個小文件組成。之所以使用了4個小文件,是為了平衡它們各自特定的力量而使整個系統(tǒng)的處理極富效率性。
我想,有些讀者可能會問,為什么你要創(chuàng)建在本地服務(wù)器上的饋送的一個副本而不是簡單分析最原始的饋送。原因是,這樣以來可以允許繞過XML HTTP Request對象所強(qiáng)加的跨域限制。后面,我還會解釋怎樣創(chuàng)建這個定制的php對象;但是首先,讓我們從表單創(chuàng)建開始。
創(chuàng)建發(fā)出請求的表單
你要做的第一事情是,在你的HTML的head標(biāo)簽之間包括你可能想使用的JavaScript和任何CSS文件。我包括了一個式樣表來實(shí)現(xiàn)該聚合器的最后布局并用一個JavaScript文件來發(fā)出請求和進(jìn)行饋送分析:
<link href="css/layout.css" rel="stylesheet" type="text/css" />
<script src="js/request.js"></script>
下一步,創(chuàng)建一個表單,它針對你所選擇的一個RSS饋送發(fā)出請求。我創(chuàng)建的表單只包括一個輸入字段和一個提交該請求的按鈕。該請求的查詢是一個字符串,它由饋送輸入值和一個將在服務(wù)器端被校驗(yàn)的口令字組成;作為一個示例,我使用了下面形式:
"password=mypassword
該代碼在每次頁面加載之時發(fā)出一次請求;因此,如果頁面被刷新,現(xiàn)有的在該輸入域中的饋送串將在頁面加載時被請求。下面是一個表單數(shù)據(jù)的示例,連同一些div標(biāo)簽用來顯示已分析的饋送的特定結(jié)點(diǎn):
復(fù)制代碼 代碼如下:
<body onload="Javascript:makeRequest('request.php?request=' + document.feedForm.feed.value + 'password=mypassword');">
<form name="feedForm" method="post" action="Javascript:makeRequest('request.php?request=' + document.feedForm.feed.value + 'password=mypassword');">
Enter a feed: <input type="text" name="feed" id="feed" size="20">
<input type="submit" name="submit" value="Add Feed">
</form>
<div id="logo"></div>
<hr/>
<div id="copy"></div>
<div id="details"></div>
</body>
我所創(chuàng)建的這三個div標(biāo)簽是logo,copy和details,其中每一個都在布局樣式表中有一個與之相關(guān)聯(lián)的樣式。當(dāng)我們分析饋送時將會用到它們,但是我們首先需要能夠存取我們所請求的饋送。這可以使用我前面所提到的php對象來完成。
創(chuàng)建定制的php對象
我用php創(chuàng)建了一個小型RSS類,它在本地服務(wù)器上創(chuàng)建一個請求饋送的副本,這樣它可以為我們稍后要創(chuàng)建的XML HTTP Request對象所存取。典型地,你不能跨域請求一個文件,這意味著你要請求的文件需要位于本地服務(wù)器上。這個類是一種解決跨域問題的辦法,因?yàn)樗鼊?chuàng)建該饋送的一個副本,這個副本在本地服務(wù)器上被請求并且把本地路徑返回到該饋送,然后它由該Request對象來存取。
這個類中唯一的方法是一個請求方法,它僅有一個指向所請求的RSS 饋送的URL的參數(shù)。然后,它通過rss的名字來檢查是否一目錄位于本地服務(wù)器上。如果不存在,就創(chuàng)建一個并把其權(quán)限模式設(shè)置為0666,這意味著該目錄可讀寫。當(dāng)被設(shè)置為可讀的時,該目錄就可以在以后被存取;而當(dāng)被設(shè)置為可寫的時,就可以把該饋送的一個副本寫向本地服務(wù)器上的目錄:
復(fù)制代碼 代碼如下:
//如果不存在目錄就創(chuàng)建一個
$dir = "rss";
if(!is_dir($dir))
{
mkdir($dir, 0666);
}
注意
在一臺Windows機(jī)器上,對于php 4.2.0及以上版本中模式設(shè)置是不被要求的。但是,如果它存在的話,它將被忽略;因此,我保留了它,以備該工程被遷移到一臺UNIX或Linux服務(wù)器上。
在把饋送復(fù)制到該服務(wù)器前,我們需要一個唯一的文件名。我對這個完整的URL使用了md5加密方法以確保所有饋送的名字是唯一的。通過這個新的文件名,它可以連接一個描述指向該文件的目錄的字符串;這將在創(chuàng)建該饋送的副本時使用:
復(fù)制代碼 代碼如下:
//創(chuàng)建唯一的命名
$file=md5($rss_url);
$path="$dir/$file.xml";
通過使用被定義在上面的路徑和到原始的被請求的饋送的URL的參考,現(xiàn)在我們能創(chuàng)建該文件的一個副本。最后,把該路徑返回到該新文件,作為對該請求的響應(yīng):
復(fù)制代碼 代碼如下:
//復(fù)制饋送到本地服務(wù)器
copy($rss_url,"$path");
return $path;
Following is the small, yet powerful RSS class in its entirety:
<?php
class RSS
{
function get($rss_url)
{
if($rss_url != "")
{
//如果不存在目錄就創(chuàng)建一個
$dir = "rss";
if(!is_dir($dir))
{
mkdir($dir, 0666);
}
// 創(chuàng)建一個唯一的名字
$file = md5($rss_url);
$path = "$dir/$file.xml";
//復(fù)制饋送到本地服務(wù)器
copy($rss_url, "$path");
return $path;
}
}
}
?>
為了存取該php類中的方法,需要有一個請求文件來擔(dān)當(dāng)?shù)皆擃惖囊粋€接口,這也正是我們正在請求的文件。這個文件首先驗(yàn)證從該請求查詢的一口令變量,或者返回一條指定該請求者不是一名經(jīng)授權(quán)的用戶的消息,或者用指向RSS饋送(該饋送在由請求方法處理后被復(fù)制到本地服務(wù)器)的路徑作出響應(yīng)。為了響應(yīng)該RSS饋送,需要包含這個RSS對象并把它實(shí)例化,并且需要通過使用被請求的饋送的URL作為一參數(shù)來激活請求方法:
復(fù)制代碼 代碼如下:
<?
if($password == "mypassword")
{
require_once('classes/RSS.class.php');
$rss = new RSS();
echo $rss->get($request);
}
else
{
echo "You are an unauthorized user";
}
?>
GET/POST與AJAX相結(jié)合
為了POST請求,我們首先需要創(chuàng)建該請求對象。如果你沒有創(chuàng)建請求對象的經(jīng)驗(yàn),那么可以讀一下我的文章《How To Use AJAX》或簡單地研究一下本文的示例源代碼。一旦創(chuàng)建該請求對象,就可以調(diào)用sendFeed方法并傳遞由表單所創(chuàng)建的URL:
復(fù)制代碼 代碼如下:
function sendFeed(url){
post.onreadystatechange = sendRequest;
post.open("POST", url, true);
post.send(url);
}
一旦收到來自于php對象的響應(yīng)并被正確加載,則對與該響應(yīng)相應(yīng)的本地文件發(fā)出另一個請求。在這種情況中,post.responseText提供給我們該新文件的路徑:
function sendRequest(){
if(checkReadyState(post)){
request = createRequestObject();
request.onreadystatechange = onResponse;
request.open("GET", post.responseText, true);
request.send(null);
}
}
分析響應(yīng)
由于RSS饋送之間的區(qū)別,分析響應(yīng)具有一定的挑戰(zhàn)性。一些含有包含標(biāo)題和描述結(jié)點(diǎn)的圖像,而其它則沒有。因此,當(dāng)我們分析回饋時,我們需要做一點(diǎn)檢查來譯解它是否包括一圖像。如果它包括一圖像,我們就可以,與該饋送的標(biāo)題和鏈接一起,在image div標(biāo)簽中顯示該圖像:
復(fù)制代碼 代碼如下:
var _logo = "";
var _title = response.getElementsByTagName('title')[0].firstChild.data;
var _link = response.getElementsByTagName('link')[0].firstChild.data;;
_logo += "<a href='" + _link + "' target='_blank'>" + _title + "</a><br/>";
if(checkForTag(response.getElementsByTagName('image')[0]))
{
var _url = response.getElementsByTagName('url')[0].firstChild.data;
_logo += "<img src='" + _url + "' border='0'><br/>"
}
document.getElementById('logo').innerHTML = _logo;
我們不僅必須檢查每個圖像以顯示它,當(dāng)遍歷饋送中所有的項(xiàng)時我們還需要對之進(jìn)行檢查。因?yàn)槿绻嬖谝粋€圖像,那么所有另外的標(biāo)題和鏈接結(jié)點(diǎn)索引都將無法正常工作。因此,當(dāng)發(fā)現(xiàn)圖像標(biāo)簽時,我們應(yīng)該通過在每一次遍歷中增加索引值(+1)來調(diào)整標(biāo)題和鏈接結(jié)點(diǎn)的索引:
復(fù)制代碼 代碼如下:
if(checkForTag(response.getElementsByTagName('image')[0]) "" i>0){
var _title=response.getElementsByTagName('title')[i+1].firstChild.data;
var _link=response.getElementsByTagName('link')[i+1].firstChild.data;
}
else{
var _title =response.getElementsByTagName('title')[i].firstChild.data;
var _link = response.getElementsByTagName('link')[i].firstChild.data;
}
你可以使用checkForTag方法來檢查是否存在特定的標(biāo)簽:
function checkForTag(tag){
if(tag != undefined) {
return true;
}
else{
return false;
}
}
存在許多種進(jìn)行饋送分析的可能性。例如,你可以把項(xiàng)賦到類別上并使得該類別可折迭,這樣用戶就可以對其想觀看的內(nèi)容進(jìn)行選擇。作為一個示例,我使用日期來對項(xiàng)進(jìn)行分類-這可以通過譯解是否針對一個特定項(xiàng)的pubDate不同于前一個項(xiàng)的pubDate并且相應(yīng)地顯示一新的日期來實(shí)現(xiàn):
復(fù)制代碼 代碼如下:
if(i>1){
var previousPubDate = response.getElementsByTagName('pubDate')[i-1].firstChild.data;
}
if(pubDate != previousPubDate || previousPubDate == undefined){
_copy += "<div id='detail'>" + pubDate + "</div><hr align='left' width='90%'/>";
}
_copy += "<a href=/"Javascript:showDetails('" + i + "');/">" + _title + "</a><br/><br/>";
document.getElementById('copy').innerHTML += _copy;
注意,上面的最后一部分是showDetails方法,它用于當(dāng)一用戶從一個饋送中選擇一特定的項(xiàng)時進(jìn)行細(xì)節(jié)顯示。這個方法有一個參數(shù)(項(xiàng)索引值),這個索引用于發(fā)現(xiàn)在該饋送中details結(jié)點(diǎn)的索引:
復(fù)制代碼 代碼如下:
function showDetails(index){
document.getElementById('details').innerHTML = response.getElementsByTagName('description')[index].firstChild.data;
}
結(jié)論
使用AJAX發(fā)送查詢字符串到一個服務(wù)器端腳本并檢索一個基于該串的定制響應(yīng),這對于任何web開發(fā)者都有實(shí)現(xiàn)的可能。這樣以來,你的下一個web應(yīng)用程序也將會充滿了新的可能性。
php技術(shù):利用PHP和AJAX創(chuàng)建RSS聚合器的代碼,轉(zhuǎn)載需保留來源!
鄭重聲明:本文版權(quán)歸原作者所有,轉(zhuǎn)載文章僅為傳播更多信息之目的,如作者信息標(biāo)記有誤,請第一時間聯(lián)系我們修改或刪除,多謝。