PHP と AJAX を使用して RSS アグリゲーターを作成するコード

WBOY
リリース: 2016-06-13 12:32:58
オリジナル
822 人が閲覧しました

想象使用一个简单HTML文件来把一个请求发送到一个服务器端脚本,收到一个基于该请求的定制XML文件,然后把它显示给用户而几乎不需要刷新浏览器!本文作者将同你一起探讨怎样在普通Web应用程序中联合PHP和AJAX技术来创建实时的数据传输而不需要进行浏览器刷新。
  尽管本文所使用的是PHP语言,但是请记住任何服务器端语言都会正常工作。为了理解本文,我假定你基本理解JavaScript和PHP或一类似服务器端语言。
  本文示例使用AJAX来把一请求从一个RSS馈送发送到一定制的PHP对象。该PHP对象复制一份在本地服务器上的该馈送并返回这一路径。该请求对象收到这一路径,分析它,并且把数据以HTML形式显示给用户。这听起来涉及很多步骤,其实它仅由4个小文件组成。之所以使用了4个小文件,是为了平衡它们各自特定的力量而使整个系统的处理极富效率性。
  我想,有些读者可能会问,为什么你要创建在本地服务器上的馈送的一个副本而不是简单分析最原始的馈送。原因是,这样以来可以允许绕过XML HTTP Request对象所强加的跨域限制。后面,我还会解释怎样创建这个定制的PHP对象;但是首先,让我们从表单创建开始。
  创建发出请求的表单
 
  你要做的第一事情是,在你的HTML的head标签之间包括你可能想使用的JavaScript和任何CSS文件。我包括了一个式样表来实现该聚合器的最后布局并用一个JavaScript文件来发出请求和进行馈送分析:


  下一步,创建一个表单,它针对你所选择的一个RSS馈送发出请求。我创建的表单只包括一个输入字段和一个提交该请求的按钮。该请求的查询是一个字符串,它由馈送输入值和一个将在服务器端被校验的口令字组成;作为一个示例,我使用了下面形式:
"password=mypassword 
  该代码在每次页面加载之时发出一次请求;因此,如果页面被刷新,现有的在该输入域中的馈送串将在页面加载时被请求。下面是一个表单数据的示例,连同一些div标签用来显示已分析的馈送的特定结点:

复制代码 代码如下:


 

 
Enter a feed:  
 
 
 

 
 



私が作成した 3 つの div タグは、ロゴ、コピー、詳細であり、それぞれレイアウト スタイル シート スタイルに関連付けられています。フィードを分析するときにこれらを使用しますが、最初に要求したフィードにアクセスできるようにする必要があります。これは、前に説明した PHP オブジェクトを使用して実行できます。
カスタム PHP オブジェクトを作成します
PHP で小さな RSS クラスを作成しました。このクラスはローカル サーバー上にリクエスト フィードのコピーを作成し、後で作成する XML HTTP リクエスト オブジェクトからアクセスできるようにします。通常、ドメインを越えてファイルをリクエストすることはできません。つまり、リクエストしているファイルはローカル サーバー上にある必要があります。このクラスは、ローカル サーバー上でリクエストされたフィードのコピーを作成し、フィードへのローカル パスを返し、その後 Request オブジェクトによってアクセスされるため、クロスオリジン問題の解決策となります。
このクラスの唯一のメソッドはリクエスト メソッドであり、リクエストされた RSS フィードの URL を指すパラメータが 1 つだけあります。次に、ローカル サーバー上にディレクトリがあるかどうかを RSS 名で確認します。存在しない場合は、作成してそのアクセス許可モードを 0666 に設定します。これは、ディレクトリが読み取りおよび書き込み可能であることを意味します。読み取り可能に設定すると、ディレクトリに後でアクセスできます。書き込み可能に設定すると、フィードのコピーをローカル サーバー上のディレクトリに書き込むことができます:

コードをコピー コードは次のとおりです。


// ディレクトリが存在しない場合は、
$dir = "rss"
if (!is_dir($dir); )
{
mkdir($dir, 0666);
}



Windows マシンでは、PHP 4.2 バージョン .0 ではモード設定は必要ありません。以上。ただし、存在しても無視されるため、プロジェクトが UNIX または Linux サーバーに移動された場合に備えて保存しておきました。
このサーバーにフィードをコピーする前に、一意のファイル名が必要です。すべてのフィード名が一意であることを保証するために、完全な URL で md5 暗号化を使用しています。この新しいファイル名を使用すると、ファイルを指すディレクトリを説明する文字列を連結できます。これは、フィードのコピーを作成するときに使用されます:

コピー コード コードは次のとおりです:


//一意の名前を作成します
$file=md5($rss_url);
$path="$dir/$file.xml" ;


ここで、上で定義したパスと、要求された元のフィード URL への参照を使用して、このファイルのコピーを作成できます。最後に、リクエストに応じて新しいファイルへのパスを返します:

コードをコピーします コードは次のとおりです:


