クライアント側の開発者向けガイド

     前  次    目次     
ここから内容

ポートレットの公開

この章では、HTTP 経由でリモートでポートレットを表示できるようにするポートレットの公開という機能について説明します。

この章では、次のトピックについて説明します。

 


ポートレットの公開とは

ポートレットの公開とは、WebLogic Portal のポートレットを HTTP 経由で利用可能にする 1 つの機能です。WLP ポートレットの公開サービスを介してポートレットを公開すると、さまざまな異種のホスト環境に再使用することができます。たとえば、公開済みのポートレットを <iframe> タグで埋め込む JavaScript を使用してポートレットを非ポータル Web ページに含むことができます。

この節では、次のトピックについて説明します。

ポートレットの公開サービスとは

ポートレットは WLP ポートレットの公開サービスを介して公開されます。公開サービスは、WLP サーバで実行される REST スタイルのサービスです。図 5-1 に示すように、ポートレットの公開サービスは HTTP 上のリモート コンシューマに個々のポートレット インスタンスを供給します。リモート コンシューマは単に URL を使用することで、ポートレットの公開サービスにポートレットを要求します。そして、サービスによってコンシューマにポートレット マークアップが返されます。

図 5-1 ポートレットの公開サービス

ポートレットの公開サービス

ポートレットの公開サービスにポートレットを求める

ポートレットのライブラリ インスタンスやデスクトップ インスタンスを返すようにポートレットの公開サービスに求めることができます。お好みのポートレット インスタンスのタイプに応じて、サービスに送信する URL の構造が決定されます。

ポートレットのライブラリ インスタンスをカスタマイズ不可のインスタンスとして考えることができます。Administration Console を使用してポータル デスクトップのページにライブラリ ポートレットを追加すると、追加されたポートレットはデスクトップ インスタンスになります。これによって、各ユーザがポートレットの個人のカスタマイズ バージョンを取得できるようになります。ライブラリ ポートレットとデスクトップ ポートレットが WebLogic Portal Administration Console のポータル リソース ツリーに一覧表示されます。

ポートレットをカスタマイズすることをユーザに許可しない、またはポートレットはカスタマイズ不可に設計されている場合、ポートレットのライブラリ インスタンスを依頼します。たとえば、単純な住宅ローンの計算機のポートレットはカスタマイズする必要はありません。一方、ユーザにポートレットをカスタマイズできるようにする場合、デスクトップ インスタンスを使用します。株価情報ポートレットでは、ユーザが好みの株を表示して、その選択を保存するように許可されます。

先にも述べたように、公開サービスによって返されるポートレットのタイプによって、サービスに送信する URL が決定されます。ポートレットを公開する URL の 2 つのパターンについて、「ポートレットを公開する URL 形式」で説明されています。

公開済みポートレットの使用

先にも説明したように、WLP の公開サービスにポートレットのライブラリ インスタンスか、またはデスクトップ インスタンスを要求するかに応じて、適切な URL を構成する必要があります。公開サービスによって、要求するコンシューマにポートレット マークアップが返されます。コンシューマは、返されたポートレット マークアップを以下の 3 つの方法で表示できます。

公開済みポートレットの使用」を参照してください。

 


ポートレットを公開する URL 形式

この節では、ポートレットを公開する URL の2 つの形式について説明します。最初の形式によって、ポートレットのライブラリ インスタンスが取得されます。2 つ目の形式によって、デスクトップ インスタンスが取得されます。WLP Portlet 公開サービスによって、これらのコマンドが処理され、コンシューマに適切なポートレットが返されます。ポートレットのライブラリ インスタンスとデスクトップ インスタンスついては、「ポートレットの公開サービスにポートレットを求める」で詳しく説明します。

ライブラリ インスタンス用の URL 形式

ポートレットのライブラリ インスタンスを返す場合、この URL 形式を使用します。

http://<domain_name>/<webapp_name>/<path_to_portlet>/<portlet_name>.portlet

次に例を示します。

http://foo.com/myWebapp/myPortlet.portlet

