デスクトップCGIフレームワークでDHTMLを実現する

第6回 デスクトップCGIでWebとデスクトップを融合する

第6回目となった本稿では、今まで静的なHTMLしか表示していなかったデスクトップCGIにJavaScriptを導入し、フィード情報をDHTMLで表示させていきます。

まえがき

　デスクトップCGIとは、「お気に入り」やブックマークなどのデスクトップのリソースにアクセスして動作するCGIアプリケーションと定義しています。デスクトップCGIを使えば、デスクトップ内の情報を元にWebから情報を収集するような、Webとデスクトップを統合したアプリケーションを作成することができます。

　これまでの連載で、デスクトップCGIの導入や環境構築、具体的なCGIスクリプトを作成してきました。第4回、第5回でMySQLを導入したことにより、より自由度の高いアプリケーションを作成できるようになりました。本稿では今まで静的なHTMLを表示していただけのデスクトップCGIに、JavaScriptを導入し、DHTML（ダイナミックHTML）を生成していきたいと思います。

　なお、前回の終わりにRSSフィードへの拡張を予告していましたが、Atomフィードの取り扱いと技術的に類似しており、記事として繰り返しになる部分が多いので、当面は拙著の「実践実用Perl」第6章「RSSハンドリング」（毎日コミュニケーションズ、2004年）と、連載第1回、第4回のAtomフィード記事を併せて参考にしていただくこととし、別の機会に、より発展した段階で紹介しようと思います。

今回の記事に必要な環境

　今回の記事の前提となる環境は、本稿記事の特に第1回と第4回にまとめられているので参考にしてください。少なくともWindows環境下でApache（あるいはAN HTTPDなどの他のHTTPサーバ）、MySQL、PerlとFirefoxを使える必要があります。

　本稿では第4回の記事で作成したAtomフィードデータベースを読み出すブラウザを作成します。これは、第5回に作成した「atom2msrdb_read.cgi」のJavaScript/DHTML版となります。

「デスクトップCGIによるWebとデスクトップの融合」の記事一覧

• 第1回　Firefox/Apache用AtomリーダーCGIの作成
• 第2回　Web日記のAtom配信
• 第3回　独自の日記記述言語からHTML形式のWeb日記を出力・配信する
• 第4回　MySQLでAtomフィードをデータベース化 前編
• 第5回　MySQLでAtomフィードをデータベース化 後編

JavaScriptとDHTML - Wikipedia

　JavaScriptやDHTMLについてはWikipediaによいまとめがあるので参照してください。

1. JavaScript - Wikipedia
2. ダイナミックHTML - Wikipedia

これまでのデスクトップCGIの流れ

　まず、簡単に今までの連載の流れをまとめてみます。

　第1回はAtomリーダーを作成しました。続く第2回ではAtomの生成配信、第3回ではMicroformatsを含めた日記の生成配信をしました。第4回と第5回は、MySQLによるAtomフィードデータベースの作成を行いました。現在までに作成・改版してきたデスクトップCGI・フレームワークのCGIをまとめると、以下の表の通りになります。

デスクトップCGI・フレームワークのCGI一覧

CGIファイル名	役割	参照先
feeds.cgi	FirefoxのブックマークのATOMとRSSフォルダを参照し、それぞれのフィードURLをパラメータとして、リーダーとなるatom2msrdb.cgiとrss2html.cgiをリンクさせる。	連載第5回
atom2msrdb.cgi	AtomフィードのURLをパラメータにAtomフィードのXMLを解析し、HTMLに変換して表示すると共に、Atomフィードデータベース（MySQL）に解析結果を格納する。	連載第4回
rss2html.cgi	RSSフィードのURLをパラメータにRSSフィードのRDF/XMLを解析し、HTMLに変換して表示する。	拙著「実践実用Perl」
atom2msrdb_feeds.cgi	atom2msrdb.cgiによりAtomフィードデータベースに格納されたフィードデータから、フィードリストの作成とエントリを読み出すatom2msrdb_read.cgiへのリンクを生成する。	連載第5回
atom2msrdb_read.cgi	atom2msrdb_feeds.cgiの生成したAtomフィードURLをパラメータとしたリンクからAtomフィードのentry要素をすべて出力する。	連載第5回

atom2msrdb_read.cgiの問題点と対策

　前回までの連載で1つ問題が発生しています。

　「atom2msrdb.cgi」（連載第4回）を使ってAtomフィードをHTML表示させると、そのたびに新しい記事がAtomフィードデータベースに格納されていきます。それを「atom2msrdb_read.cgi」（連載第5回）ですべて読み出してしまうと、記事量が多い場合には長大なHTMLが出力されることになり、デスクトップに過負荷をかけることになってしまいます。

　このような問題に対処するためには、検索条件によって範囲を絞り込んで読み出す方法が最終的に有効な方法ですが、全体を見たい場合もあります。

　そこで本稿では、データ量の少ないcategory要素、title要素、modified要素のみをJavaScriptのデータとして出力しておき、順次、発信サイトの記事部分あるいはcontent要素と一緒に1件ずつインタラクティブに表示する方法を考えます。

デスクトップCGI・フレームワークの構成

　本稿で述べる新しいデスクトップCGIを含むフレームワークの構成を図1にまとめます。

図1 新しいデスクトップCGI・フレームワーク