[Oracle Cloud] GraphQL で Oracle Content Management のデータを取得する

# はじめに

Oracle Content Management(以降OCM)は、クラウド・ネイティブな**コンテンツ管理プラットフォーム**です。強力なコラボレーション、ワークフロー管理、機械学習による自動タグ付けとオーサリング・レコメンデーションを提供することで、**コンテンツ作成時間の短縮**、**検索コストの削減**、**企業ガバナンスの強化**を実現します。開発者は、すぐに使用できるテンプレートを使用して**コンテンツ・リッチなサイトを迅速に構築**したり、既存のWeb、モバイル、デジタルアシスタント・チャネルやエンタープライズ・アプリケーションにコンテンツを提供することで、**マーケティング・キャンペーンで顧客の興味を引く関連性の高いエクスペリエンス**を提供します

この記事では、GraphQL で Oracle Content Management のデータを取得する方法を紹介します

:::note info
この記事は、2021年8月時点での最新バージョン(21.7.1)を元に作成されてます
:::

:::note info
バージョン21.6.1より、サービス名称が Oracle Content and Experience(OCE) から Oracle Content Management(OCM) に変更されました。
:::


# GraphQLとは

Qiitaには、多くの参考になる記事があります。こちらで2件ピックアップしましたので、まずはご確認ください。

https://qiita.com/shotashimura/items/3f9e04b93e79592030a4

>GraphQLはWEB APIのクエリ言語であり、既存のデータに対してクエリ（データ取得の命令）を実行するためのランタイム（実行時に必要なもの）です。
>REST APIと異なり、GraphQLではエンドポイントが１つだけであり、処理ごとに増やしていく必要もないので、管理しやすいことが大きな特徴です。


https://qiita.com/toto_inu/items/b9946a5d9b5e19f38b51

>APIの「方式」の１つです。
>
>Facebookが2015年に公開した、比較的新しいAPI方式になります。
>
>特徴としては、以下のようなものがあります。
>
> 1. エンドポイントは１つだけ
> 1. やりとりするデータに対して型チェックが可能
> 1. リアルタイム通信


あわせて、GraphQL公式サイトもご確認ください

https://graphql.org/


# 1. 準備

事前準備として、**OCMインスタンスの作成**と**アセット・リポジトリの定義とアセットの登録・公開**が必要です。以下のチュートリアルを参考に準備してください

1. [Oracle Content and Experience インスタンスを作成する](https://oracle-japan.github.io/ocitutorials/content-management/create_oce_instance/)

1. [Oracle Content and Experience を Headless CMS として使ってみよう【初級編】 ](https://oracle-japan.github.io/ocitutorials/content-management/41_asset_headless/)

なお、GraphQLは、**Oracle Content Management - Starter Edition**でも利用できます。Starter Edition環境の作成は、以下の記事を参考にしてください

https://qiita.com/nakasato310/items/9457a61d9d27db6ce4f0


# 2. GraphQLスキーマを確認する

OCMは**公開されているすべてのコンテンツ**と**すべてのアセットタイプ**に対するGraphQLをサポートします。開発者はスキーマを確認し、クエリを作成し、他の配信APIと一緒にクライアントから呼び出すことができます。

OCMにはGraphQL IDEが含まれています。URLは以下の通りです

```
https://<OCMインスタンスのURL>/content/published/api/v1.1/graphql/explorer
```

アクセスすると、このような画面が表示されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120110/97044db9-e0d7-00d2-989d-f38c0f12014d.png)

画面右上の **`＜ Docs`** をクリックすると、ドキュメント・エクスプローラが表示されます。ここから、アセットタイプを検索し、スキーマを確認できます

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120110/4cc39801-9cc0-3734-ce0e-427c55679602.png)


# 3. GraphQLを使ってみよう

GraphQLを利用して、データを取得します。GraphQLで取得できるデータは **OCMのアセット・リポジトリに登録された公開済アセット**です。この条件に当てはまらないアセット（例:公開されていないアセット）は、GraphQLで取得できません

## 3.1 sampleNewsTypeで取得できるデータを確認する

[Oracle Content and Experience を Headless CMS として使ってみよう【初級編】 ](https://oracle-japan.github.io/ocitutorials/content-management/41_asset_headless/)で作成した`sampleNewsType`コンテンツタイプを利用します

1. ドキュメント・エクスプローラの検索ボックスに**sampleNewsType**と入力し、表示される`SampleNewsType`をクリックします

1. sampleNewsTypeのスキーマが確認できます。OCMの場合、アセット・タイプと同じ名前でGraphQLタイプで表示されます。また、アセットタイプのすべてのフィールド（属性）は、同じデータタイプを持つGraphQLフィールド（`fields`）で表されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120110/79777dac-98aa-608d-5680-978bdf41093f.png)

1. sampleNewsTypeスキーマの最下部の**sampleNewsTypeFields**をクリックします。チュートリアルで定義したフィールド（title, image, body）が確認できます
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120110/79093203-d884-0177-2d94-64e6d3ff2874.png)


## 3.2 GraphQLでデータを取得する

前の手順で確認したスキーマ定義（sampleNewsType）のデータを取得します。使用するクエリは、`getSampleNewsType`です。GraphQLでデータを取得する際には、取得するアセットの **id**（もしくは**slug**）と公開チャネルの**チャネルトークン（channelToken）**が必要です

