BT

JSF, Ajax, そしてSeamによるポートレット開発(パート2/3)

| 作者 Wesley Hales フォローする 0 人のフォロワー , 翻訳者 渡辺 裕之 フォローする 0 人のフォロワー 投稿日 2008年9月4日. 推定読書時間: 12 分 |

パート1(参考記事)では、JSFポートレットの実行に関する基礎について見ました。プロジェクトのセットアップ、3つの基本的なXMLファイルに対して必要とな設定、そして多くのJSFポートレット開発者が遭遇すると思われることに対する一般的なハウツーについて見ました。ここからはRichFacesのコンポーネント・ライブラリ(リンク)を通してAJAXでJSFポートレットを拡張する方法について見ていきます。

プロジェクトのセットアップ

開発ツール

これ以降のガイドを見ていくために最新のMavenをダウンロードして下さい。(私は2.0.9を使用しています)
Maven 2.0.9+(リンク)をインストールします
Mavenの各種バイナリにパスを通します(リンク)

サーバ及び見本アプリケーションで使用されるバイナリ
JBoss Portal 2.7 Beta1
JBoss Portlet Bridge Beta3

前回の記事(参考記事)で、Mavenのarchetypeを使うことと、セットアップするプロジェクトがMavenによってどのようにしてJBoss Portalが稼働するJBoss Application Server上に自動的にデプロイされるのかを説明しました。この記事の最初部分は簡単のため敢えて前回の記事とまったく同じ内容になっています。唯一の違いはプロジェクト名です。Mavenのコマンドは全て前回ままです。一度RichFacesのプロジェクトがセットアップされれば、内容の充実した参考書と以下のサンプルを試すための基盤が手に入るのです。

では、RichFacesのプロジェクトを作成しましょう。ソース・コードを確認して、簡単に設定を済ませて下さい。最終的にはデモを実行して実際の開発におけるタスクについて見ていきましょう。

ターミナルを開いて以下を実行してください

mvn archetype:generate
-DarchetypeGroupId=org.jboss.portletbridge.archetypes
-DarchetypeArtifactId=richfaces-basic -DarchetypeVersion=1.0.0.B3
-DgroupId=org.my.project -DartifactId=richfacesproject
-DarchetypeRepository=http://repository.jboss.org/maven2/
-Dversion=1.0.0.B3

新しいプロジェクトを作成したディレクトリに移動してください。上記の例をそのまま利用した場合には、"richfacesproject"ディレクトリになります。ざっと眺めて、作成されたファイルに目を通して下さい。Maven標準のフォルダ構造とこのチュートリアル用のソース・コードがあると思います。ここまで来たらお気に入りのIDEを立ち上げてこのMavenプロジェクトをインポートしてください。

設定

RichFacesライブラリのコンポーネントを使い始めるには少しだけXMLを変更しなければなりません。これらの設定はパート1(参考記事)で説明したオリジナルの設定に対する拡張になるのでここではJBoss Portlet Bridgeに対するJSF依存の設定についてのみ触れることにします。

以下の設定は用途によって変わります。この記事はAJAXに焦点を当てているので、ここではこれらのオプションがどのようにポートレットに影響するのかについてのみ説明します。より詳細な情報についてはRichFacesドキュメントのこの説(リンク)を見て下さい。

web.xml

--------------

RichFacesコンポーネントを表示するために必要なスクリプトやCSSスタイル・シートについてはここで調整します。JBoss Portalを利用する場合は、ポータル・ページの先頭で一度だけスタイル・シートやスクリプトが読み込まれるようにするためそれらのロード設定をオフにします。