// フィードをローカル サーバーにコピーします。
copy($rss_url, "$path");
return $path;
次に、小さいながらも強力な RSS クラス全体を示します。 ? php
class RSS
{
function get($rss_url)
{
if($rss_url != "")
{
// ディレクトリを作成します存在しません a
$dir = "rss";
if(!is_dir($dir))
{
mkdir($dir, 0666) }
; //一意の名前を作成します
$file = md5($rss_url);
$path = "$dir/$file.xml"
//フィードをローカル サーバーにコピーします
copy($ rss_url, "$ path");
return $path; は、まさに要求しているファイルです。このファイルは、最初にリクエストからクエリされたパスワード変数を検証し、リクエスタが許可されたユーザーではないことを示すメッセージを返すか、RSS フィード (リクエスト メソッドによって処理された後にローカル サーバーにコピーされる) を指します。応答するためのパス。 RSS フィードに応答するには、RSS オブジェクトを含めてインスタンス化する必要があり、要求されたフィードの URL をパラメータとして使用してリクエスト メソッドをアクティブにする必要があります:



コードをコピー

コードは次のとおりです:


<
if($password == "mypassword")
{
require_once('classes/RSS.class.php'); ();
echo $rss->get($request);
else
{
echo "あなたは不正なユーザーです"; >


GET/POST と AJAX の組み合わせ
POST リクエストを行うには、まずリクエスト オブジェクトを作成する必要があります。リクエスト オブジェクトの作成経験がない場合は、私の記事「AJAX の使用方法」を読むか、この記事のサンプル ソース コードを勉強してください。リクエスト オブジェクトが作成されたら、sendFeed メソッドを呼び出し、フォームで作成した URL を渡すことができます:



コードをコピー

コードは次のとおりです:関数 sendFeed(url){ post.onreadystatechange = sendRequest;

post.open("POST", url, true); >}

PHP オブジェクトからの応答が受信され、正しくロードされると、応答に対応するローカル ファイルに対して別のリクエストが行われます。この場合、post.responseText は新しいファイルへのパスを提供します。
function sendRequest(){
if(checkReadyState(post)){
request = createRequestObject()
request .onreadystatechange; = onResponse;
request.open("GET", post.responseText, true);
request.send(null)


レスポンスの分析
RSS フィード間の違いにより、応答の分析が困難になる場合があります。タイトルと説明ノードを含む画像が含まれるものもあれば、含まれないものもあります。したがって、フィードバックを分析するときは、フィードバックに画像が含まれているかどうかを解読するために少しのチェックを行う必要があります。画像が含まれている場合は、その画像をフィードのタイトルとリンクとともに画像 div タグに表示できます:



コードをコピー

:


var _logo = "";

var _title = response.getElementsByTagName('title')[0].firstChild.data; var _link = response.getElementsByTagName('link ')[0] .firstChild.data;; _logo = "" _title "
"; checkForTag(response.getElementsByTagName('image')[0]))
{
var _url = response.getElementsByTagName('url')[0].firstChild.data = "
"

}

document.getElementById('logo').innerHTML = _logo;


各画像を表示するためにチェックする必要があるだけでなく、フィード内のすべてのアイテムを反復処理するときにもチェックする必要があります。画像が存在すると、タイトルおよびリンク ノードの他のすべてのインデックス作成が適切に機能しなくなるためです。したがって、画像タグが見つかったら、各パスでインデックス値 (1) を増やしてタイトルとリンク ノードのインデックスを調整する必要があります:



コピー コード

コードは次のとおりです:

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;

} var _title; =response.getElementsByTagName('title')[i].firstChild.data; var _link = response.getElementsByTagName('link')[i].firstChild.data; を使用できます。特定のタグが存在するかどうかを確認する checkForTag メソッド: function checkForTag(tag){

if(tag != unknown) {

return true;
}
else{
return false ;
}
}


フィード分析を実行するにはさまざまな可能性があります。たとえば、項目をカテゴリに割り当て、そのカテゴリを折りたたみ可能にして、ユーザーが見たいものを選択できるようにすることができます。例として、日付を使用してアイテムを分類します。これは、特定のアイテムの pubDate が前のアイテムの pubDate と異なるかどうかを解読し、それに応じて新しい日付を表示することで実現されます:

コードをコピー コードは次のとおりです:


if(i>1){
varPreviousPubDate = response.getElementsByTagName('pubDate')[i-1 ] .firstChild.data;
}
if(pubDate !=PreviousPubDate ||previousPubDate == 未定義){
_copy = "

"
";
}
_copy = " _title "

";
document.getElementById('copy').innerHTML = _copy;


上記の点に注意してください最後の部分は showDetails メソッドです。これは、ユーザーがフィードから特定のアイテムを選択したときに詳細を表示するために使用されます。このメソッドには 1 つのパラメーター (項目インデックス値) があり、フィード内の詳細ノードのインデックスを検索するために使用されます:

コードをコピー コードは次のとおりです。次のように:


function showDetails(index){
document.getElementById('details').innerHTML = response.getElementsByTagName('description')[index].firstChild.data; >}

結論

AJAX を使用してクエリ文字列をサーバー側スクリプトに送信し、その文字列に基づいてカスタマイズされた応答を取得することは、Web 開発者であれば誰でも可能です。このようにして、次の Web アプリケーションは新しい可能性に満ちたものになります。
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のおすすめ
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート