👋

XM Cloud を試す（書きかけです）

2022/12/19に公開

Sitecore

tech

XM Cloud 側の操作

プロジェクトを作成

環境を作成

Siteを作成

ローカルの操作

.NET SDK 6 をインストール

.NET SDK 6 が必要。2022/11/30 時点では .NET SDK 7 はサポートしていない。
Windows 10 以上の場合、以下コマンドでインストール

winget install Microsoft.DotNet.SDK.6

GitHub からソースを clone

Sitecore CLI をインストール

dotnet tool restore
dotnet sitecore cloud login

Edge access token を取得

dotnet sitecore cloud project list
dotnet sitecore cloud environment list --project-id <project-id>
.\New-EdgeToken.ps1 -EnvironmentId <environment-id>

動作確認

先の実行結果を HTTP Header に入力し、以下クエリーを実行

query {
  layout(language: "en", routePath: "/", site: "<your-site-name>") {
    item {
      rendered
    }
  }
  site {
    siteInfoCollection {
      name
      routes(first: 10, language: "en") {
        results {
          routePath
          route {
            id
          }
        }
      }
    }
  }
}

実行例

Sitecore CLI と XM Cloud の環境を接続

dotnet sitecore cloud environment connect --environment-id <environment-id>

ローカル環境の Next.js アプリを XM Cloud と接続して起動する

src/sxastarter の .env を .env.local にコピーする。

.env.local の次の項目を編集

SITECORE_API_KEY
- https://doc.sitecore.com/xmc/en/developers/xm-cloud/generate-an-edge-access-token.html で取得したトークンを記述
GRAPH_QL_ENDPOINT
- https://edge.sitecorecloud.io/api/graphql/v1
JSS_APP_NAME
- 作成したサイト名
NEXT_PUBLIC_CDP_TARGET_URL
- 必須項目。無いとエラーになります。ダミーで以下でも良いです
- https://api-engage-ap.sitecorecloud.io
NEXT_PUBLIC_CDP_CLIENT_KEY
- 必須項目。無いとエラーになります。ダミーで以下でも良いです
- pqsPERS3lw12v5a9rrHPW1c4hET73GxQ
NEXT_PUBLIC_CDP_POINTOFSALE
- 必須項目。無いとエラーになります。ダミーで以下でも良いです
- {"en": "example.com", "da": "example.com/da"}

src/sxastarter ディレクトリで次のコマンドを実行する

npm install
npm run start:connected

http://localhost:3000/ で確認。