Web アプリケーション名、ポートレットへのパスとポートレット名を含む URL の部分は公開コンテキストと言われます。公開コンテキストは一部の Disc JavaScript API 呼び出しにパラメータとして使用できます。詳細については、「DOM 統合」を参照してください。「ポートレットの公開コンテキストの参照」も参照してください。

ライブラリ インスタンスは、ポータルのデスクトップに直接に関連付けられないので、デスクトップ インスタンスに関連付けらる特定のルック アンド フィールと他の情報を含めません。ライブラリ インスタンスのルック アンド フィールはデフォルト WLP ルック アンド フィールで構成され、変更できません。

デスクトップ インスタンス用の URL 形式

デスクトップ インスタンス用の URL 形式はライブラリ インスタンス用に使用される形式より複雑です。デスクトップ インスタンス用の URL は、以下の必須部分とパラメータから構成されています。

以下にこのパラメータを全部含む、公開サービスからデスクトップ インスタンス ポートレットを取得するための URL の例を示します。

http://foo.com/myWebApp/bea/wlp/api/portlet/publish?
context=myWebApp/appmanager/myPortal/myDesktop&portlet=myPortletInstanceLabel

デスクトップ インスタンス用の URL 形式にもう 1 つのオプションのパラメータを使用できます。decoration パラメータについては、「高度なトピック」節で説明します。

 


公開済みポートレットの使用

この節では、公開済みポートレットの使用のためのインライン フレーム (<iframe> タグ) 統合と DOM 統合の 2 つのテクニックを説明します。この節では、次のトピックについて説明します。

インライン フレーム統合

HTML <iframe> タグは、別の HTML ドキュメントを含むインライン フレームを作成します。インライン フレームを使用して、HTML に WLP ポートレットを含めることができます。タグの src パラメータは、「ポートレットを公開する URL 形式」で説明するように、ライブラリ インスタンス形式かデスクトップ インスタンス形式のポートレットを公開する URL です。

図 5-2 に示すように、インライン フレームが親ドキュメント内で別の HTML ドキュメントとして表示されます。親ページとインライン フレーム ページ間の疎結合によってインライン フレームがより安全になります。ポートレットが他のページと安全に対話できないと考えられる場合、インライン フレームの使用をお勧めします。インライン フレーム ポートレットとページの残りの部分の間に限定的な対話のみ可能です。「DOM 統合」で説明した DOM 統合テクニックを使用して組み込まれたポートレットは正しく機能しない。このような場合、インライン フレーム統合は最良の選択肢です。

図 5-2 インラインフレームは、ポートレットと残りのページの間で分離を提供します

インラインフレームは、ポートレットと残りのページの間で分離を提供します

サンプル コード

コード リスト 5-1 は、ライブラリ インスタンス ポートレットを含むインライン フレーム タグを示します。コード リスト 5-2 は、ポートレットのデスクトップ インスタンスを組み込む例を示します。<iframe> src パラメータの値は、ライブラリ インスタンスとデスクトップ インスタンスそれぞれに適するポートレットを公開する URL 形式です。「ポートレットを公開する URL 形式」も参照してください。

コード リスト 5-1 ライブラリ インスタンス ポートレットを組み込む単純なインライン フレーム
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <body>
    <iframe src ="http://foo.com/myWebapp/myPortlet.portlet"> </iframe>
  </body>
</html>
コード リスト 5-2 デスクトップ インスタンス ポートレットを組み込む単純なインライン フレーム
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <body>
    <iframe src ="http://foo.com/myWebApp/bea/wlp/api/portlet/publish/?
       context=myWebApp/appmanager/myPortal/myDesktop&
       portlet=myPortletInstanceLabel"> </iframe>
  </body>
</html>

以下の節で説明するように、インライン フレームを使用して、静的あるいは動的ポートレットを組み込むことができます。

静的ポートレットの組み込み

