連載 役に立つXMLツール集（11）
XULとJSFでリッチクライアント 〜ロジック編2〜 Page 1

XMLプログラミングでは、DOMやSAXといったAPIを使用すると単調なコードを繰り返し書くことになり生産性が上がらないものだ。本連載では開発者が“楽をする”ために役立つXML関連ツールを紹介していく。（編集局）

www.netpotlet.com
原田洋子
2004/10/13

■はじめに

主な内容 --Page 1-- はじめに サンプルの概要 --Page 2-- リクエストパラメータ取得／ナビゲーションの実装 --Page 3-- 検証／変換／ロジック実行の実装 まとめ＆サンプルダウンロード ごあいさつ

　これまで3回にわたって説明してきたXUL（ずーる：XML User Interface Language）とJSF（JavaServer Faces）ですが、いよいよ今回が最後です。今回を含めて4回の連載になりましたが、この間にJSF関係のニュースがいくつかありました。6月末にはSunがリリースしている参照実装のソースコードが公開され、8月末には次の仕様JSF 1.2（現時点の最新仕様は1.1）の検討がJSR-252の番号でJCPで始まりました。さらに、9月7日には参照実装1.1.01がリリースされました。また、オープンソースの実装MyFacesは7月16日にApacheのIncubatorプロジェクト ^※注1 で活動を開始しました。

※注1 Incubatorプロジェクト Apacheのプロジェクトやサブプロジェクトで正式に開発を進められるようになるための準備を行うところ。ここで認められるとJakartaなどのプロジェクトで活動できるようになる。卒業プロジェクトにはXMLBeans（XML-Javaバインディングツール）、JaxMe（JAXBの実装）などがある。

　JSFの仕様は1.0になったときに比較的大きな変更がありましたが、1.1での変更はほとんどありませんでした。次の1.2は若干の機能拡張が行われる予定ということになっているので、あまり変更はないでしょう。1.2と並行して検討が進められることになった2.0仕様では、リクエスト処理ライフサイクルといった基本概念の変更はないようですが、ツールサポートなど守備範囲が広がるようです。メジャーバージョンアップでは項目が増えてより大きな仕様になりそうです。

■サンプルの概要

　今回は、前回「XULとJSFでリッチクライアント 〜ロジック編〜」で説明したJSF仕様のロジックをどのように実装するのかを2つのサンプルで見ていきます。説明はプログラムが中心になりますが、ここで紹介するプログラムだけでなく、前回記事のリクエスト処理ライフサイクル（本連載第10回　図1）と4つのフェイズ「Apply Request Values」「Process Validations」「Update Model Values」「Invoke Application」の説明も併せて見てください。

サンプル1　リクエストパラメータの取得／ナビゲーション

　1つ目のサンプルはリクエストパラメータの取得とナビゲーションの実装です。図1を見てください。ここにはナビゲーションのためのボタンが2つあります。“English”ボタンを押せば英語のページ、“日本語”ボタンを押せば日本語のページに遷移するというシンプルなものです。このボタンのページをリスト1のlanguage.xulに示します。通常のXULと違うのは4行目にJSFタグの名前空間名があるのと、34、42行目でJSFタグを使っているところです。また、XULの場合サーバにパラメータをポストする動作はJavaScriptで記述しますが、そのためのコードがリスト1のscript要素内のJavaScriptとリスト2のcove.jsです。

図1　ナビゲーションボタン

【リスト1　language.xul（別ウィンドウで表示します）】

【リスト2　cove.js（別ウィンドウで表示します）】

　このサンプルではJSF仕様で定義されている各利用者は次の作業を行います。

ページ作成者	---	XULファイルを作る
アプリケーション開発者	---	JavaBeansのクラスを作る faces-config.xmlを書く
コンポーネント作成者	---	XULの要素に対応するUIコンポーネントを作る フォームの入力処理をUIコンポーネント内に実装する

サンプル2　検証／変換／ロジック実行

　2つ目のサンプルではブラウザに表示されたページに入力されたリクエストパラメータを取得し、取得した値が正しいかどうかを検証し、今後の処理に必要な型変換を行った後にロジックを実行します。パラメータ入力ページは図2（日本語）／図3（英語）のようになっています。各入力ページのXULはリスト3のuserinfo_ja.xul、リスト4のuserinfo_en.xulで、サーバにパラメータをポストするJavaScriptがリスト2のcove.jsとリスト5のuserinfo.jsです。リスト1と同様、リスト3、リスト4でもJSFタグを使っています。

図2　パラメータ入力ページ（日本語）

図3　パラメータ入力ページ（英語）

【リスト3　userinfo_ja.xul（別ウィンドウで表示します）】

【リスト4　userinfo_en.xul（別ウィンドウで表示します）】

【リスト5　userinfo.js（別ウィンドウで表示します）】

　このサンプルではJSF仕様で定義されている各利用者が行う作業としてサンプル1のケースに加えて次のように、ロジックを記述するリスナクラスとUIコンポーネント内に検証、変換処理も実装します。

ページ作成者	---	XULファイルを作る
アプリケーション開発者	---	JavaBeansのクラスを作る リスナのクラスを作る faces-config.xmlを書く
コンポーネント作成者	---	XULの要素に対応するUIコンポーネントを作る フォームの入力処理、検証処理、変換処理をUIコンポーネント内に実装する

　なお、これから紹介するサンプルは次の環境で動作を確認しています。

• J2SDK 1.4.2
• JSF 1.1.01
• Mozilla 1.7.3
• Relaxer 1.1b（20040808）

　では、実装をどのように行うかを見ていきましょう。（次ページに続く）

1/3

Index
連載 役に立つXMLツール集（11） XULとJSFでリッチクライアント 〜ロジック編2〜
	Page 1 ・はじめに ・サンプルの概要
	Page 2 ・リクエストパラメータ取得／ナビゲーションの実装
	Page 3 ・検証／変換／ロジック実行の実装 ・まとめ＆サンプルダウンロード ・ごあいさつ

「連載 役に立つXMLツール集」

＠ITメールマガジン　新着情報やスタッフのコラムがメールで届きます（無料）