<context-param>
     <param-name>org.richfaces.LoadStyleStrategy</param-name>
     <param-value>NONE</param-value>
 </context-param>
 <context-param>
     <param-name>org.richfaces.LoadScriptStrategy</param-name>
     <param-value>NONE</param-value>
 </context-param>
 <context-param>
     <param-name>org.ajax4jsf.RESOURCE_URI_PREFIX</param-name>
     <param-value>rfRes</param-value>
 </context-param>

 <filter>
     <display-name>Ajax4jsf Filter</display-name>
     <filter-name>ajax4jsf</filter-name>
     <filter-class>org.ajax4jsf.Filter</filter-class>
 </filter>

 <filter-mapping>
     <filter-name>ajax4jsf</filter-name>
     <servlet-name>FacesServlet</servlet-name>
     <dispatcher>FORWARD</dispatcher>
     <dispatcher>REQUEST</dispatcher>
     <dispatcher>INCLUDE</dispatcher>
 </filter-mapping>

jboss-portlet.xml

--------------

このファイルではポータル・ページの先頭で何を読み込ませるのかを設定します。見て分かる通り、"rfRes"というのはweb.xmlに記述したRESOURCE_URI_PREFIXのことです。ここではクラスパス上にあるRichFacesのリソースにアクセスするため、[サーブレット・パス]/RESOURCE_URI_PREFIXを挿入します。

以下の3つのファイルはRichFacesコンポーネント一式を適切に表示するために必要なものです。

<portlet>
     <portlet-name>ajaxPortlet</portlet-name>
     <header-content>
         <script src="/faces/rfRes/org/ajax4jsf/framework.pack.js" type="text/javascript"></script>
         <script src="/faces/rfRes/org/richfaces/ui.pack.js" type="text/javascript"></script>
         <link rel="stylesheet" type="text/css" href="/faces/rfRes/org/richfaces/skin.xcss"/>
     </header-content>
 </portlet>

デモ・アプリケーションの実行

続けてサーバを起動し2つの簡単なコマンドでRichFacesポートレットをデプロイします。操作を始める前にこの記事と前の記事(参考記事)におけるJBoss Portalのインストールの違いについて説明します。前回の記事では軽量なPortlet Container 2.0のデモを稼働させているJBoss App Server上にデプロイしました。前回の記事を公開した後、JBoss Portal 2.7のベータ版をリリースしました。今回のリリースによってJBoss Portalによる古いJSR-168の実装と新しいPortlet 2.0の実装が融合され、標準のJBoss Portalプロジェクト内で1.0版と2.0版のポートレットを実行できるようになりました。ですから、もしどのバージョンを使ったらいいのか判断するのに混乱しているとしたら、それは間違いです。JBoss Portal 2.7は私達が提供する必要のある全ての物を究極的に融合したもので、バージョン 2.6.xはJSR-168 (ポートレット1.0)しかサポートしない安定版だということだけ覚えておいてください。 

JBoss Portalの任意の(ベータ版でも安定版でも)バージョンにこのデモ・ポートレットをデプロイする方法の詳細な情報についてはこちら(リンク)を読んでください。

ステップ1:サーバをダウンロードして起動する。

http://downloads.sourceforge.net/jboss/jboss-portal-2.7.0.B1-bundled.zip よりJBoss Portal 2.7ベータ1がバンドルされたJBoss App Serverをダウンロードします。

次に、下にある"path_to_bundle_zip"がJBoss Portal 2.7バンドルへの絶対パスに置換されていることを確認してから下記のコマンドを実行します。

mvn install cargo:start -Plocal-portal -DJBOSS_ZIP_HOME=/path_to_bundle_zip/jboss-
portal-2.7.0.B1-bundled.zip -DJBOSS_HOME_DIR=jboss-portal-2.7.0.B1-
bundled/jboss-portal-2.7.0.B1

このコマンドはちょっと長ったらしく感じるかも知れませんが、このコマンドによって互換性のある任意のバージョンのJBoss App ServerとJBoss Portalを組み合わせることができるのです。

下の画面と同じ出力が得られたら、次のステップへ進んでください。

ステップ2:デモ・アプリケーションのデプロイ

さあ、2つ目のターミナル・ウィンドウを立ち上げて、"richfacesproject"のルートまで移動して次のコマンドを実行します。