インライン フレームでは、従来のポートレットを新しく開発された静的アプリケーションに統合するための比較的易しく安全な方法が提供されます。インライン フレームは、基本 HTML を使用し、JavaScript を広範囲に使用しない、ナビゲーション コマンドをサーバに返し、Struts やページ フロー アクションに保存されるロジックがあるポートレットに最適です。

動的ポートレットの組み込み

動的ポートレットは、豊富なユーザ インタフェース技術とブラウザ サーバ間の非同期な通信を使用します。お互いに知られないと依頼されない 1 つ以上のプロバイダからのコンテンツのマッシュアップを使用することで、ますます多くのサイトがビルドされます。インライン フレームでは、Rich ウィジェットとポートレットは相互の信用なしで一緒に統合する必要がある環境内で、便利で比較的安全なサンドボックス メカニズムが提供されます。

DOM 統合

WLP には、ポートレットを直接 HTML ページの DOM に統合できる Disc という JavaScript API が用意されます。

ヒント : Disc の詳細については、「WLP Disc フレームワーク」を参照してください。

DOM 統合は、インライン フレーム統合の固有の制限を打破する統合と機能を提供します。DOM 統合では、ポートレットを HTML ページの DOM ツリーのネイティブ 部として扱うことができます。この追加の機能によって、セキュリティ上のリスクと統合の複雑性の両方が増されます。このテクニックで統合されたポートレットは、ページの他の部分にあるデータと UI に完全にアクセスできます。さらに、開発者は JavaScript のグローバルな ネームスペースにおける衝突を防止する必要があります。「ネームスペースにおける衝突の回避」も参照してください。

基本的な JavaScript コーディングの手順

リモート ポートレットを HTML 形式のページの DOM に統合するための基本 JavaScript コーディング手順は、一貫したパターンがあります。この節では、手順をリストし、各手順について説明します。さらに、完全な例も示します。

  1. 次の例に示すように、ページに Disc ポートレットの公開 JavaScript モジュールを追加します。
  2. <script type="text/javascript"
       src="/<portal_web_app>/framework/scripts/bundles/disc-publishing.js">
    </script>

    この JavaScript モジュールは WLP J2EE 共有ライブラリに含まれ、常に、例に示す Web アプリケーション スコープ パスで対応されます。いくつかの異なる Web アプリケーションからポートレットを組み込む場合も、このモジュールをページごとに一回のみ含める必要があります。

  3. ポートレットの公開コンテキストを保持する変数をビルドします。公開コンテキストは、.portal ファイルへのパスかデスクトップのストリーミング ポータルのどちらかです。「ポートレットの公開コンテキストの参照」も参照してください。
  4. たとえば、以下の例は、ファイル ベースのポートレット用のコンテキストを指定します。<portal_web_app> は、WLP Web アプリケーション名であり、<portal_name> は、ポートレットを含むポータルの名前です。ファイル ベースのポートレット用のコンテキストは、Web アプリケーション ルートから .portal ファイルへの物理パスです。

    var publishingContext = "/<portal_web_app>/<portal_name>.portal";

    ストリーミング ポータルからポートレットのデスクトップ インスタンスを組み込むには、以下に示すようにコンテキスト変数を構成します。

    var publishingContext =
        "/<portal_web_app>/appmanager/<portal_name>/<desktop_name>

    ポートレットを公開する URL 形式」も参照してください。

  5. Disc API を使用して、公開コンテキスト用の PortletSource インスタンスを取得します。手順 2 で構成した公開コンテキストの変数をこの呼び出しに渡します。次に例を示します。
  6. var source = bea.wlp.disc.publishing.PortletSource.get(publishingContext);
  7. 2 つのプロパティを含む JavaScript オブジェクトを渡して、PortletSource オブジェクトの render() 関数を呼び出します。最初の portlet プロパティは、組み込むポートレットのインスタンス ラベルを指定します。2 つ目の to プロパティは、ポートレットが組み込まれる HTML div タグ用の id 属性の値を指定します。次に例を示します。
  8. source.render({ portlet: "<portlet_instance_label>", to: "<div_id_value>" });

    render() メソッドでは、JavaScript オブジェクトの配列も渡すことができます。詳細については、「高度なトピック」を参照してください。

  9. ポートレットを HTML ページ上の <div> 要素に配置します。次に例を示します。
  10. <div id=”div_id_value”></div>

