Mashups4JSF を使用してマッシュアップ・フィードを作成し、利用する

アプリケーションのデータをフィードとして容易にエクスポートする

マッシュアップ・アプリケーションの最も一般的な使い方の 1 つは、アプリケーションの内部データを (RSS または Atom の) フィードとしてエクスポートするというものです。Mashups4JSF が登場するまで、開発者はアプリケーションの DTO (Data Transfer Object) から手動でフィードを作成する必要がありました。しかし今では Mashups4JSF が登場したおかげで、従来よりもはるかに容易にアプリケーションのデータをフィードとしてエクスポートできるようになっています。

Hazem Saleh, Staff Software Engineer, IBM  

Photo of Hazem SalehHazem Saleh は JEE とオープンソース技術に 6 年の経験があります。彼は Apache MyFaces のコミッターであり、また MyFaces プロジェクトの多くのコンポーネントに関する作業を開始してきました (Tomahawk CAPTCHA、Commons ExportActionListener、Media、PasswordStrength など)。彼は GMaps4JSF (Google マップと JavaServer Faces とを統合するプロジェクト) と Mashups4JSF (マッシュアップ・サービスと JavaServer Faces とを統合するプロジェクト) の創始者です。彼は『The Definitive Guide to Apache MyFaces and Facelets』(Apress 刊) の著者であり、JSF に関する多くの記事を執筆しており、developerworks への寄稿者であり、JSF の正式講演者でもあります。現在はスタッフ・ソフトウェア・エンジニアとして IBM エジプトに勤務しており、そこでは Web 2.0 技術のエキスパートとして認められています。



2011年 9月 02日

Mashups4JSF に関する以前の記事 (「参考文献」を参照) では、Mashups4JSF とは何か、Mashups4JSF の構成方法、そして Mashups4JSF を使用して実用的なマッシュアップ・アプリケーションを作成する方法を学びました。また、Apache MyFaces 2.0 と WebSphere Application Server V7.0 の IBM JWL (JavaServer Faces Widget Library) の両方で Mashups4JSF のライブラリーを使用する方法について学びました。

マッシュアップ・アプリケーションの最も一般的な使い方の 1 つは、アプリケーションの内部データを (RSS または Atom の) フィードとしてエクスポートするというものです。Mashups4JSF が登場するまで、開発者はアプリケーションの DTO (Data Transfer Object) から手動でフィードを作成する必要がありました。しかし今では Mashups4JSF が登場したおかげで、従来よりもはるかに容易にアプリケーションのデータをフィードとしてエクスポートできるようになっています。

この記事では、Mashups4JSF のフィード作成サービスを利用して Web アプリケーションのデータを RSS フィードとしてエクスポートする方法と、フィード・リーダー・コンポーネントを使用して RSS フィードを利用する方法を説明します。

ニュース・アプリケーションを扱う

このニュース・アプリケーションは JSF (JavaServer Faces) 2.0 アプリケーションであり、一連のニュース・サンプルを図 1 のようなデータ・テーブルに表示します。この一連のニュース・サンプルを RSS フィードとしてエクスポートしましょう。

図 1. ニュースのサンプル
リンク付きのタイトル、作成者、カテゴリー、説明からなる縦欄式リストのニュース・アプリケーションのスクリーン・ショットが示されています。

このニュース・ページのコードは非常に単純です。リスト 1 は news.xhtml ページにあるニュースのデータ・テーブル (dataTable) の XHTML コードを示しています。

