[PaaSのみ]{class="badge informative" title="Adobe Commerce on Cloud プロジェクト（Adobeで管理されるPaaS インフラストラクチャ）とオンプレミス プロジェクトにのみ適用されます。"}

ヘッドレスストアフロントの統合

CommerceAdapter モジュールは、Adobe Commerceを拡張して、ヘッドレスストアフロントとAdobe Commerce Optimizerのギャップを埋めます。 お客様の価格表のコンテキストを解決するためのGraphQL クエリを提供し、Adobe Commerce Optimizer GraphQL APIで想定されるバンドル製品エンコーディングを適用します。

上位レベルのストアフロントの設定手順については、Adobe Commerce Optimizer Connector概要の​ マーチャンダイジングとストアフロントの設定を参照してください。

GraphQL: commerceOptimizer クエリ graphql-commerceoptimizer-query

ヘッドレスストアフロントは、commerceOptimizer GraphQL クエリを呼び出して、現在のカスタマーセッションのpriceBookIdを取得します。 価格を取得する際に、この値をAdobe Commerce Optimizer GraphQL APIに渡します。

{
  commerceOptimizer {
    priceBookId
  }
}

応答の例：

{
  "data": {
    "commerceOptimizer": {
      "priceBookId": "base::a94a8fe5ccb19ba61c4c0873d391e987982fbbd3"
    }
  }
}

priceBookIdの解決方法：

Store リクエストヘッダーは、web サイトのスコープとwebsiteCode コンポーネントを決定します。 sha1(customerGroupId) コンポーネントは、データの同期中に使用された価格表ID式と一致します。 価格表を参照してください。

バンドル製品：カートに追加する形式 bundle-products-add-to-cart-format

選択した各バンドルオプションのSKUとqtyのみを含むヘッドレスストアフロントから、買い物客がカートにバンドル製品を追加できるようにします。

選択または入力された各オプション値は、次の形式でbase64 エンコードされている必要があります。

base64("bundle_item/" + JSON.stringify({"sku": "<child_sku>", "qty": "<qty>"}))

同じ子SKUは、すべてのオプションで1回のみ表示されます。

例（JavaScript）:

const encodedOption = btoa(
  'bundle_item/' + JSON.stringify({ sku: 'child-product-sku', qty: '1' })
);