非同期呼び出しとキャッシュの理解

概要

商品リスト レンダリングと比較した場合の、AJAX 呼び出しとキャッシュに関する Commerce 検索結果レンダリングの利点。

Commerce 検索結果レンダリングは、商品リスト レンダリングとは異なる方法で非同期呼び出しとキャッシュを処理します。使用するレンダリングについて情報に基づいた決定を下せるように、違いを理解することが重要です。

注記

柔軟性が最も高いため、Commerce 検索結果レンダリングを使用することをお勧めします。

Commerce 検索結果レンダリングは、標準の SXA 検索結果レンダリングを拡張したものです。SXA 検索結果レンダリングは SXA Search サービスを使用して AJAX 呼び出しを行い、インデックスをクエリし、レンダリングするアイテムのリストを取得します。結果のアイテムは、設定済みのレンダリング バリアントによってサーバー側で処理され、その結果が HTML マークアップとして返されます。

ProcessSearchItems パイプラインは、SXA Search サービスの拡張ポイントです。設定されたスコープ クエリから返されたアイテムを処理し、設定されたレンダリング バリアントがさらに処理する前に、関連するモデルにデータを入力します。このパイプラインを拡張して、Sitecore アイテムとオブジェクト型のカスタムモデルを含む SearchItem パイプライン引数に値を入力できます。ProcessSearchItems パイプラインは、PrepareSearchItems という名前のコマース プロセッサーで拡張されます。このプロセッサーは、Commerce Engine から価格と在庫の情報を取得して、このデータを ProductSummaryViewModel に変換します。このモデルには、Commerce 検索結果 Scriban テンプレートから o_model 変数を使用して アクセスし、コンテンツをレンダリングします。プロセッサーがデータを実行して取得するかどうかは、構成と設定によって異なります。

ストアフロント設定 (/sitecore/Content/<tenant>/<site>/Settings/Commerce/Search Results Configuration) で、Commerce 検索結果レンダリングで使用される呼び出しと、いつ実行されるかを設定できます。[別の AJAX 呼び出しを使用して価格と在庫情報を取得する] チェック ボックスは、デフォルトではオフであり、レンダリングは 1 回の呼び出しを行います。

この呼び出しの一部として、コマースProcessSearchItems プロセッサーが実行して、価格と在庫のデータを取得します。このデータは、レンダリング バリアントが処理されるときに価格と在庫情報を出力するために、Scriban テンプレートで使用されます。

Content Delivery Network (CDN) を使用していない場合、パフォーマンスの観点から、1 つの呼び出しを使用するのが最も効率的な構成です。これは、マークアップと価格および在庫情報を取得するために、クライアント ブラウザーから AJAX 呼び出しが 1 回だけ行われるためです。ただし、CDN を使用している場合は、価格および在庫情報もキャッシュすることに注意してください。価格と在庫は商品情報よりも頻繁に変更される傾向があるため、これは望ましくない場合があります。

注記

商品や価格カードで直接価格を変更したり、CDN を使用してすでにキャッシュされている特定の商品のプロモーションを追加したりするときに、CDN キャッシュを XC から強制的にクリアする方法はありません。これは、個別に行うか、カスタム スクリプトの一部として、またはビジネス ツールとのカスタム統合として行う必要があります。このため、CDN を使用している場合は、2 つの AJAX 呼び出しを使用することをお勧めします。

[別の AJAX 呼び出しを使用して価格と在庫情報を取得する] チェック ボックスをオンにした場合、Commerce 検索結果レンダリングは、カタログ アイテムのリストをレンダリングするときに、2 つの非同期の JavaScript および AJAX 呼び出しを行います。

  • 最初の呼び出しは、インデックスをクエリして、レンダリングするアイテムのリストを取得します。Commerce 検索結果レンダリングは、SXA Search Service を呼び出し、これは、アイテムを HTML マークアップとして返し、レンダリング バリアントによってサーバー側で処理されます。コマース ProcessSearchItems プロセッサーは、価格と在庫のデータを取得したり、ProductSummaryViewModel に値を入力したりするために、Commerce Engine を呼び出しません。変動する価格およびステータス データがなく、カタログ アイテムのリストと製品コンテンツが比較的安定しているため、CDN を使用する場合は、この呼び出しを適切な有効期限でキャッシュすることをお勧めします。

  • 2 回目の呼び出しは、コマース固有です。これは、カタログ アイテムのリストのマークアップを取得した後に発生し、Commerce Engine に対して行われて、商品のリストの価格および在庫情報を取得します。データは JSON 形式で返されます。

    注記

    価格および在庫情報は頻繁に変更される可能性があるため、この呼び出しをキャッシュすることはお勧めしません。

    クエリ パラメーターの 1 つである商品 ID のリストは、最初の呼び出しから取得した応答データに依存しているため、この呼び出しを最初の呼び出しと並行して行うことはできません。この呼び出しは、商品 ID のリストに値が入力され、空でなくなった場合にのみ行われます。価格および在庫情報を受信すると、Knockout JS バインディングを使用してマークアップにバインドされ、それに応じて更新されます。価格および在庫情報は price および stockLabel 属性にそれぞれバインドされます。2 番目の呼び出しの JavaScript コードは、/sitecore/Media library/Base Themes/Commerce Components Theme/Scripts/Catalog/catalog-commerce-search-results-model/ に保存されている catalog-commerce-search-results-model にあります。