リスト 1. news.xhtml ページにあるニュースの dataTable
<h:dataTable id="newsTable" value="#{newsList.news}" var="varnews"
	styleClass="standardTable" headerClass="standardTable_Header"
	footerClass="standardTable_Footer" 
	rowClasses="standardTable_Row1, standardTable_Row2"
	columnClasses="standardTable_Column">
				
	<h:column id="titleColumn">
		<f:facet name="header">
			<h:outputText value="#{messages.application_label_title}" 
				id="titleText">
			</h:outputText>
		</f:facet>
		<h:outputLink value="#{varnews.link}">
			<h:outputText id="title" value="#{varnews.title}">
			</h:outputText>
		</h:outputLink>
	</h:column>
			
	<h:column id="authorColumn">
		<f:facet name="header">
			<h:outputText value="#{messages.application_label_author}" 
				id="authorText">
			</h:outputText>
		</f:facet>
		<h:outputText id="author" value="#{varnews.author}">
		</h:outputText>
	</h:column>
			
	<h:column id="categoryColumn">
		<f:facet name="header">
			<h:outputText value="#{messages.application_label_category}"	
				id="categoryText">
			</h:outputText>
		</f:facet>
		<h:outputText id="category" value="#{varnews.category}">
		</h:outputText>
	</h:column>
			
	<h:column id="descColumn">
		<f:facet name="header">
			<h:outputText value="#{messages.application_label_description}" 
				id="descText">
			</h:outputText>
		</f:facet>
		<h:outputText id="desc" value="#{varnews.desc}">
		</h:outputText>
	</h:column>
</h:dataTable>

newsTable#{newsList.news} という式によって NewsList DTO にバインドされています。リスト 2 は NewsList DTO のコードを示しています。NewsList DTO にはニュース・オブジェクトの静的リストが含まれています。NewsList DTO はデータベースの実際のデータを保持することができますが、ここでは単純にするために静的リストを使用しています。

リスト 2. NewsList DTO
@ManagedBean
public class NewsList {
    static List <News> news = new ArrayList<News>();

    // Sample news list
    static {
	for (int i = 0; i < 10; ++i) {
      news.add(new News(
		         "Title" + i, 
		         "Description" + i, 
		         "http://www.google.com/search?q=" + i, 
		         "Category" + i, 
		         "Author" + i));
	}
     }

     public List<News> getNews() {
             return news;
     }
}

News クラスは非常に単純な Bean です。News クラスには以下の属性のみが含まれています。

  1. タイトル (title)
  2. 説明 (desc)
  3. リンク (link)
  4. カテゴリー (category)
  5. 作成者 (author)

リスト 3 を見てください。

リスト 3. News DTO
public class News {
    private String title;
    private String desc;
    private String link;
    private String category;
    private String author;
    
    ...
    public String getTitle() {
		return title;
    }
    public void setTitle(String title) {
		this.title = title;
    }
	
    public String getDesc() {
		return desc;
    }
    public void setDesc(String desc) {
		this.desc = desc;
    }
	
    public String getLink() {
		return link;
    }
    public void setLink(String link) {
		this.link = link;
    }
	
    public String getCategory() {
		return category;
    }
    public void setCategory(String category) {
		this.category = category;
    }
	
    public String getAuthor() {
		return author;
    }
	
    public void setAuthor(String author) {
		this.author = author;
    }
}

今度は、NewsList データを RSS フィードとしてエクスポートする方法を調べてみましょう。


アプリケーションのデータを RSS フィードとしてエクスポートする

ニュース・リストを RSS フィードとしてエクスポートする方法の詳細に入る前に、Mashups4JSF に関する以前の記事 (「参考文献」を参照) で説明した、JSF 2.0 アプリケーションでの Mashups4JSF ライブラリーの構成方法を思い出す必要があるかもしれません。Mashups4JSF のフィード・サーブレットを使用する場合には必ず、最新の安定した Mashups4JSF 0.0.3 のスナップショットをダウンロードする必要があります (「参考文献」を参照)。

Mashups4JSF を使用して NewsList データを RSS フィードとしてエクスポートするために、JSF アプリケーションで以下のステップを実行します。

Mashups4JSF のフィード・サーブレットを登録する

Mashups4JSF の MashupFeedServletリスト 4 のようにしてアプリケーションの web.xml に登録します。

リスト 4. Mashups4JSF のフィード・サーブレットを登録する
<servlet>
	<servlet-name>mashupFeedServlet</servlet-name>
	<servlet-class>com.googlecode.mashups.servlets.MashupFeedServlet</servlet-class> 
</servlet>

<servlet-mapping>
	<servlet-name>mashupFeedServlet</servlet-name>
	<url-pattern>/mashupFeedServlet</url-pattern>
</servlet-mapping>

フィード・クラスにアノテーションを付ける

