CMS SDKのインストール

CMS SDKは、OrizmのCMS機能をWebサイトに組み込むためのJavaScriptライブラリです。このガイドでは、インストール手順とクライアントセットアップの方法を説明します。

CMS SDKとは

CMS SDKは @orizm/cms-sdk というパッケージ名でNPMレジストリから配布されているJavaScriptライブラリです。

インストール手順

以下のコマンドでCMS SDKをインストールします：

pnpm add @orizm/cms-sdk @orizm/common

クライアントのセットアップ

CMS SDKを使用するには、環境に応じたクライアントのセットアップが必要です。CMSClient はスキーマの適用時に自動生成されます。

サーバーサイドの設定(ユーザーセッション)

サーバー側で使用するクライアントは、NextAuthのセッションを使用して以下のように設定します：

import { OrizmNextAuthCMSClient } from "@orizm/cms-sdk/next-auth";
import { CMSClient } from "@repo/orizm/cms";
import { getServerSession } from "next-auth";
import { authOptions } from "../auth/auth-options";
 
const client = new CMSClient(
  new OrizmNextAuthCMSClient(
    {
      projectName: process.env.NEXT_PUBLIC_ORIZM_PROJECT,
      baseURL: process.env.NEXT_PUBLIC_ORIZM_BASE_URL,
    },
    async () => await getServerSession(authOptions),
  ),
);

認証設定について詳しくは、CMS SDKの認証のページを参照してください。

サーバーサイドの設定(Management API Key)

Management API Keyの設定

以下の手順で取得し設定します：

開発者コンソールにログインする
プロジェクトのトップページを開く
Settingsメニューに移動する
API Keys から Management API Keysを選択する
Description of the key を入力し、Generateボタンをクリックする
生成された Management API Keyをコピーする
環境変数ORIZM_API_KEYに値を設定する

クライアントの設定

import { OrizmCMSClient_ManagementKey } from "@orizm/cms-sdk";
import { CMSClient } from "@repo/orizm/cms";
 
const client = new CMSClient(
  new OrizmCMSClient_ManagementKey({
    projectName: process.env.NEXT_PUBLIC_ORIZM_PROJECT,
    baseURL: process.env.NEXT_PUBLIC_ORIZM_BASE_URL,
    managementKey: process.env.ORIZM_API_KEY,
  }),
);

クライアントサイドの設定

ブラウザ側で使用するクライアントは、以下のように設定します：

import { OrizmNextAuthCMSClient } from "@orizm/cms-sdk/next-auth";
import { CMSClient } from "@repo/orizm/cms";
 
const client = new CMSClient(
  new OrizmNextAuthCMSClient(
    {
      projectName: process.env.NEXT_PUBLIC_ORIZM_PROJECT,
      baseURL: process.env.NEXT_PUBLIC_ORIZM_BASE_URL,
    },
    async () => getSession(),
  ),
);

これで、CMS SDKのセットアップは完了です。

プロパティエディター認証