Web 2.0 機能 IBM WebSphere Portal 6.1 ワークショップ 日本アイ・ビー・エム株式会社 ロータス・テクニカル・セールス

®
IBM WebSphere Portal 6.1 ワークショップ
Web 2.0 機能
日本アイ・ビー・エム株式会社
ロータス・テクニカル・セールス
2008年9月
© 2008 IBM Corporation
IBM Software Group | Lotus software
Web 2.0
ƒ はじめに
ƒ パフォーマンス・操作性向上
ƒ サーバーのRESTサービス化
ƒ Live Text
ƒ その他AJAX化のための機能
– クライアント・サイド・ポートレット・プログラミング・モデル
– AJAX Proxy
– バンドルDojoライブラリ
ƒ Google Gadget Portlet
ƒ まとめ
ƒ 補足：Web 2.0関連の主なRESTサービス
ƒ 参考情報
2
IBM Software Group | Lotus software
© IBM Corporation 2008. All Rights Reserved.
ワークショップ、セッション、および資料は、IBMまたはセッション発表者によって準備され、それぞれ独自の見解を反映したものです。それらは情報提供の目的の
みで提供されており、いかなる参加者に対しても法律的またはその他の指導や助言を意図したものではなく、またそのような結果を生むものでもありません。本プ
レゼンテーションに含まれている情報については、完全性と正確性を帰するよう努力しましたが、「現状のまま」提供され、明示または暗示にかかわらずいかなる保
証も伴わないものとします。本プレゼンテーションまたはその他の資料の使用によって、あるいはその他の関連によって、いかなる損害が生じた場合も、IBMは責
任を負わないものとします。 本プレゼンテーションに含まれている内容は、IBMまたはそのサプライヤーやライセンス交付者からいかなる保証または表明を引きだ
すことを意図したものでも、IBMソフトウェアの使用を規定する適用ライセンス契約の条項を変更することを意図したものでもなく、またそのような結果を生むもので
もありません。
本プレゼンテーションでIBM製品、プログラム、またはサービスに言及していても、IBMが営業活動を行っているすべての国でそれらが使用可能であることを暗示す
るものではありません。本プレゼンテーションで言及している製品リリース日付や製品機能は、市場機会またはその他の要因に基づいてIBM独自の決定権をもっ
ていつでも変更できるものとし、いかなる方法においても将来の製品または機能が使用可能になると確約することを意図したものではありません。本資料に含まれ
ている内容は、参加者が開始する活動によって特定の販売、売上高の向上、またはその他の結果が生じると述べる、または暗示することを意図したものでも、また
そのような結果を生むものでもありません。
パフォーマンスは、管理された環境において標準的なIBMベンチマークを使用した測定と予測に基づいています。ユーザーが経験する実際のスループットやパ
フォーマンスは、ユーザーのジョブ・ストリームにおけるマルチプログラミングの量、入出力構成、ストレージ構成、および処理されるワークロードなどの考慮事項を
含む、数多くの要因に応じて変化します。したがって、個々のユーザーがここで述べられているものと同様の結果を得られると確約するものではありません。
記述されているすべてのお客様事例は、それらのお客様がどのようにIBM製品を使用したか、またそれらのお客様が達成した結果の実例として示されたものです。
実際の環境コストおよびパフォーマンス特性は、お客様ごとに異なる場合があります。
以下は、International Business Machines Corporationの米国およびその他の国における商標。IBMの全商標のリストについては、
www.ibm.com/legal/copytrade.shtmlをご覧ください。
IBM, IBMロゴ, AIX, DB2, DB2 Universal Database, CICS, i5/OS, IMS, iSeries, Lotus, Lotus Domino, Lotus Notes, LotusScript, Lotusphere, OS/390,
pureXML, Quickr, Rational, Sametime, System i, System i5, System z , Tivoli, UC2, WebSphere, z/OS.
JavaおよびすべてのJava関連の商標およびロゴは Sun Microsystems, Inc.の米国およびその他の国における商標。
Microsoft, Windows, Windows NT および Windowsロゴは Microsoft Corporationの米国およびその他の国における商標。
Intel, Intelロゴ, Intel Inside, Intel Insideロゴ, Intel Centrino, Intel Centrinoロゴ, Celeron, Intel Xeon, Intel SpeedStep, Itanium, Pentium は Intel Corporation
または子会社の米国およびその他の国における商標または登録商標。
UNIXはThe Open Groupの米国およびその他の国における登録商標。
Linuxは、Linus Torvaldsの米国およびその他の国における商標。
その他の会社名、製品名およびサービス名等はそれぞれ各社の商標。
3
3
IBM Software Group | Lotus software
略称について
本資料では以下の製品名称、もしくは機能に対して略称を用いています。
製品名称
略称
製品名称
略称
Asynchronous JavaScript + XML
AJAX
IBM WebSphere Portal
WP
Click to Action
C2A
IBM WebSphere Portlet Factory
WPF
Domino Portal Integration
DPI
Java Specification Request
JSR
IBM DB2 Universal Database
DB2
Lightweight Directory Access Protocol
LDAP
IBM HTTP Server
IHS
Lightweight Third Party Authentication
LTPA
IBM Lotus ActiveInsight
LAI
Lotus Domino Web Access
DWA
IBM Lotus Domino
Domino
Representational State Transfer
REST
IBM Lotus Connections
Connections
Rich Site Summary, Really Simple Syndication
RSS
IBM Lotus Notes
Notes
Simple and Protected GSS-API Negotiation
Mechanism
SPNEGO
IBM Lotus Quickr
Quickr
Single Sign-On
SSO
IBM Lotus Web Content Management
WCM
Trust Association Intercepter
TAI
IBM Rational Application Developer
RAD
User Registory
UR
IBM Tivoli Directory Server
ITDS
Virtual Member Manager
VMM
IBM WebSphere Application Server
WAS
Web Application Integrator
WAI
IBM WebSphere Application Server
Network Deployment
WAS ND
Web Services for Remote Portlets
WSRP
IBM WebSphere Dashboard Framework
WDF
WebSphere Member Manager
WMM
IBM WebSphere Extended Deployment
WAS XD
ユーザーインターフェース
UI
4
4
IBM Software Group | Lotus software
はじめに
ƒ WebSphere Portal V6.1では、より高度なAJAXの活用が進んでいます。
パフォーマンス
パフォーマンス
・操作性向上
・操作性向上
サーバーの
サーバーの
REST
RESTサービス化
サービス化
Live
LiveText
Text
その他
その他AJAX
AJAX化
化
のための機能
のための機能
Google
GoogleGadget
Gadget
Portlet
Portlet
Web 2.0ポータルテーマによる
クライアント・サイド・アグリゲーション(CSA)
REST APIの提供
Live Text機能
クライアント・サイド・ポートレット・プログラミング・モデル
AJAX Proxy
バンドルDojoライブラリ
Google Gadgetをポータルに統合するポートレット
(V6.0でも利用可能)
5
IBM Software Group | Lotus software
パフォーマンス・操作性向上 (1/5)
ƒ WebSphere Portal V6.1ではテーマおよびポートレット(一部は今後対応)が
AJAX化され、パフォーマンスや操作性が向上しています。
– CSA非互換のポートレットは各テーマの「/js/portletsForServerSideOnly.js」に記述
ƒ 新しい仕組みで動作するテーマ「PortalWeb2」が用意されています。
クライアント・サイド・
アグリゲーション
(CSA)を実現する、
新しいテーマ
注意点1：サポートするスキンはIBM/NoSkin
注意点2: ページ上のポートレットがすべてCSA対応であること
(そうでない場合はサーバー・サイド・アグリゲーション(SSA)に)
6
IBM Software Group | Lotus software
パフォーマンス・操作性向上 (2/5)
ƒ 「PortalWeb2」テーマでは、クライアント側のJavaScriptが個々の要素
を非同期で引っ張り、画面を組み立てます。
非同期
7
IBM Software Group | Lotus software
パフォーマンス・操作性向上 (3/5)
ƒ 「PortalWeb2」テーマ＝
クライアント・サイド・アグリゲーション
サーバーのRESTサービスにアクセス
REST-accessible
Markup Fragments
Portlets or other
Atom / RSS Feeds
サーバーから取得したXMLをクライアント側
でレンダリング
AJAX、XML、Dojo、JavaScriptで実装
ƒ ユーザー操作性の向上
操作に対する応答性が高い
サーバー処理無しで多くの処理が行える
Gadgets
ページのちらつきが抑えられる
ƒ パフォーマンスとスケーラビリティの向上
WSRPサービス
ネットワーク帯域の削減
クライアント処理の削減(部品化によリロー
ド処理削減)
個々の部品ごとに独立してキャッシュ可能、
キャッシュ性の向上
8
IBM Software Group | Lotus software
パフォーマンス・操作性向上 (4/5)
Portal Server
従来のテーマ
Browser
Portal WAR
Request
サーバー側で画面を
組み立ててから送信
Response
Servlet
Click
WAR
Portlet
WAR
WAR
Portlet
WAR
WAR
Portlet
WAR
WAR
Portlet
Portal Server
Click
Portal WAR
Client-side aggregation
XHR
XHR
Servlet
クライアントで順次非同期
に画面を組み立て
ポートレット個別のリロード
Browser
JS Handler
V6.1のPortalWeb2
テーマ
WAR
Portlet
WAR
WAR
Portlet
WAR
WAR
Portlet
WAR
WAR
Portlet
9
IBM Software Group | Lotus software
パフォーマンス・操作性向上 (5/5)
ƒ 「PortalWeb2」テーマを有効にすると、ポートレットごとのリフレッシュが
可能なポートレットメニューとなります。
従来のメニュー
PortalWeb2のメニュー
ポートレットごとの
リフレッシュ
アクションは、編集
や削除メニューを
出す
10
IBM Software Group | Lotus software
サーバーのRESTサービス化
ƒ WebSphere Portal V6.1の様々な機能はRESTサービスAPIで提供されます。
ƒ 「PortalWeb2」テーマは、このRESTサービスを使います。
お客様独自/
他社ベンダー
アプリケーション
Client Side Aggregation（CSA)
Enabled Theme
Navigation
REST Service (Atom)
Page
REST Service
Portlet Access
REST Service
Portlet Settings
REST Service
CSA（Client Side Aggregation)
and
SSA (Server Side Aggregation)
テーマ
ポータル
ナビゲーションツ
リー
ページ
ポートレット
ポートレット設定
User Profiles
REST /Web Service
ユーザー
プロファイル
Content
REST Services
コンテンツ、
ドキュメント
Portal
REST Services
コンポジット
11
IBM Software Group | Lotus software
Live Text (1/7)
ƒ 一般用語「セマンティック・タグ」
– html上の文字列に意味を持たせるようマークアップ(class付きタグで
囲む、その他属性を追加等)し、別の機能を呼び出せるようにすること
– ex) 専門用語→検索、人名→プロフィール情報、住所→地図表示
ƒ Live Textは、セマンティックタグのLotus製品での実装
12
IBM Software Group | Lotus software
Live Text (2/7)
ƒ タグ標準化の動向
– microformats.orgで標準化
• 例： <span class="adr">東京都中央区日本橋箱崎町</span>
– XHTML上のタギング標準として定義
• 意味のみを表し、表示のための指定はCSSで分離
ƒ 「意味」が定義されているため、各種検索サイトが対応
– Google等はVoteLinks(このリンクを良い意味で
参照している、していない、どちらでもない)に対応
13
IBM Software Group | Lotus software
Live Text (3/7)
ƒ microformats.orgでは、次のようなタグが定義されています。
タグ
目的
hCard
vCardベースのビジネスカード情報を表現
XFN(XHTML FRIENDS NETWORK)
リンク先は友達かどうか、面識があるか等の表現
hCalendar
vCanendarベースのカレンダー情報の表現
VoteLinks
リンク先は良い意味/悪い意味/どちらでも無いで
張っているかの表現
hReview
レビュー(評価)情報であることの表現
hLicense
ライセンス情報であることの表現
rel-tag
コンテンツに対するタグ(キーワード)付け
XOXO (Extensible Open XHTML
Outlines)
XHTMLでの中身のアウトライン（ol、li等文書構造を
表すタグのXHTML上での定義)
14
IBM Software Group | Lotus software
Live Text (4/7)
ƒ WebSphere Portalでの実装
– html/JavaScriptでポートレットに実装可能(ポートレット上、WCM等
のhtmlが記述可能な箇所、テーマ等の上に実装可能)
– Click To Action(C2A)の一方式として実装
• 文字列をクリックするとポップアップメニューを出す側が、「Source」
• 「Source」からデータを受け取り、別アプリケーションにジャンプしたり
別ウィンドウを表示する方が、「Target」
– 「Source」、「Target」それぞれのための
JavaScriptを記述することにより、他の
アプリケーションにデータを引き渡す
マッシュアップアプリケーションが開発
可能
15
IBM Software Group | Lotus software
Live Text (5/7)
ƒ 実装例１「Source」
大枠をこのクラス
指定でくくる
<div class="c2a:source">
<span class="c2a:typename" style="display:none">
http://test.test.test/xmlns/prod/datatype#email822
</span>
「Target」との関連を識
別可能な名前空間を表
現する文字列を、このク
ラス指定のタグでくくる
<b class="c2a:value">[email protected]</b>
「Target」に引き渡す
データをこのクラス指定
のタグでくくる
<img class="photo" src="https://test3.test.test/weblogs/rollerui/[email protected]" /><!-- C2Aと無関係に画像を表示 -->
</div>
16
IBM Software Group | Lotus software
Live Text (6/7)
ƒ 実装例1「Target」
大枠をこのクラス指定
でくくる(FORMタグ)
– メールアドレスを受けてBluePageを開く
「Source」から呼
び出された際の処
理を呼び出す
「Source」との関連を識
別可能な名前空間を表
現する文字列を、このク
ラス指定のタグでくくる
<form class="c2a:target" obsubmit="doSomething(this);return false;"
action="javascript:doSomething(this)" style="display:none">
<span class="c2a:typename" style="display:none">
http://test.test.test/xmlns/prod/datatype#email822
「Source」側データをクリックした際
</span>
に選択可能なメニュー名をくくる
<p class="c2a:action-label">BluePageを表示</p>
<input type="text" class="c2a:action-param" name="someInputName">
</form>
「Source」側データがセットされる
フィールド(INPUTタグである必要が
<script>
ある)を指定する
function doSomething(obj) {
w=
window.open("http://test3.test.test/jct03019wt/bluepages/simpleSearch.wss?searchBy=I
nternet+address&location=All+locations&searchFor="
+ window.test.portal.c2a.event.value, "BluePagest", "width=600,height=600");
}
</script>
action-paramではなくこの変数でも
別アプリケーションの呼び出し、マッ
シュアップ等をJavaScriptで記述
連携データ参照可能
17
IBM Software Group | Lotus software
Live Text (7/7)
ƒ WebSphere Portal V6.1が自動的にTarget(アクション)を生成するmicroformat
＝hCard (vCardのXHTML版)
ƒ 実装例2(「Source」のみ実装＋サーバーの構成)
– hCardのルールに則りvcard、n、emailのclass指定をネストしたDIV/SPANタ
グに記述するか、複数classを同時指定
<a class="vcard n email" href="mailto:[email protected]">[email protected]</a>
<img class="photo" src="https://test3.test.test/weblogs/roller-ui/photo?email=
[email protected]" /> <!-- C2Aと無関係に画像を表示 -->
18
IBM Software Group | Lotus software
その他AJAX化のための機能 (1/4)
ƒ クライアント・サイド・ポートレット・プログラミング・モデル
– AJAXでポートレットAPIにアクセスするためのライブラリ
– タグライブラリを参照し、JavaScriptのコーディングで実現
– クライアント側でポートレットのモード、ウィンドウステート、プリファレン
ス、プロファイルにアクセス可能
– クライアント側でのプロファイル変更等は非同期でサーバー側に保存
<script>
function <%=namespace%>_handleLoadPortletPreferences(portletWindow, status, portletPrefs) {
if (status==ibm.portal.portlet.PortletWindow.STATUS_OK) {
portletWindow.setAttribute("preferences", portletPrefs);
alert("Preferences.getValue()¥n"+portletPrefs.getValue("test"));
var prefs = portletPrefs.getMap();
var mapStr = "Preferences.getMap()¥number of preferences: "+prefs.length + "¥n";
for (var i=0; i<prefs.length; i++) {
mapStr += i+" - "+prefs[i].name+" - "+prefs[i].values+" - "+prefs[i].readonly + "¥n";
}
alert(mapStr);
}
else { alert("error loading feed"); }
}
<%=namespace%>_portletWindow = new ibm.portal.portlet.PortletWindow("<%=portletWindowID%>");
<%=namespace%>_portletWindow.getPortletPreferences(<%=namespace%>_handleLoadPortletPreferences);
</script>
19
IBM Software Group | Lotus software
その他AJAX化のための機能 (2/4)
ƒ AJAX Proxy
– クライアント側JavaScriptから別ドメイン上のサービスを呼び出す
ためのプロキシーモジュール
– そのままでは、クライアントから別ドメイン上のサービスを呼び出す
には制限が多い
• クロス・サイト・スクリプティング防止のためのブラウザの制限
• 回避するためには、コードの署名、JSONP、ポートレット内に個別の
Proxy機能等の用意が必要
– WebSphere Portal V6.1から専用のProxyモジュールが追加
20
IBM Software Group | Lotus software
その他AJAX化のための機能 (3/4)
ƒ AJAX Proxy (続き)
– AJAX Proxy Configuration.earに含まれるproxy-config.xmlで設定
– 各PortletのWEB-INF内にproxy-config.xmlを配置し、設定を優先
させることも可能
– アクション(GET/POST等)、コンテキストパス(URLのマッピング)、
タイムアウト、制限コネクション数等を設定可能
Domain A
Browser
HTTP GET
Domain A
HTML Page
AJAX
Portlet
HTTP GET
Domain B
AJAX
Proxy
Trusted
sites
Server
Domain B
Server
21
IBM Software Group | Lotus software
その他AJAX化のための機能 (4/4)
ƒ バンドルDojoライブラリ
– WebSphere Portal V6.1には、IBM Dojo Toolkit(Dojo Toolkitを
ベース)がバンドルされています。
• wp_profile_root/installedApps/node_name/wps.ear/wps.war/themes/dojo/
portal_dojo
– 「PortalWeb2」テーマではこのDojoライブラリの利用はサポートされて
いません。
– WebSphere Portlet FactoryのDojo機能は、独自にDojoライブラリを
インポートします。
22
IBM Software Group | Lotus software
Google Gadget Portlet
ƒ Google Gadgetをポートレットとして配置可能に
– IBM WebSphere Portal Business Solutionsからダウンロードして
インストール
http://www.ibm.com/software/brandcatalog/portal/portal/details?catalog.label=1WP1001AJ
– ダウンロードイメージ(zip)の中にV6.0版とV6.1版が同梱
ƒ ※Googleとの連携は、Portlet Factory/Live Textでも実現可能
注意点1：サポートする言語はENGLISHのみのためOWN RISK。文字化
けは事前確認必要
注意点2: Google Gadgetごとの品質の問題、途中で修正されることも
23
IBM Software Group | Lotus software
まとめ
ƒ WebSphere Portal V6.1ではWeb 2.0の実装技術によりパフォーマン
ス・操作性の高いユーザーインターフェース、カスタムポートレットを
提供することができます。
パフォーマンス
パフォーマンス
・操作性向上
・操作性向上
サーバーの
サーバーの
REST
RESTサービス化
サービス化
Live
LiveText
Text
その他
その他AJAX
AJAX化
化
のための機能
のための機能
Google
GoogleGadget
Gadget
Portlet
Portlet
Web 2.0ポータルテーマによる
クライアント・サイド・アグリゲーション(CSA)
REST APIの提供
Live Text機能
クライアント・サイド・ポートレット・プログラミング・モデル
AJAX Proxy
バンドルDojoライブラリ
Google Gadgetをポータルに統合するポートレット
(V6.0でも利用可能)
24
IBM Software Group | Lotus software
補足：Web 2.0関連の主なRESTサービス
ƒ Remote PUMA SPI REST Service
– ユーザープロファイルを提供するRESTサービス
ƒ Remote Model SPI REST service
– ナビゲーションやレイアウト情報を取得・更新可能とするRESTサービス
– Content Model
•
ページやラベル
– Navigation Model
•
Content Modelの構造
– LayoutModel
•
ページレイアウト情報
– PortletModel
•
ポートレット情報
– UserModel
•
ユーザー・グループ情報
25
IBM Software Group | Lotus software
参考情報
ƒ Web 2.0 user interface features
– http://publib.boulder.ibm.com/infocenter/wpdoc/v6r1m0/topic/co
m.ibm.wp.ent.doc/dev/w2_ovu_.html (InfoCenter)
ƒ Dojo
– http://dojotoolkit.org/
ƒ microformats.org
– http://microformats.org/
ƒ John Allsopp著, "マイクロフォーマット," (株)毎日コミュニケーションズ,
浅野紀予訳, 2008年, ISBN978-8399-2544-4
26