Web SDKでの表示イベントの管理
表示イベントは、パーソナライズされた特定のコンテンツがユーザーに表示されたことをパーソナライゼーションまたは分析サービスに知らせます。 表示イベントを送信すると、ダウンストリームシステムが、リクエストされた コンテンツと 実際に表示された コンテンツを区別できるので、レポートの精度が向上します。
表示イベントの自動送信
自動表示イベントは、通常、最も簡単なオプションです。 これらは、Web SDKが sendEvent 応答から適格なコンテンツのレンダリングを完了した直後に送信されるので、レポートの精度を向上させることができます。
表示イベントを自動的に送信するには、sendEvent を renderDecisions に設定し、true を personalization.sendDisplayEvent に設定する true 呼び出しを使用します（true がデフォルトなので、省略します）。
alloy("sendEvent", {
renderDecisions: true,
personalization: { }, // sendDisplayEvent defaults to true
xdm: {
web: {
webPageDetails: {
name: "home"
}
}
}
});
applyPropositions を使用する場合を含む）、sendEvent を使用して表示イベントを明示的に送信する必要があります。後続の sendEvent 呼び出しで表示イベントを送信
後の sendEvent 呼び出しに表示イベントを含めると、パーソナライゼーションのリクエスト時には利用できない追加のページ読み込みデータを添付する場合に役立ちます。 一般的に、 上位および下位のページイベント を実装する際に使用されます。 この方法でディスプレイイベントを正しく実装すると、Adobe Analyticsの バウンス率 に関する問題を回避できます。
-
最初の
sendEvent呼び出し（多くの場合、ページの上部）で、コンテンツをリクエストしてレンダリングしますが、renderDecisionsをtrueに、personalization.sendDisplayEventをfalseに設定すると、自動表示イベントが抑制されます。code language-js alloy("sendEvent", { renderDecisions: true, personalization: { sendDisplayEvent: false }, xdm: { web: { webPageDetails: { name: "home" } } } }); -
後で（多くの場合、ページの下部で）、
sendEventをpersonalization.includeRenderedPropositionsに設定して、前のリクエスト以降にレンダリングされた提案の表示イベントを含む XDM ペイロードでtrueを呼び出します。code language-js alloy("sendEvent", { personalization: { includeRenderedPropositions: true }, xdm: { // Add any additional page load telemetry you want to send here web: { webPageDetails: { name: "home" } } } });
includeRenderedPropositions の使用時には、表示が抑制された、自動的にレンダリングされた提案のみが含まれます。手動でレンダリングされた提案の表示イベントを送信
コンテンツを自分でレンダリングする場合（完全に手動でレンダリングするか、applyPropositions を使用する場合）、sendEvent コマンドを使用して表示イベントを明示的に送信する必要があります。 次のプロパティを含む XDM ペイロードを使用して sendEvent を呼び出します。
- レンダリングされた提案の
_experience.decisioning.propositions、idおよびscopeを含むscopeDetails _experience.decisioning.propositionEventType.displayを1に設定
次の 2 つの例では、このヘルパー関数を使用して、表示イベント XDM ペイロードを作成します。
function buildDisplayEventXdm(renderedPropositions) {
return {
eventType: "decisioning.propositionDisplay",
_experience: {
decisioning: {
propositions: renderedPropositions.map(({ id, scope, scopeDetails }) => ({
id,
scope,
scopeDetails
})),
propositionEventType: { display: 1 }
}
}
};
}
次の例では、表示イベントで手動レンダリングを使用しています。
function renderExample(propositions) {
// Your custom logic here. Return ONLY the propositions that were actually rendered.
// For example: return [propositions[0]];
return [];
}
alloy("sendEvent", {
personalization: { decisionScopes: ["discount"] },
xdm: { }
}).then(({ propositions = [] }) => {
const renderedPropositions = renderExample(propositions);
if (!renderedPropositions.length) { return; }
return alloy("sendEvent", { xdm: buildDisplayEventXdm(renderedPropositions) });
});
次の例では、applyPropositions コマンドを表示イベントと共に使用します。 sendEvent、applyPropositions と連結され、次に別の sendEvent が連結されます。
alloy("sendEvent", {
personalization: { decisionScopes: ["discount", "salutation"] },
xdm: { }
}).then(({ propositions = [] }) => {
return alloy("applyPropositions", {
propositions,
metadata: {
salutation: { selector: "#salutation", actionType: "setHtml" },
discount: { selector: "#daily-special", actionType: "replaceHtml" }
}
});
}).then(({ propositions: renderedPropositions = [] }) => {
if (!renderedPropositions.length) { return; }
return alloy("sendEvent", { xdm: buildDisplayEventXdm(renderedPropositions) });
});
よく避けるべき間違い
- レンダリングが完了する前に表示イベントを送信：自動レンダリングが完了した後、
applyPropositionsが解決した後、または手動レンダリングロジックが完了した後に表示イベントを送信します。 - レンダリングしなかった提案の表示イベントを送信：実際にユーザーに表示された提案のみを含めます。
scopeDetailsのドロップ：表示イベントを送信する際に、提案オブジェクトからscopeDetailsを含めます。