[特別企画] JavaServer Facesを理解する（後編）

JSFによるWebアプリケーション開発

五十嵐由
2003/8/27

　前回「JSFの構造を理解する」では、「JavaServer Faces」（以下JSF）の概要を説明した後、「Java Web Services Developer Pack」（以下JWSDP）に付属するサンプルアプリケーションを動作させてみました。今回は、筆者が作成したJSFアプリケーションを紹介しながら、より深く理解していただくことにします。

　解説を始める前に、前回の記事を読んでもJSFのメリットがよく分からないという読者のために、再度JSFを使用するメリットを以下に整理します。

●ステート情報の保持 フォームに入力された値はJSFのコンテキストに保持されます。これにより、バリデータで値が適当でないと判断された場合など、再度フォームを表示する際に、（以前の）値が入力されたフォームを表示することができます。 ●Webアプリケーションを構築するうえで必要なコンポーネントが用意されている 入力値のチェック（バリデータ） 入力された値が適当（必須フィールドのチェック、文字入力パターンのチェックなど）であるか判断します。適当でない場合には、メッセージを表示します。 型の変換（コンバータ） 入力された値を指示したJavaの型に変換します。これにより容易にデータモデルと連携できます。 イベントの制御（イベントハンドラ） コンポーネントごとにイベントを定義することができます。 データモデルへのマッピング バックエンドシステムデータ（データベース、JavaBeansなど）とJSFのUIコンポーネントをマッピングすることができます。 JSPタグが用意されている JSFのUIコンポーネントを使用するためのタグが用意されており、容易にJSFを使用しWebページを形成できます。 UIコンポーネントを実装するためのフレームワークが用意されている JSFで用意されているコンポーネントに加え、独自のUIコンポーネントを作成することができ、これにより自由なUIを作成ができます。また、そのコンポーネントを再利用ができます。

　これまでのJSPとServlet、JavaBeansを用いたWebアプリケーションを実装する際に必要だった面倒な処理をなくし、あればよいと皆が感じていた機能を提供してくれるのがJSFだといえるでしょう。また、JSFがWebアプリケーションのユーザーインターフェイスを構築するための標準フレームワークとなれば、開発モデルの統一化を図ることもでき、開発効率やサポート効率の向上も期待できるでしょう。

　さて、それでは、JSFアプリケーションの構築に話を移しましょう。

JSFアプリケーションの構築

　筆者が作成したアプリケーションはJWSDPに付属する「Car Demo Sample」を簡略化したものです。アプリケーションのソースコードとWARパッケージはこちらからダウンロードしてください。

　アプリケーションの内容は以下のとおりです。

（1）	カタログから車を選択
（2）	車のパッケージ（Custom、Deluxe）、オプション（エンジン、カーオーディオ、GPS、セキュリティシステム）の選択、変更および費用の計算
（3）	買い物内容の確認
（4）	クレジットカード番号、カードの使用期限を入力し、買い物の完了
（5）	お礼メッセージの表示

　また、アプリケーションのページ構成とクラスの関係は下図のようになります。

図1　アプリケーションのページ構成とクラスの関係

　次に、JSFアプリケーションのディレクトリ、ファイル構成（イメージファイルなどは省略）を説明します。JSFアプリケーションのディレクトリ構造は従来のWebアプリケーションと同様です。アプリケーションのルートディレクトリにはJSP、HTMLなどのファイルを配置し、WEB-INFディレクトリにfaces-config.xml、web.xmlなどのアプリケーション定義ファイル、WEB-INF/classesディレクトリに作成したクラスファイル、WEB-INF/libディレクトリにアプリケーションに必要なライブラリを配置します。

　JSFアプリケーションを実行するために必要なライブラリは下図を参考にしてください（ただし、今回のアプリケーションはJWSDPにバンドルされているTomcatにデプロイしますので、下図のすべてのJarファイルをWEB-INF/libに用意しなくても動作します）。

図2　ディレクトリ構成 (クリックすると拡大します）

　次に、筆者がJSFアプリケーションを作成した手順を紹介しましょう。以下のような手順で作成しました。

（1）	モデル、ビジネスロジック
	・モデル、ビジネスロジッククラスの実装 ・コンフィグレーションファイルの設定
（2）	カスタムコンバータ、カスタムバリデータ、タブハンドラ
	・クラスの実装 ・コンフィグレーションファイルの設定
（3）	UIコンポーネント、JSFタグライブラリを使用したJSPの作成
（4）	ページナビゲーションの定義、そのほか

　それでは、作成した順にアプリケーションの処理内容を説明していきましょう。

1/4

INDEX
JavaServer Facesを理解する（後編）
	Page1 JSFアプリケーションの構築
	Page2 モデルとビジネスロジック
	Page3 カスタムコンバータ、カスタムバリデータ、タブハンドラ
	Page4 UIコンポーネント、JSFタグライブラリを使用したJSPの作成 ページナビゲーションの定義 まとめ

INDEX
特別企画：JavaServer Facesを理解する
	前編　JSFの構造を理解する
	後編　JSFによるWebアプリケーション開発

連載記事一覧

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