プライマリ・コンテンツに移動
Oracle® Fusion Middleware Oracle JDeveloperによるWebCenter Portalアセットとカスタム・コンポーネントの開発
12c (12.2.1.1)
E79323-01
目次へ移動
目次

前
次

16 ページレットおよびガジェットの使用

この章では、Oracle WebCenter Portalのページレット・プロデューサを使用したページレットの作成方法について説明します。

この章の内容は次のとおりです。

16.1 OpenSocialガジェットの使用

ページレット・プロデューサ・サーバーからアクセス可能なOpenSocialガジェットは、ページレットとして登録して、ポータルなどのWebアプリケーションで使用できます。OpenSocialガジェットをサポートするには、まず「OpenSocial設定の構成方法」の説明に従って、OpenSocialコンテナを定義する必要があります。

ページレット・プロデューサでは、OAuthを除く、標準のOpenSocial APIのほとんどをサポートしています。完全なOpenSocial APIリファレンス・ドキュメントは、次の場所から入手できます。

http://docs.opensocial.org/display/OSD/Specs

ページレット・プロデューサでは、OpenSocial APIを使用した、ガジェットによるプリファレンスの保存、WebCenter Portalプロファイルと接続情報の取得およびユーザーのアクティビティ・ストリームへのアクセスが可能です。

この項では、次の項目について説明します。

16.1.1 認証の構成方法

ガジェットからユーザーレベルのデータ(プリファレンスやピープル・コネクション)をリクエストするには、エンド・ユーザーのIDを確立する必要があります。いずれかのOpenSocialガジェットから、サーバーにあるユーザーレベルのデータにアクセスする必要がある場合、ページレット・プロデューサ・コンソールで、親OpenSocialリソースのセキュリティ・ポリシーを構成する必要があります(「ポリシー設定の構成方法」を参照)。ユーザーがOpenSocialガゼットに初めてアクセスすると、ログイン・ページが表示されます。初回ログイン後は、OpenSocialガゼットに対する後続のリクエストで確立されたユーザーIDが使用されます。

16.1.2 ユーザー・プリファレンスの格納方法

OpenSocialガゼットでは、ユーザー・プリファレンスを使用してコンテナでデータを格納できます。ユーザー・プリファレンスは、特定のユーザーにスコープ設定されますが、オプションで、appIdにスコープ設定することもできます(ガゼットappIdはページレットのコンテキストIDです)。OpenSocial gadget.Prefs APIを使用する場合は、ユーザー・プリファレンスはユーザーとページレット・インスタンスにスコープ設定されます。または、opensocial.DataRequest APIを使用して、他のページレットと共有可能なプリファレンスをユーザー・レベルで管理することもできます。

ページレットとして登録した場合は、ガゼットのユーザー・プリファレンスはページレット・プリファレンスとして処理されます。WebCenter Portalでは、たとえば、隠されていないユーザー・プリファレンスを、「パーソナライズ」ボタンを使用してエンド・ユーザーが編集できます。さらに、ユーザー間で共有されたプリファレンスをシミュレートするために、ページレット・パラメータを介してユーザー・プリファレンスを渡すことができます。ページレット・プリファレンスが設定されている場合は、対応するページレット・パラメータが常にオーバーライドされます(つまり、パーソナライズはカスタマイズに優先します)。

WebCenter Portalの外では、ガジェットがサポートするページレットに、プリファレンス・エディタにアクセスし、ガジェットを最大/最小化するためのガジェット・タイトルとボタンを表示する簡単なクロムが提供されます。値noneをページレット注入APIのクロム・パラメータに渡すことにより、クロムを抑止できます。プリファレンス・エディタのUIでは、次の4種類のユーザー・プリファレンスをすべてサポートしています。

  • string: テキスト・フィールドとしてレンダリング

  • bool: チェック・ボックスとしてレンダリング

  • enum: ドロップダウン・リストとしてレンダリング

  • list: テキスト・フィールドとしてレンダリング(値はパイプ「|」文字で区切る必要があります)

16.1.3 WebCenter Portalのプロファイル情報へのアクセス方法

OpenSocialガジェットでは、標準のOpenSocial APIを介して現在のユーザーのプロファイル・データとピープル・コネクションを問合せできます。この機能を使用するには、『Oracle WebCenter Portalの管理』の「ページレット・プロデューサの管理」の説明に従って、WebCenterDSデータ・ソースのターゲットとしてWC_Portletサーバーを手動で指定する必要があります。