最初の呼び出し - SXA Search Service AJAX 呼び出し

完全 URL: http://[host name]/sxa/commercesearch/CommerceResults/?usedam= [use images from DAM]&l=[language]&amp;s=[scope]&amp;itemid=[current item id]&amp; sig=[search result signature]&amp;p=[page size]&amp;o=[sort order]&amp;v=[rendering variant id]

例: http://mqa-ts-02-dk1//sxa/commercesearch/CommerceResults/?usedam=true&l=en&amp; s={9DCE2EF2-EE0C-4C02-B2ED-A8769FC08C3B}&amp; itemid={994EC8CB-FE90-5071-A631-4458B1E83DB3}&amp; sig=category-page&amp; p=12&amp; o=Display name,Ascending&amp; v={175DC0A7-7214-450A-8765-688D62A551D1}

Http メソッド: GET

次の表に、この呼び出しで使用されるパラメーターの詳細を示します。

パラメーター

用途

usedam

DAM から (true に設定されている場合)、またはメディア ライブラリから (false に設定されている場合)、画像リンクを取得するかどうかを示す設定パラメーター。

l

結果の言語バージョンを指定します。

s

結果のフィルタリングに使用されるスコープ アイテムを指定します。

itemid

現在のコンテキスト アイテム ID。

sig

Commerce 検索結果シグネチャー。

p

ページ サイズ。

o

特定のフィールドの結果の昇順または降順。

v

バリアント定義 ID。

2 番目の呼び出し - GetSellableItemsSummary AJAX 呼び出し

完全 URL: https://[host name]/api/cxa/Catalog/GetSellableItemsSummary?sc_site=[site name]

例: https://mqa-ts-02-dk1/api/cxa/Catalog/GetSellableItemsSummary?sc_site=Storefront

Http メソッド: POST

次の表に、この呼び出しで使用されるパラメーターの詳細を示します。

パラメーター

用途

itemIds

商品 ID と商品リストのカタログ名を指定します。

例: Habitat_Master|6042976|

includeBundledItems

結果にバンドル アイテムを含めます。

例: true

商品リスト レンダリングでは、AJAX 呼び出しが 1 回だけ行われます。この呼び出しは、商品情報と価格および在庫情報の両方を取得し、Knockout JS を使用して HTML マークアップにバインドされた JSON として返します。商品リスト レンダリングには、AJAX 呼び出しキャッシュのサポートが組み込まれていて、CD インスタンス レベルで処理されます。

プロモーション商品レンダリングは、商品リスト レンダリングと同様ですが、商品リストの取得方法が異なり、組み込みの AJAX 呼び出しキャッシュをサポートしません。

注記

どちらのレンダリングも、Content Delivery Network (CDN) を使用しているときには AJAX 呼び出しキャッシュをサポートして、それに付属する分散および地域の場所キャッシュ機能を利用します。CDN キャッシュは、静的リソースがユーザーにとってよりローカルなサーバーに格納されるため、組み込みキャッシュより優れています。AJAX 呼び出しのキャッシュをオンにすると、コンテンツと価格および在庫情報の両方がキャッシュされます。このため、価格および在庫情報の取得とは別に商品コンテンツをキャッシュできる Commerce 検索結果レンダリングよりも柔軟性が低くなります。

GetProductList Ajax 呼び出し

GetProductList Ajax 呼び出しは、インデックスをクエリし、レンダリングするアイテムのリストと、商品リストの価格および在庫情報を JSON 形式で取得します。呼び出しは、コマース コンポーネント レイヤーに対して行われます。

完全 URL: http://[host name]/api/cxa/catalog/GetProductList?sc_site=[site name]

: http://mqa-ts-02-dk1/api/cxa/catalog/GetProductList?sc_site=Storefront

Http メソッド: POST

次の表に、この呼び出しで使用されるパラメーターの詳細を示します。

パラメーター

用途

pg

ページを指定します。

ps

ページ サイズを指定します。

sd

並べ替えの方向 (昇順/降順)。

cci

キャッシュ キーの作成に使用される現在のコンテキスト アイテム ID。

ci

現在のカタログ カテゴリー アイテム。