Lightning コミュニティ開発者ガイド
jReuse Content with CMS Connect JSON (CMS Connect JSON でのコンテンツの再利用)
コンテンツ項目またはコンテンツリスト
CMS にある JSON コンテンツを再利用して、コミュニティに表示したいとします。CMS Connect では、2 つの基本的な JSON コンテンツタイプがサポートされています。これらの名称は、CMS によって異なる場合があります。わかりやすくするために、CMS Connect では [コンテンツ項目] および [コンテンツリスト] と呼びます。
コンテンツ項目には、1 つのブログ投稿などがあります。これがページで表示される場合、単なる宣伝文ではなく完全なブログ投稿になります。一方、コンテンツリストは一連のブログなどの項目のグルーピングです。コンテンツリストがページに表示されるときに、各リスト項目のタイトルと概要、およびブログ全体へのリンクが表示されます。
JSON コンテンツを再利用する方法
このプロセスは、3 つの主要なステップにまとめられます。
- 必要に応じて、クロスオリジンリソース共有 (CORS) を設定します。コミュニティで CMS リソースを使用できない場合は、CMS システムの CORS ヘッダー内の信頼できるホストにコミュニティホストを追加します。すべての CMS 接続は、認証されていない HTTPS (HTTP over SSL) を使用する必要があります。
- CMS 接続を作成します。接続を設定するときに、コンテンツがコンテンツ項目であるかコンテンツリストであるかを定義し、サーバ URL とコンテンツパスを指定します。
- CMS Connect (JSON) コンポーネントをコミュニティページに追加します。エクスペリエンスビルダーを使用して、コンポーネントをコミュニティページにドラッグし、そのプロパティを設定します。JSON 式を使用して、タイトル、著者、ブログコンテンツなどを CMS から取り込みます。
JSON コンテンツのプレビュー
JSON レスポンスボディをプレビューすると、CMS システムのデータ形式を理解するのに役立ちます。たとえば、WordPress Web サイトの URL が https://capricornblog.wordpress.com だとします。ブラウザで、CMS コンテンツの完全な JSON エンドポイント (https://public-api.wordpress.com/rest/v1.1/sites/capricornblog.wordpress.com/posts など) を入力します。
このエンドポイントは、CMS 接続を��義するときに使用します。エンドポイントには、サーバ URL と JSON パスの 2 つの部分があります。この例では、サーバ URL は WordPress サイトを参照し、JSON パスは一連のブログのパスです。CMS Connect (JSON) コンポーネントを設定するときに、ブログシリーズをコンテンツリストとして取得し、個々のブログをコンテンツ項目として取得します。
ブラウザでエンドポイントを入力すると、JSON レスポンスボディのデータ形式が表示されます。応答をプレビューすると、コミュニティページで CMS Connect コンポーネントを設定する方法を理解するのに役立ちます。
Drupal の応答の例
例
Drupal CMS に JSON コンテンツがあるとします。サンプルコンテンツ項目の JSON レスポンスボディを次に示します。
1{
2 "data": {
3 "type": "node--page",
4 "id": "c53cf56c-f70d-456e-838b-47788742b074",
5 "attributes": {
6 "nid": 5,
7 "uuid": "c53cf56c-f70d-456e-838b-47788742 b074",
8 "vid ": 5,
9 "langcode": "en",
10 "title": "This is an Example.",
11 "created": 1502133909,
12 "changed": 1502133933,
13 "body": {
14 "value": "This is the body.",
15 "summary ": ""
16 }
17 },
18 "relationships": {
19 "type ": {
20 "data ": {
21 "type": "node_type--node_type",
22 "id": "5b80bc9e-dc78-4612-add8-e46b2e2ff616"
23 }
24 }
25 }
26 }
27}この例では、@data は親ノードを参照します。@data の属性ノードは、親の下にネストされています。
CMS Connect (JSON) コンポーネントを設定するときに、JSON 式を使用して、取得する接続とコンテンツを指定します。
たとえば、次の JSON 式はコンテンツのタイトルを取得します。
1@data/attributes/title次の式はコンテンツ ID を取得します。
1@data/id次の JSON 式は、ブログテキストなどのコンテンツ本文を取得します。
1@data/attributes/body/valueJSON 式は、任意のノードの深さを処理できます。
例
Drupal を使用する CMS 接続の JSON コンテンツリストの例を次に示します。コンテンツリストへのパスは、{baseUrl}/jsonApi/node/page です。
1{
2 "data": {
3 "type": "node--page",
4 "id": "c53cf56c-f70d-456e-838b-47788742b074",
5 "attributes": {
6 "nid": 5,
7 "uuid": "c53cf56c-f70d-456e-838b-47788742b074",
8 "vid": 5,
9 "langcode": "en",
10 "status": true,
11 "title": "Test",
12 "created": 1502133909,
13 "changed": 1502133933,
14 "promote": false,
15 "sticky": false,
16 "revision_timestamp": 1502133933,
17 "revision_log": null,
18 "revision_translation_affected": true,
19 "default_langcode": true,
20 "path": null,
21 "body": {
22 "value": "<p>Here is the header<\/p>\r\n",
23 "format": "basic_html",
24 "summary": ""
25 }
26 },
27 "relationships": {
28 "type": {
29 "data": {
30 "type": "node_type--node_type",
31 "id": "5b80bc9e-dc78-4612-add8-e46b2e2ff616"
32 },
33 "links": {
34 "self": "https:\/\/www.sandbox7.net\/jsonapi\/node\/page\/c53cf56c-f70d-456e-838b-47788742b074\/relationships\/type",
35 "related": "https:\/\/www.sandbox7.net\/jsonapi\/node\/page\/c53cf56c-f70d-456e-838b-47788742b074\/type"
36 }
37 },
38 "uid": {
39 "data": {
40 "type": "user--user",
41 "id": "d5808807-9f3d-4f10-a031-c3340172b88e"
42 },
43 "links": {
44 "self": "https:\/\/www.sandbox7.net\/jsonapi\/node\/page\/c53cf56c-f70d-456e-838b-47788742b074\/relationships\/uid",
45 "related": "https:\/\/www.sandbox7.net\/jsonapi\/node\/page\/c53cf56c-f70d-456e-838b-47788742b074\/uid"
46 }
47 },
48 "revision_uid": {
49 "data": {
50 "type": "user--user",
51 "id": "d5808807-9f3d-4f10-a031-c3340172b88e"
52 },
53 "links": {
54 "self": "https:\/\/www.sandbox7.net\/jsonapi\/node\/page\/c53cf56c-f70d-456e-838b-47788742b074\/relationships\/revision_uid",
55 "related": "https:\/\/www.sandbox7.net\/jsonapi\/node\/page\/c53cf56c-f70d-456e-838b-47788742b074\/revision_uid"
56 }
57 }
58 },
59 "links": {
60 "self": "https:\/\/www.sandbox7.net\/jsonapi\/node\/page\/c53cf56c-f70d-456e-838b-47788742b074"
61 }
62 },
63 "links": {
64 "self": "https:\/\/www.sandbox7.net\/jsonapi\/node\/page\/c53cf56c-f70d-456e-838b-47788742b074"
65 }
66}コミュニティページに複数の参照元からの JSON コンテンツを表示できます。CMS Connect ワークスペースで JSON 接続を設定します。次に、コンポーネントをページにドラッグして、CMS コンテンツを取り込む JSON 式を定義します。