ContextHub は、コンテキストデータを保存、操作および表示するためのフレームワークです。ContextHub について詳しくは、ContextHub デベロッパー向け概要を参照してください。
ContextHub ツールバーを設定して、プレビューモードで表示するかどうかを制御し、ContextHub ストアを作成したり UI モジュールを追加したりできます。
Adobe Granite ContextHub OSGi サービスを設定して、ページで ContextHub UI を表示または非表示にします。このサービスの PID は、com.adobe.granite.contexthub.impl.ContextHubImpl.
です。
このサービスは、Web コンソールまたはリポジトリー内の JCR ノードを使用して設定できます。
com.adobe.granite.contexthub.show_ui
ブール値プロパティを true
に設定します。UI を非表示にするには、プロパティを false
に設定します。ContextHub UI を表示に設定すると、AEM オーサーインスタンスのページにのみ表示されます。UI はパブリッシュインスタンスのページには表示されません。
ContextHub ツールバーに表示される UI のモードとモジュールをプレビューモードで設定します。
UI モードはツールバーの左側に一連のアイコンとして表示されます。選択すると、UI モードのモジュールが右側に表示されます。
アイコンは、Coral UI ライブラリからの参照です。
UI モードをグループ関連の ContextHub モジュールに追加します。UI モードを作成する際に、ContextHub ツールバーに表示されるタイトルとアイコンを指定します。
Experience Manager レールで、ツール/サイト/Context Hub をクリックまたはタップします。
デフォルトの設定コンテナをクリックまたはタップします。
「ContextHub 設定」をクリックまたはタップします。
「作成」ボタンをクリックまたはタップして、「ContextHub UI モード」をクリックまたはタップします。
次のプロパティの値を指定します。
coral-Icon--user
)。「保存」をクリックまたはタップします。
ContextHub UI モジュールを UI モードに追加し、それを ContextHub ツールバーに表示して、ページコンテンツをプレビューできるようにします。UI モジュールを追加するときは、ContextHub に登録されるモジュールタイプのインスタンスを作成します。UI モジュールを追加するには、関連するモジュールタイプの名前が必要です。
AEM には、基本の UI モジュールタイプと、UI モジュールのベースにできる複数のサンプル UI モジュールタイプが用意されています。次の表で、各モジュールタイプについて簡単に説明します。カスタム UI モジュールの開発について詳しくは、ContextHub UI モジュールの作成を参照してください。
UI モジュールのプロパティには、モジュール固有のプロパティの値を指定できる詳細設定が含まれています。詳細設定は JSON 形式で指定します。表の「モジュールタイプ」列は、各 UI モジュールタイプに必要な JSON コードに関する情報へのリンクを示します。
モジュールの種類 | 説明 | ストア |
---|---|---|
contexthub.base | 汎用の UI モジュールタイプ | UI モジュールのプロパティで設定されます |
contexthub.browserinfo | ブラウザーに関する情報が表示されます | surferinfo |
contexthub.datetime | 日付と時間の情報が表示されます | datetime |
contexthub.location | クライアントの緯度と経度、およびマップ上の位置が表示されます。位置は変更できます。 | geolocation |
contexthub.screen-orientation | デバイスの画面の向きが表示されます(横置きまたは縦置き) | emulators |
contexthub.tagcloud | ページのタグに関する統計が表示されます | tagcloud |
granite.profile | authorizableID 、displayName 、familyName など、現在のユーザーのプロファイル情報が表示されます。displayName と familyName の値は変更できます。 |
profile |
Experience Manager レールで、ツール/サイト/ContextHub をクリックまたはタップします。
UI モジュールを追加する設定コンテナをクリックまたはタップします。
UI モジュールを追加する ContextHub 設定コンテナをクリックまたはタップします。
UI モジュールを追加する UI モードをクリックまたはタップします。
「作成」ボタンをクリックまたはタップして、「ContextHub UI モジュール (汎用)」をクリックまたはタップします。
次のプロパティの値を指定します。
(オプション)デフォルトのストアの設定をオーバーライドするには、UI モジュールを設定する JSON オブジェクトを入力します。
「保存」をクリックまたはタップします。
ContextHub ストアを作成してユーザーデータを保持し、必要に応じてそのデータにアクセスします。ContextHub ストアは、登録済みのストア候補に基づきます。ストアを作成する際には、ストア候補が登録された storeType の値が必要です(カスタムストア候補の作成を参照してください)。
ストアを設定すると、詳細設定プロパティによりストア固有のプロパティの値を指定できます。値は、ストアの config
関数の init
パラメーターに基づきます。このため、この値を指定する必要があるかどうかと、指定する値の形式はストアによって変わります。
詳細設定プロパティの値は、JSON 形式の config
オブジェクトです。
AEM には、ストアのベースにできる次のサンプルのストア候補が用意されています。
ストアの種類 | 説明 |
---|---|
aem.segmentation | 解決済みおよび未解決の ContextHub セグメントを格納します。ContextHub SegmentManager からセグメントを自動的に取得します |
contexthub.geolocation | ブラウザーの場所の緯度と経度を格納します。 |
granite.emulators | 多数のデバイスのプロパティと機能を定義し、現在のクライアントデバイスを検出します |
granite.プロファイル | 現在のユーザーのプロファイルデータを格納します |
contexthub.surferinfo | デバイス情報、ブラウザーの種類、画面の向きなど、クライアントに関する情報を格納します |
Experience Manager レールで、ツール/サイト/ContextHub をクリックまたはタップします。
デフォルトの設定コンテナをクリックまたはタップします。
「Contexthub 設定」をクリックまたはタップします。
ストアを追加するには、作成アイコンをクリックまたはタップして、「ContextHub ストア設定」をクリックまたはタップします。
次の基本設定のプロパティの値を指定して「次へ」をクリックまたはタップします。
(オプション)デフォルトのストアの設定をオーバーライドするには、「詳細設定(JSON)」ボックスに JSON オブジェクトを入力します。
「保存」をクリックまたはタップします。
この例は、ストアを設定して UI モジュールにデータを表示する方法を示します。この例では、ストアのデータソースとして jsontest.com サイトの MD5 サービスが使用されています。サービスが指定の文字列の MD5 ハッシュコードを JSON 形式で返します。
contexthub.generic-jsonp ストアがサービスコール https://md5.jsontest.com/?text=%22text%20to%20md5%22
のデータを格納するように設定されます。サービスが UI モジュールに表示される次のデータを返します。
{
"md5": "919a56ab62b6d5e1219fe1d95248a2c5",
"original": "\"text to md5\""
}
contexthub.generic-jsonp のサンプルのストア候補を使用すると、JSON データを返す JSONP サービスや Web サービスからデータを取得できます。このストア候補では、そのストア設定を使用して、使用する JSONP サービスに関する詳細を指定します。
Javascript クラスの initContextHub.Store.JSONPStore
関数は、このストア候補を初期化する config
オブジェクトを定義します。config
オブジェクトには JSONP サービスに関する情報が含まれる service
オブジェクトが含まれています。ストアを設定するには、詳細設定プロパティの値として service
オブジェクトを JSON 形式で指定します。
jsontest.com サイトの MD5 サービスからのデータを保存するには、次のプロパティを使用して ContextHub ストアの作成の手順に従います。
設定のタイトル: md5
ストアの種類: contexthub.generic-jsonp
必須:オン。
有効:オン
詳細設定(JSON):
{
"service": {
"jsonp": false,
"timeout": 1000,
"ttl": 1800000,
"secure": false,
"host": "md5.jsontest.com",
"port": 80,
"params":{
"text":"text to md5"
}
}
}
ContextHub ツールバーに UI モジュールを追加して、サンプルの md5 ストアに格納されているデータを表示します。この例では、contexthub.base module が次の UI モジュールの生成に使用されています。
UI モジュールの追加手順に従って、既存の UI モジュールに、サンプルのペルソナ UI モードなどの UI モジュールを追加します。UI モジュールには、次のプロパティ値を使用します。
UI モジュールのタイトル: MD5
モジュールの種類: contexthub.base
詳細設定(JSON):
{
"icon": "coral-Icon--data",
"title": "MD5 Conversion",
"storeMapping": { "md5": "md5" },
"template": "<p> {{md5.original}}</p>;
<p>{{md5.md5}}</p>"
}
ContextHub のデバッグモードを有効にして、トラブルシューティングに対応できます。デバッグモードは、ContextHub 設定または CRXDE のいずれかを利用して有効にできます。
ContextHub の設定を編集し、「デバッグ」オプションをオンにします。
CRXDE Lite を使用して、debug
プロパティを true に設定します。
/conf/global/settings/cloudsettings
または/conf/<site>/settings/cloudsettings
開発時に役立つ詳細なデバッグメッセージをログに記録するように、Adobe Granite ContextHub OSGi サービス(PID = com.adobe.granite.contexthub.impl.ContextHubImpl
)を設定します。
このサービスは、Web コンソールまたはリポジトリー内の JCR ノードを使用して設定できます。
com.adobe.granite.contexthub.debug
ブールプロパティを true
に設定します。サイレントモードでは、すべてのデバッグ情報が無効になります。各 ContextHub 設定に対して個別に設定可能な通常のデバッグオプションとは異なり、サイレントモードは、ContextHub 設定レベルのあらゆるデバッグ設定より優先されるグローバル設定です。
これは、デバッグ情報をまったく必要としないパブリッシュインスタンスに便利なモードです。これはグローバル設定なので、OSGi を介して有効にします。
http://<host>:<port>/system/console/configMgr
で Adobe Experience Manager Web コンソール設定を開きます。ContextHub を無効にすると、js/css の読み込みと初期化を回避できます。ContextHub を無効にする方法は 2 つあります。
ContextHub の設定を編集し、「ContextHub を無効にする」チェックボックスをオンにします。
または
/conf/global/settings/cloudsettings/<configName>/contexthub
の disabled
プロパティを true に設定します。