### 3.2.1 アセットIDとチャネルトークンの確認
OCEのWebUIを開き、公開済のコンテンツアイテム **`sample news content 001`** のアセットIDおよび公開した**`sampleChannelのチャネルトークン`**を確認します
   
- アセットIDの確認:  
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120110/662d3c26-302c-b28b-8512-c683716a6827.png)
- 公開チャネルのチャネルトークン:
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120110/54957958-c749-836b-84f3-886d07046c54.png)

### 3.2.2 GraphQLでデータを取得する

**アセットID**と**チャネルトークン**を利用して、`sampleNewsType`のデータを取得します。取得時に利用するクエリは `getSampleNewsType()` です。実行例は以下の通りです

```graphql
{
  getSampleNewsType
  (
    id: "CORE5FD129FC39DD4F3097FC1223469BD7A7",
    channelToken: "1baae0944c004a7b90f203f962b6453e")
  {
    id
    name
    slug
  }
}
```

実行結果は以下の通りです。取得データとして指定した**id**, **name**, **slug**が取得できました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120110/345f0f7e-b9e8-460a-16d1-79d05a94917d.png)

なお、アセットIDの代わりに**slug（スラグ）**を引数として利用できます。slugを利用した場合も、同じ結果が取得できます
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120110/a2058f74-9049-93f8-a78e-70ace74effee.png)


### 3.2.3 属性情報を含むデータを取得する

sampleNewsTypeの属性情報を取得します。属性情報を取得する際は、**fields**に取得したい属性を追加します。ここでは fields に **title** と **body** を追加します

```graphql
{
  getSampleNewsType
  (
    id: "CORE5FD129FC39DD4F3097FC1223469BD7A7",
    channelToken: "1baae0944c004a7b90f203f962b6453e") 
  {
    id
    name
    slug
    fields
    {
      title
      body
    }
  }
}
```

実行結果は以下のとおりです。**title**と**body**の属性情報が取得できます
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120110/955e69cb-b8db-cf11-9a5b-038f991ecc6f.png)

### 3.2.4 参照アセット（画像アセット）を含む属性情報を取得する

sampleNewsTypeのimage属性は、**デジタル・アセット・タイプ=Image**として登録されたデジタル・アセットを参照します。ここでは、1回のクエリで参照アセットのデータをまとめて取得する方法を説明します

image 属性に登録されたデジタル・アセットへのリンクを取得する場合は、以下のように指定します

```graphql
{
  getSampleNewsType
  (
    id: "CORE5FD129FC39DD4F3097FC1223469BD7A7",
    channelToken: "1baae0944c004a7b90f203f962b6453e") 
  {
    id
    name
    slug
    fields
    {
      title
      body
      image
      {
        id
        name
        fields
        {
          file
          {
            url
          }
        }
      }
    }
  }
}
```
実行結果は以下のとおりです。image属性に指定されたアセットのid, name および画像アセットへのURLが取得できます
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120110/5393cbf2-b1ca-0dfc-a7f3-fe4610925352.png)

取得したURLにマウスカーソルをあわせると、画像ファイルがプレビューできます
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120110/a269ba47-b026-a66d-5f3d-b930f88a3022.png)

### 3.2.5 画像アセットのレンディションを含む属性情報を取得する

OCMにJPEG等の画像ファイルをリポジトリに登録すると、Large/Medium/Small/Thumbnailの**レンディション(rendition)**を自動生成します。
デジタル・アセットの特定のレンディション（ここではThumbnail）を取得する際は、以下のように実行します

```graphql
{
  getSampleNewsType
  (
    id: "CORE5FD129FC39DD4F3097FC1223469BD7A7",
    channelToken: "1baae0944c004a7b90f203f962b6453e") 
  {
    id
    name
    slug
    fields
    {
      title
      body
      image
      {
        id
        name
        fields
        {
          rendition(name:"Thumbnail", format:"jpg")
          {
            file
            {
              url
            }
          }
        }
      }
    }
  }
}
```

実行結果は以下のとおりです。取得レンディションで**Thumbnail**を指定したため、縮小版のデジタル・アセットが取得できました
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120110/da00eff8-e5f7-4e7e-6532-1f798fb34260.png)


# 4. まとめ

この記事では、GraphQL で Oracle Content Management のデータを取得する方法を紹介しました。必要なデータだけを簡単に取得できることを確認できました。

なお、以下の製品ドキュメントにて詳しく説明されています。あわせてご確認いただければ幸いです

- [GraphQL Support in Oracle Content Management](https://docs.oracle.com/en/cloud/paas/content-cloud/solutions/graphql-support-oracle-content-management.html#GUID-E7B5E5E6-94B3-41BC-A1E7-6EB8327A3D25)

# （参考）OCMの製品ドキュメント

- [Oracle Content Management 製品ドキュメント（英語）](https://docs.oracle.com/en/cloud/paas/content-cloud/books.html)
- [Oracle Content Management 製品ドキュメント（日本語翻訳版）](https://docs.oracle.com/cloud/help/ja/content-cloud/index.htm)  
`製品ドキュメントの英語原本と日本語翻訳版です。翻訳されるまでに時差がありますので、最新情報の確認は 英語版のドキュメントをご利用ください`