フィード・クラス (NewsList クラス) に @Feed アノテーションを付け、また @FeedTitle@FeedDescription@FeedLink@FeedItems アノテーションを使用してフィードのタイトル、説明、リンク、項目を指定します。リスト 5 はアノテーションを適用した後の NewsList クラスを示しています。

リスト 5. アノテーションを適用した後の NewsList クラス
@ManagedBean
@Feed
public class NewsList {
     static List <News> news = new ArrayList<News>();
     
    // Sample news list
    static {
		for (int i = 0; i < 10; ++i) {
				news.add(new News(
				"Title" + i, 
				"Description" + i, 
				"http://www.google.com/search?q=" + i, 
				"Category" + i, 
				"Author" + i));
		}
    }

@FeedItems
    public List<News> getNews() {
		return news;
    }
    
@FeedTitle
    public String getTitle() {
		return TITLE;
    }

@FeedDescription
    public String getDescription() {
		return DESCRIPTION;
    }

@FeedLink
    public String getLink() {
		return LINK;
    }

    private final String TITLE = "News List";
    private final String DESCRIPTION = "News List Description";
    private final String LINK = "http://somenewschannel.com";        
}

フィード項目クラス (News クラス) に @ItemFeed アノテーションを付け、また @ItemTitle@ItemDescription@ItemLink@ItemCategory@ItemAuthor アノテーションを使用してフィード項目のタイトル、説明、リンク、カテゴリー、作成者を指定します。リスト 6 はアノテーションを適用した後の News クラスを示しています。

リスト 6. アノテーションを適用した後の News クラス
@FeedItem
public class News {
    private String title;
    private String desc;
    private String link;
    private String category;
    private String author;
    
    ...
    
@ItemTitle
    public String getTitle() {
        return title;
    }
    public void setTitle(String title) {
        this.title = title;
    }
    
@ItemDescription
    public String getDesc() {
        return desc;
    }
    public void setDesc(String desc) {
        this.desc = desc;
    }
    
@ItemLink
    public String getLink() {
        return link;
    }
    public void setLink(String link) {
        this.link = link;
    }
    
@ItemCategory
    public String getCategory() {
        return category;
    }
    public void setCategory(String category) {
        this.category = category;
    }
    
@ItemAuthor
    public String getAuthor() {
        return author;
    }
    public void setAuthor(String author) {
        this.author = author;
    }
}

フィードを表示する

フィード・クラスとフィード項目クラスの両方にアノテーションを付け終わると、作業はほとんど終了です。あとは、リスト 7 のようにフィード・クラスをパラメーターとしてフィード・サーブレットに渡し、出力として rss を指定することで、フィードを表示するだけです。

リスト 7. フィード・クラスをパラメーターとしてフィード・サーブレットに渡し、RSS フィードを表示する
#{request.contextPath}/mashupFeedServlet?feedClass=dto.NewsList&output=rss

図 2 は RSS フィードとしてエクスポートされた後の NewsList フィードを示しています。

図 2. NewsList RSS フィード
ニュースの RSS フィードをブラウザーに表示した場合のスクリーン・ショット

NewsList を Atom フィードとしてエクスポートしたい場合には、フィード・サーブレットの出力として atom を指定します。


フィード・リーダーを使用して RSS フィードを利用する

RSS フィードと Atom フィードをエクスポートできる以外に、Mashups4JSF により、JSF アプリケーションの中で任意の RSS フィード、Atom フィードまたは JSON フィードを利用できるようになります。では、rssFeedReader コンポーネントを使用して、たった今 NewsList データに対して作成した RSS フィードを利用する方法を調べてみましょう。

リスト 8 は consumer.xhtml ページの rssFeedReader コンポーネントを使用して RSS フィードを利用する方法を示しています。