注意:

OpenSocial APIをプロファイルや接続情報の更新に使用することはできません。

サポートされているユーザー・プロファイルのフィールドを表16-1に示します。

表16-1 ユーザー・プロファイルのフィールド

OpenSocialフィールド タイプ 説明

aboutme

string

個人に関する一般的な説明。

addresses

Plural-Field <Address>

個人の物理メーリング・アドレス。

appData

Plural-Field <AppData>

AppDataのキーと値のコレクションで、プリファレンスに使用。

birthday

Date

個人の生年月日。値は有効な日付である必要があります。この個人の年齢がプライベートであるか、入力した年が使用不可能である場合は、年が0000に設定される場合があります。

emails

Plural-Field <string>

個人の電子メール・アドレス。

location

string

個人の物理的な住所。

name

Name

個人の実名のコンポーネントを分解して書式設定したバージョン。

organizations

Plural-Field <Organization>

個人の現在や過去の組織的な所属。

phoneNumbers

Plural-Field <string>

個人の電話番号。このタイプに正当な標準値に加え、このフィールドでは、モバイル、ファックスおよびページャなどの追加の値を定義します。

photos

Plural-Field <string>

個人の写真のURL。値は、イメージが含まれているWebページではなく、実際のイメージ・ファイル(例: GIF、JPEGまたはPNGイメージ・ファイル)を指し示す必要があります。このフィールドは、連絡先を記述する際の表示に適した連絡先プロファイル写真をダウンロードするためにのみ使用してください。

preferredUsername

string

ユーザー名を要求するサイトでの、この個人の優先ユーザー名(jsmarrやdaveman692など)。

status

string

個人のステータス、ヘッドラインまたは挨拶。

thumbnailUrl

string

文字列として指定された、個人の写真のサムネイルのURL。これは完全修飾URLである必要があります。

16.1.4 ユーザーのアクティビティ・ストリームへのアクセス方法

OpenSocialガジェットは、OpenSocial APIを使用してユーザーのアクティビティ・ストリームを操作できます。次の操作がサポートされています。

  • アクティビティの取得

  • アクティビティの作成

次の操作はサポートされていません。

  • アクティビティの更新

  • アクティビティの削除

サポートされているアクティビティ・ストリームのフィールドを表16-2に示します。

表16-2 アクティビティ・ストリームのフィールド

OpenSocialフィールド タイプ 説明

appId

Object-Id

アクティビティが関連付けられているアプリケーション。

body

string

アクティビティのオプションの拡張バージョン。本体には次のHTMLタグ、 <b> <i>、<a>、<span>のみを含めることもできますが、このフォーマットは無視できます。

externalId

Object-Id

投稿アプリケーションで生成されるオプションのID。

id

Object-Id

アクティビティに永続的に関連付けられているID。

postedTime

string

エポック以降にアクティビティが実行された時間(ミリ秒)。

priority

number

同じソースの別のアクティビティとの関連で、該当のアクティビティの相対的な優先度を表す0から1までの数値。

title

string

アクティビティのプライマリ・テキスト。タイトルには次のHTMLタグ、 <b> <i>、<a>、<span>のみを含めることもできますが、このフォーマットは無視できます。

userId

Object-Id

アクティビティの定義対象であるユーザーのID。

16.1.5 ガジェット・イベントの使用方法

ページレット・プロデューサでは、OpenSocial PubSubガジェット間イベント・モデルをサポートしています。ガジェットでは、JavaScriptで任意の数のチャネル(単純な文字列名で定義)を通じてイベントを公開できます。受信が終了すると、ガジェットは、再びJavaScriptで任意の数のチャネルを通じてイベントの受信をサブスクライブし、イベントに応じて適切な処理を実行できます。