mvn cargo:deploy -Plocal-portal -DJBOSS_ZIP_HOME=/path_to_bundle_zip/jboss-
portal-2.7.0.B1-bundled.zip -DJBOSS_HOME_DIR=jboss-portal-2.7.0.B1-bundled/jboss-
portal-2.7.0.B1

"path_to_bundle_zip"を置換するのを忘れないで下さい。

ここまで来たらhttp://localhost:8080/portal/portal/default/RichFacesEchoPortlet (リンク)を開いてRichFacesデモ・ポートレットにアクセスできます。

RiceFacesポートレットの開発

ポートレットからAJAXのリクエストを送信する場合、ポートレットとサーブレットのセッションの違いを意識することが重要です。例えば、ユーザがポートレット内部でAJAXのリクエストを投げたとします。そのリクエストは通常のHTTPセッションとして扱われるのでポータル・セッション内のオブジェクトにはアクセスできません。この問題に対処するためにポートレット・セッション・アトリビュートへアクセスするための手段(リンク)を用意しました。ポートレット・セッション・アトリビュートはウィンドウIDを用いてスコープ管理します。例えば、ポートレットが'YourObject'という値をポートレット・セッションに保存する場合、その属性はXYZをウィンドウIDとすると'javax.portlet.p.XYZ?YourObject'として保存されます。

UIからウィンドウIDやスコープIDへは下記の表記でアクセスします。

#{facesContext.externalContext.sessionMap['org.jboss.portletbridge.WINDOW_ID_RETRIVER'].windowID}
#{facesContext.externalContext.sessionMap['org.jboss.portletbridge.WINDOW_ID_RETRIVER'].scopeId}

見ての通り、facesContext.externalContext.sessionMap はポートレット・スコープのセッション・オブジェクトを指します。どうしてこれらの値を使う必要があるのでしょうか?以下にいくつかの例を挙げます。

  • AJAXリクエストの最中にポータル・セッションに保存された認証データが必要になった場合
  • リソース(画像、スクリプト、など…)のダイナミックな生成

その他の見本

RichFacesライブラリ全体は実際に動かすことのできるデモから入手できます。またソース・コードはこちら(リンク)からダウンロードできます。自分のコンポーネントの設定に確信が持てない場合、ポータル環境で動くかどうか分からない場合にはこのプロジェクトがとても役に立つでしょう。唯一ファイル・アップロードのコンポーネントだけは手に入りません。これについては9月の早いうちにリリースされる次のポートレット・ブリッジに含まれる予定です。

いつもながら、フォーラム(リンク)でのフィードバックはとても助かりますし、大歓迎です。JBoss Portlet Bridgeプロジェクトの詳細についてはプロジェクト・ページ(リンク)、ドキュメント(リンク)、wiki(リンク)を訪れてみて下さい。

 

原文はこちらです:http://www.infoq.com/articles/jsf-ajax-seam-portlets-pt-2
(このArticleは2008年8月19日に原文が掲載されました)

この記事に星をつける

おすすめ度
スタイル

こんにちは

コメントするには InfoQアカウントの登録 または が必要です。InfoQ に登録するとさまざまなことができます。

アカウント登録をしてInfoQをお楽しみください。

あなたの意見をお聞かせください。

HTML: a,b,br,blockquote,i,li,pre,u,ul,p

このスレッドのメッセージについてEmailでリプライする
コミュニティコメント

HTML: a,b,br,blockquote,i,li,pre,u,ul,p

このスレッドのメッセージについてEmailでリプライする

HTML: a,b,br,blockquote,i,li,pre,u,ul,p

このスレッドのメッセージについてEmailでリプライする

ディスカッション

InfoQにログインし新機能を利用する


パスワードを忘れた方はこちらへ

Follow

お気に入りのトピックや著者をフォローする

業界やサイト内で一番重要な見出しを閲覧する

Like

より多いシグナル、より少ないノイズ

お気に入りのトピックと著者を選択して自分のフィードを作る

Notifications

最新情報をすぐ手に入れるようにしよう

通知設定をして、お気に入りコンテンツを見逃さないようにしよう!

BT