リスト 8. consumer.xhtml ページの rssFeedReader コンポーネント
<mashup:rssFeedReader    
	feedURL="http://#{facesContext.externalContext.request.remoteHost}:
		#{facesContext.externalContext.request.localPort}      
		#{facesContext.externalContext.request.contextPath}
		/mashupFeedServlet?feedClass=dto.NewsList&output=rss"

	maximumCount="5"
	channelVar="channel"
	itemVar="item"
	itemIndex="itemIndex">
	
	<f:facet name="channel">
		<h4>#{messages.application_channel_desc}#{channel.description}</h4>
	</f:facet>

	<f:facet name="item">
		<b>#{messages.application_item_index} </b>#{itemIndex}<br />
		<b>#{messages.application_item_title} </b>#{item.title}<br />
		<b>#{messages.application_item_link} </b>
				
		<h:outputLink value="#{item.link}">
			#{item.link}
		</h:outputLink><br />
			 
		<b>#{messages.application_item_author} </b>#{item.author}<br />
				
		<b>#{messages.application_item_category} </b>
		#{item.categories[0].name}<br /><br />
	</f:facet>                
</mashup:rssFeedReader>

リスト 8 を見るとわかるように、ここでは以下の内容を指定しました。

  • RSS フィードの URL
  • RSS のチャネル情報 (description など) にアクセスするために使用する channel 変数
  • すべての RSS フィード項目 (titlelinkauthor など) にアクセスする item 変数
  • 項目のインデックス (itemIndex)

チャネル・ファセットでは、その RSS チャネルに対してどの属性を表示したいかを指定することができ、またアイテム・ファセットでは、すべてのフィード項目に対してどの属性を表示したいかを指定することができます。

図 3NewsList RSS フィードに対する rssFeedReader の出力を示しています。

図 3. NewsList RSS フィードに対する rssFeedReader の出力
RSS フィード出力のスクリーン・ショットとして、各エントリーの項目インデックス、タイトル、項目のリンク、作成者、カテゴリーが表示されています。

まとめ

さまざまなマッシュアップ・コンポーネントおよびマッシュアップ・サービスに加え、Mashups4JSF では JSF アプリケーション用にマッシュアップ・フィードをエクスポート/インポートする方法が抽象化されています。Mashups4JSF が登場するまで、開発者はアプリケーションの DTO (Data Transfer Object) から手動でフィードを作成する必要がありました。しかし Mashups4JSF が登場したおかげで、従来よりも容易にアプリケーションのデータをフィードとしてエクスポートできるようになっています。この記事では、Mashups4JSF のフィード・サーブレットを使用して JSF アプリケーションのデータを RSS フィードとして表現する方法を学びました。また、生成されたフィードを rssFeedReader コンポーネントを使用して利用する方法も学びました。

参考文献

学ぶために

製品や技術を入手するために

議論するために

  • developerWorks コミュニティー: 開発者向けのブログ、フォーラム、グループ、ウィキなどを利用しながら、他の developerWorks ユーザーとやり取りしてください。developerWorks コミュニティーの Real world open source グループを構築する作業を支援してください。

コメント

developerWorks: サイン・イン

必須フィールドは(*)で示されます。


IBM ID が必要ですか?
IBM IDをお忘れですか?


パスワードをお忘れですか?
パスワードの変更

「送信する」をクリックすることにより、お客様は developerWorks のご使用条件に同意したことになります。 ご使用条件を読む

 


お客様が developerWorks に初めてサインインすると、お客様のプロフィールが作成されます。会社名を非表示とする選択を行わない限り、プロフィール内の情報(名前、国/地域や会社名)は公開され、投稿するコンテンツと一緒に表示されますが、いつでもこれらの情報を更新できます。

送信されたすべての情報は安全です。

ディスプレイ・ネームを選択してください



developerWorks に初めてサインインするとプロフィールが作成されますので、その際にディスプレイ・ネームを選択する必要があります。ディスプレイ・ネームは、お客様が developerWorks に投稿するコンテンツと一緒に表示されます。

ディスプレイ・ネームは、3文字から31文字の範囲で指定し、かつ developerWorks コミュニティーでユニークである必要があります。また、プライバシー上の理由でお客様の電子メール・アドレスは使用しないでください。

必須フィールドは(*)で示されます。

3文字から31文字の範囲で指定し

「送信する」をクリックすることにより、お客様は developerWorks のご使用条件に同意したことになります。 ご使用条件を読む

 


送信されたすべての情報は安全です。


static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=60
Zone=Open source, Java technology
ArticleID=754253
ArticleTitle=Mashups4JSF を使用してマッシュアップ・フィードを作成し、利用する
publish-date=09022011