コード リスト 5-3 は、このパラメータを全部含む、ポートレットのライブラリ インスタンスを HTML ページの DOM に組み込むの完全な例を示します。この例では、ほとんどのコードは、ページのロード時に呼び出される handleOnLoad() という JavaScript 関数でラップされます。

ヒント : <div> タグに「Loading...」というテキストが表示されます。このテキストはユーザに視覚的キューを出します。「Loading...」が一時的にページに表示され、ポートレットのマークアップを受信した後ポートレットに置き換えられます。
コード リスト 5-3 ポートレットの DOM 統合のサンプル コード
<html>
<head>
<title>My Portlet</title>
<script type="text/javascript"
           src="/myWebApp/framework/scripts/bundles/disc-publishing.js">
        </script>
<script type="text/javascript">
function handleOnLoad() {
var publishingContext = "/myWebApp/portals/main.portal";
var source =
                   bea.wlp.disc.publishing.PortletSource.get(publishingContext);
source.render({ portlet: "myPortlet_1", to: "myPortlet" });
}
</script>
</head>
<body onload="handleOnLoad();">
<p>Basic tests for rendering portlets on a host page.</p>
<div style="border: 1px solid black;">
<div id="myPortlet">Loading...</div>
</div>
</body>
</html>

ポートレットの公開コンテキストの参照

この節では、ライブラリとデスクトップ インスタンスのポートレット用のコンテキスト パラメータの値を参照する方法について説明します。

ライブラリ インスタンスのポートレット用の公開コンテキストの参照

ライブラリ インスタンスのポートレット用の公開コンテキストを参照するには、Workshop for WebLogic で .portal ファイルを右クリックし、[実行|サーバで実行] を選択します。パスは、ブラウザに表示されます。たとえば、ポータルへの完全な URL は、

http://foo.com/myWeb/portal-1.portal である場合、 

公開コンテキストは、

/myWeb/portal-1.portal です。 

デスクトップ インスタンスのポートレット用の公開コンテキストの参照

デスクトップ インスタンスのポートレットへのコンテキスト パスを取得する簡単な方法は、WLP Administration Console で検索することです。ポータル リソース ツリーで、デスクトップに移動し、それを選択します。パスは、[デスクトップにアクセスする URL] フィールドの [詳細] タブに表示されます。完全パスは以下のようになります。コンテキスト パスは <webapp_name> の後のものです。

http://<domain_name>/<webapp_name>/appmanager/<portal_name>/<desktop_name> 

ここでは、公開コンテキストを強調表示するデスクトップ URL の例を示します。

インラインフレームは、ポートレットと残りのページの間で分離を提供します

 


高度なトピック

この節では、開発者に関係するいくつかの高度なトピックについて説明します。

Decoration パラメータの使用

デスクトップ インスタンス用の URL 形式」で説明したデスクトップ インスタンス用の URL 形式では、オプションのdecoration パラメータが含まれます。decoration パラメータでは、ポートレットのルック アンド フィールはどのように表示されるかを指定できます。decoration ポートレットに指定できる値は次のとおりです。

次に例を示します。

http://foo.com/myWebApp/bea/wlp/api/portlet/publish/?
context=myWebApp/appmanager/myPortal/myDesktop&
portlet=myPortletInstanceLabel&decoration=full

詳細については、「デスクトップ インスタンス用の URL 形式」を参照してください。

複数のポートレットの DOM への統合

DOM 統合では、Disc API を使用して、単一のポートレットを DOM に統合する方法について説明します。複数のポートレットを 1 ページに統合する場合は、render() 関数に {portlet: , to: } オブジェクトの配列を渡します。このような場合は、Disc によって、サーバにすべてのポートレットを取得する 1 つのリクエストが発行されます。

たとえば、コード リスト 5-4 は、Disc の render() 関数にオブジェクトの配列を渡すことによって、ポートレットの複数のデスクトップ インスタンスを DOM に統合する方法を示します。

