レンダリングの通信
このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。
Commerce Foundation レイヤーは、ストアフロント ページのレンダリングがページ上の他のレンダリングと通信できるようにするメカニズムを提供します。このトピックでは、現在のバージョンの SXA Storefront でのレンダリングの通信方法と、バージョン 10.0 以前の Sitecore XC でのレンダリングの通信方法について説明します。
レンダリングの通信 - 現在
現在の実装には、ProductEventHandler と呼ばれる CXAObservable が含まれています。これは、メッセージングを合理化し、スケーラビリティを向上させるために導入されました。この Observable は、レンダリングと CXAObservable 間の出力とサブスクリプションを管理します。CXAObservable サービスを導入するということは、1 つのブローカー、1 つのコンテキスト、および 1 つのキューが存在するようになるということです。次の図は、レンダリングが CXAObservable を介して通信する方法の例です。
この図は単なる例であり、CXAObservable を介して通信するすべてのレンダリングが含まれているわけではありません。詳細については、「Scriban テンプレートの操作」を参照してください。
次の例では、買い物客は商品詳細ページにアクセスして、カートにアイテムを追加します。次の通信が発生します。
-
買い物客がバリアントを選択すると、商品バリアント レンダリングは CXAObservable にメッセージを送信します。
-
CXAObservable は、商品選択イベントをサブスクライブする次の 4 つのレンダリングに通知します。
-
商品価格レンダリングは、選択したバリアントの価格を反映するように価格を更新します。
-
商品在庫レンダリングは、現在の在庫状況と在庫数を更新します。
-
カートに追加レンダリングは、選択されたバリアントを認識し、買い物客が [カートに追加] をクリックするとすぐにその商品をショッピング カートに追加できる状態になっています。
-
商品画像レンダリングは、選択したバリアントに一致するようにヒーロー画像を更新します。
-
-
カートに追加レンダリングは、買い物客が [カートに追加] をクリックしたときに CXAObservable にメッセージを送信します。カートに追加レンダリングは、カート数を Ajax Service ブローカーに渡し、Ajax Service ブローカーは、CXAObservable を介してミニカート レンダリングにカート数を渡します。エラーが発生した場合、CXAObservable は メッセージ ブローカーにメッセージを送信し、メッセージ ブローカーは、メッセージ概要レンダリング (メッセージング イベントをサブスクライブする唯一のレンダリング) に通知します。
-
CXAObservable は、ミニカート レンダリング (カート イベントをサブスクライブする唯一のレンダリング) に通知します。
-
ミニカート レンダリングはカートの内容を更新し、表示されるカート数を増やします。
-
メッセージ概要レンダリングは、ユーザーフレンドリなメッセージを買い物客に出力します。
-
後方互換性のために、既存のイベントは引き続きレンダリングによって出力されますが、デフォルトでは現在のレンダリング通信を使用して処理されます。
レンダリングの通信 - 更新前
レンダリング通信の以前の実装 (現在でもまだサポートされている) では、ページ上の各レンダリングは、ブローカーを介してページ上の他のレンダリングと通信します。本質的に、レンダリングはブローカーに登録され、メッセージはレンダリング間で渡されます。
次の例では、買い物客は商品詳細ページにアクセスして、カートにアイテムを追加します。これにより、次の通信が発生します。
-
買い物客がバリアントを選択すると、商品バリアント レンダリングは商品選択ブローカー サービスにメッセージを送信します。
-
商品選択ブローカー サービスは、商品選択イベントをサブスクライブする次の 4 つのレンダリングに通知します。
-
商品価格レンダリングは、選択したバリアントの価格を反映するように価格を更新します。
-
商品在庫レンダリングは、現在の在庫状況と在庫数を更新します。
-
カートに追加レンダリングは、選択されたバリアントを認識し、買い物客が [カートに追加] をクリックするとすぐにその商品をショッピング カートに追加できる状態になっています。
-
商品画像レンダリングは、選択したバリアントに一致するようにヒーロー画像を更新します。
-
-
カートに追加レンダリングは、買い物客が [カートに追加] をクリックしたときにカート ブローカー サービスにメッセージを送信します。
-
カート ブローカーは、ミニカート レンダリング (カート イベントをサブスクライブする唯一のレンダリング) に通知します。
-
ミニカート レンダリングは、Ajax サービスを使用して Commerce Engine を呼び出し、その結果に基づいてカートの内容を更新し、表示されるカート数を増やします。エラーが発生した場合、これがメッセージ ブローカーにメッセージを送信し、メッセージ ブローカーはメッセージ概要レンダリング (メッセージング イベントをサブスクライブする唯一のレンダリング) に通知します。
-
メッセージ概要レンダリングは、ユーザーフレンドリなメッセージを買い物客に出力します。
-
合計 5 つのブローカー サービスがあります。この例では、そのうちの 4 つを使用します。
-
カート ブローカー - 買い物客のカートへの追加要求からメッセージ (または発生したイベント) を受信し、そのメッセージをサブスクライバーであるミニカート レンダリングに転送します。
-
メッセージ ブローカー - ミニカート レンダリングからメッセージを受信し、メッセージまたはエラーをサブスクライバーであるメッセージ概要レンダリングに転送します。
-
Ajax サービス ブローカー - ミニカート レンダリングからメッセージを受信し、そのメッセージを AJAX 呼び出しとして Commerce Engine に転送して、メッセージまたは要求を検証します。
-
商品選択ブローカー - 買い物客の商品選択からメッセージを受信し、そのメッセージをサブスクライバー (商品画像レンダリング、商品価格レンダリング、商品在庫レンダリング、カートへの追加レンダリング) に転送します。これらのサブスクライバーは、買い物客が [カートに追加] をクリックしたときに、表示する商品の画像、価格、在庫、およびミニカートに追加する商品の詳細を知るためのメッセージを必要とします。