function connSelected(element) {
var connId =element.id;
 var connName =element.lastChild.textContent;
 gadgets.pubsub.publish(channel, {id: connId, name: connName});

サポートされているイベント処理APIに対する完全なJavaScriptリファレンスについては、次を参照してください。

http://docs.opensocial.org/display/OSD/Specs

16.1.6 例: 外部OpenSocialガジェットの使用方法

次の例は説明のために簡略化されています。OpenSocialガジェットをサポートするには、まず「OpenSocial設定の構成方法」の説明に従って、OpenSocialコンテナを定義する必要があります。

  1. ページレット・プロデューサ・コンソールを使用して新しいリソースを作成し、タイプに「OpenSocial」を選択します。必要に応じてURLおよびポリシーを定義します。新しいリソースを保存します。

  2. ページレット・プロデューサ・コンソールを使用して、新しいページレットを作成し、「ガジェットURL」フィールドにガジェットXMLスキーマの場所を入力します。

    • ガジェット名およびガジェットに定義されたすべてのプリファレンスをインポートするには、「ガジェット・メタデータのインポート」ボタンをクリックします。いずれかのプリファレンスが編集可能な場合、ページレット・プロデューサは、インポートされたプリファレンスを使用してプリファレンス・エディタを作成します。

    • 生成されたプリファレンス・エディタを構成またはカスタマイズするには、「ページレット・パラメータ」ページに移動します。

  3. 「ドキュメント」ページに移動し、JavaScriptまたはREST APIを使用してページレットおよびプリファレンス・エディタにアクセスするためのサンプル・コードを確認します。

  4. 新しいページレットを保存します。

16.1.7 例: ローカルOpenSocialガジェットの使用方法

次の例は説明のために簡略化されています。OpenSocialガジェットをサポートするには、まず「OpenSocial設定の構成方法」の説明に従って、OpenSocialコンテナを定義する必要があります。

  1. ページレット・プロデューサ・コンソールを使用して新しいリソースを作成し、タイプに「OpenSocial」を選択します。必要に応じてURLおよびポリシーを定義します。新しいリソースを保存します。

  2. ガジェット・ファイルを作成またはアップロードします。

    注意:

    OpenSocialガジェットXMLファイルをホストする場合は、このファイルを匿名リソース(セキュリティ・ポリシーなし)の下に配置する必要があります。そこに配置しないと、ガジェットが正常に機能しません。

    1. リソースの下の「ファイル」セクションを選択し、ツールバーの「作成」アイコンをクリックします。

    2. 「一般」ページで、「名前」フィールドにファイルへの相対パスを入力します。先行スラッシュ("/")を使用しないでください。たとえば、「gadgets/activities.xml」です。任意のパスと名前を使用できます。パスは、ページレット・プロデューサがファイルの処理に使用する仮想URLです。ナビゲータのファイル・コレクションの仮想ディレクトリ構造は、ファイルのパスに一致するように更新されます。

    3. ガジェット・ファイルをアップロードまたは作成するには、「コンテンツ」ページに進みます。

      ガジェット・ファイルをアップロードするには、ファイルへのパスを入力するか「参照」ボタンをクリックしてファイルに移動し、「アップロード」ボタンをクリックし、ページレット・プロデューサ・サーバーにファイルをアップロードします。

      ガジェット・ファイルを作成するには、「コンテンツ」ページでエディタを使用してコンテンツを入力したり編集します。

    4. ナビゲータ・ツールバーの保存アイコンをクリックします。

  3. ガジェットで必要なその他のファイル(JavaScript、イメージなど)を、リソースの「ファイル」セクションで作成またはアップロードします。ガジェット・コードのパスに一致するファイルのパスを定義します。たとえば、ガジェットが"js"というサブフォルダのJavaScriptファイルを使用する場合は、ファイルをアップロードする際に「名前」フィールドにそのディレクトリ(gadgets/js/activities.jsなど)を指定します。

  4. ページレット・プロデューサ・コンソールを使用して、新しいページレットを作成し、「ガジェットURL」フィールドに(ステップ2で作成またはアップロードした)ガジェットのXMLスキーマの相対パスを入力します。ローカル・ファイルの場合、これはファイル・オブジェクトの「名前」フィールドに定義されているパスと同じです(gadgets/activities.xmlなど)。

    • ガジェット名およびガジェットに定義されたすべてのプリファレンスをインポートするには、「ガジェット・メタデータのインポート」ボタンをクリックします。いずれかのプリファレンスが編集可能な場合、ページレット・プロデューサは、インポートされたプリファレンスを使用してプリファレンス・エディタを作成します。

  5. 「ドキュメント」ページに移動し、JavaScriptまたはREST APIを使用してページレットおよびプリファレンス・エディタにアクセスするためのサンプル・コードを確認します。

  6. 新しいページレットを保存します。

16.2 WSRPおよびOracle PDK-Javaポートレットに対するページレット・クロムの使用

ページレット・プロデューサを使用すると、WSRPおよびOracle PDK-Javaポートレットを表示して任意のWebアプリケーションで使用できるようになります。この項では、ページレット・クロムを使用して、実行時にWSRPまたはOracle PDK-Javaポートレットでマークアップを変更する方法について説明します。WSRPまたはOracle PDK-Javaポートレット・プロデューサに接続するためのページレット・プロデューサの構成の詳細は、『Oracle WebCenter Portalの管理』の「ページレット・プロデューサの管理」を参照してください。

ページレット・クロム・テンプレートは次の各方法を指定するHTMLファイルです。

  • ポートレット・マークアップのスタイル・レンダリング方法

  • ポートレット・タイトルの表示方法

  • モード切替えオプションのレンダリング方法

デフォルトのクロム・テンプレートには、ポートレット名と、異なるモードへの切替えが可能なドロップダウン・メニューが表示されます。ドロップダウン・メニューは、基礎となるポートレットによりサポートされるすべての標準モードが動的に移入されます。テンプレートは、次の予約済トークン(表16-3を参照)を使用して主要なポートレット要素を特定していますが、これらは実行時にページレット・プロデューサによって置き換えられます。

表16-3 ページレット・クロム・テンプレートのトークン

トークン 説明
$$PORTLET TITLE$$

ポートレット・タイトル

$$REPEAT MENU ITEM$$

ナビゲーショナル・アイテムの繰返しセクションの始まりを示すために使用

$$END REPEAT MENU ITEM$$

ナビゲーショナル・アイテムの繰返しセクションの終わりを示すために使用

$$MENU ITEM URL$$

ナビゲーションURL(ポートレット・モードまたはウィンドウ状態の切替え用)

$$MENU ITEM$$ 

ナビゲーショナル・アイテムの名前(Customizeなど)の表示

$$TOKEN$$

ページ上のページレット・インスタンスの一意の識別子

$$PORTLET CONTENT$$

ポートレット・コンテンツ

pt://images

imageserverのURLを示すために使用されるタグ

次に、非常に単純なページレット・クロム・テンプレートの例を示します。

<script type="text/javascript">
function goto(url)
{
 document.location =url;
 return false;
}
</script>
<div style="border: 1px solid">
<span><b><!-- $$PORTLET TITLE$$ --></b></span>
<span style="align: right">
 Switch Mode:
 <select size="1" name="mode">
 <!-- $$REPEAT MENU ITEM$$ -->
 <option onclick="goto('$$MENU ITEM URL$$')"><!-- $$MENU ITEM$$ --></option>
 <!-- $$END REPEAT MENU ITEM$$ -->
 </select>
 
</span>
</div>
<!-- $$PORTLET CONTENT$$ -->

注意:

ページレット・クロム・テンプレート・ファイルは、ページレット・プロデューサWebアプリケーションのclasspathでホストする必要があります。

外部イメージ・サーバーを使用するようにページレット・プロデューサを構成した場合は、ensemblestatic.war/imageserver/yahooからイメージ・サーバーにファイルをコピーしてデフォルトのクロム・テンプレートが正しくレンダリングされるようにします。

クロム・テンプレートを実装するには、それをパラメータとしてページレット注入URL (RESTまたはJavaScript)に追加します。ページレット挿入URLの詳細は、「Webページへのページレットの追加」を参照してください。次に例を示します。

  • REST: /inject/v2/pagelet/pagelet_lib/pagelet_name?chrome=mychrome.html

  • JavaScript: injectpagelet(library, name, iframe_options, payload, params, context_id, element_id, is_in_community, chrome)

クロム・パラメータの値として、クロム・テンプレートが含まれているファイルの名前、またはすべてのクロムを抑止してポートレット・マークアップのみを返す特別な予約値「none」を指定できます。クロム・パラメータが省略された場合は、デフォルトのクロムがポートレット・マークアップとともに返されます。デフォルトのクロム・テンプレートでは、YUIメニュー・コントロールを使用してグラデーション・タイトル・バーとモード切替え用のDHTMLドロップダウン・メニューが表示されます。(ADFコンテンツが検出された場合は、デフォルトにより別のクロム・テンプレートが使用されます。このテンプレートはカスタム・テンプレートによってオーバーライドするか、chrome=chrometemplate.htmlを設定することによって標準のデフォルト・テンプレートでオーバーライドできます。)