コード リスト 5-4 複数のポートレットの組み込み
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Portlet Publishing Example</title>
 <script type="text/javascript"             src="/publishingPortal/framework/scripts/bundles/disc-publishing.js">
        </script>
<script type="text/javascript">

function handleOnLoad() {
var publishingContext =               "/publishingPortal/appmanager/mainPortal/mainDesktop";
var source =                bea.wlp.disc.publishing.PortletSource.get(publishingContext);

source.render([{ portlet: "myPortlet_1", to: "portlet1Div" },
{ portlet: "myPortlet_2", to: "portlet2Div" },
{ portlet: "myPortlet_3", to: "portlet3Div" },
{ portlet: "myPortlet_4", to: "portlet4Div" }]);
}
</script>
</head>
<body onload="handleOnLoad();">

         <div style="border: 1px solid black;" id="portlet1Div">Loading...</div>
         </br>
         <div style="border: 1px solid black;" id="portlet2Div">Loading...</div>
         </br>
         <div style="border: 1px solid black;" id="portlet3Div">Loading...</div>
         </br>
         <div style="border: 1px solid black;" id="portlet4Div">Loading...</div>

</body>
</html>

複数の公開コンテキストからのポートレットの統合

複数ののポートレット公開コンテキストからポートレットをページに統合することができます。DOM 統合を実行している場合、公開コンテキストごとに別々の PortletSource API 呼び出しを構成する必要があります。インライン フレーム統合を使用する場合、<iframe> src タグの値としてポートレットを公開する適切な URL 形式を使用します。

それぞれの PortletSource.render() 呼び出しによって、サーバとの 1 つの対話が発生されます。複数のポートレットを 1 つの render() 呼び出しにグループすると、関数はすべてのポートレットはサーバ上で処理されない限り、応答を返しません。1 つのポートレットはサーバで過度の処理時間がかかる場合、ポートレットの全体のグループの表示に多少時間を要する可能性があります。この場合、時間のかかるポートレットを別の render() 呼び出しに配置します。これにより、ポートレットがサーバへの別の非同期呼び出しに表示されます。

 


ポートレットの公開と WSRP

ポートレットの公開と WSRP (Web Services for Remote Portlets) は相補的技術として考えることができます。両方の技術では、リモート ポータルにデプロイされたポートレットを使用できます。

この WSRP の場合は、ポートレットは、プロデューサと呼ばれる 1 つ以上のポータルからコンシューマと呼ばれる共通で統一ポータルに集約されます。コンシューマは、SOAP ベースのプロトコルを介してプロデューサと通信します。WSRP は OASIS 標準であるので、プロデューサは全く別のベンダ テクノロジを使用できます。また、コンシューマとプロデューサは標準的な Web サービスを介して通信するので、UDDI レジストリと Service Bus はポータルやルート トラフィックを検索するために使用することができます。従来型の WSRP ポートレットがデプロイされるプロデューサ ポータルに密接に関連付けられています。

これに対して、ポートレットの公開はブラウザ のコンテンツ (通常はポートレット) を集めます。クライアント側の開発者は、コンテンツを取得するためにサーバにインライン フレーム (iframe) または XMLHttpRequest 呼び出しをします。ポートレットの公開は一般に、ポートレットを非ポータル アプリケーションで公開するのに使用されるが、このテクニックはポータル アプリケーションにも使用できます。

ヒント : 連合されたポータルを作成する WSRP 方法については、『連合ポータル ガイド』を参照してください。

図 5-3 は、ポートレットの公開と WSRP 間の根本的な相違を示します。ポートレットの公開では、コンテンツが WLP アプリケーションから直接取得されます。WSRP では、コンテンツが 1 つ以上のプロデューサからコンシューマ ポータルに集められます。WSRP は標準であるので、プロデューサは異なったベンダからであることができます。

図 5-3 ポートレットの公開と WSRP

ポートレットの公開と WSRP

 


制限


  ページの先頭       前  次