Administrar eventos de visualización en Web SDK

Los eventos de visualización indican a los servicios de personalización o análisis que se ha mostrado un fragmento específico de contenido personalizado al usuario. El envío de eventos de visualización mejora la precisión de los informes al ayudar a los sistemas descendentes a distinguir entre el contenido solicitado y el contenido mostrado.

Enviar eventos de visualización automáticamente

Los eventos de visualización automática suelen ser la opción más sencilla. Se envían inmediatamente después de que Web SDK termine de procesar el contenido apto de la respuesta sendEvent, lo que puede mejorar la precisión de la creación de informes.

Para enviar eventos de visualización automáticamente, use una llamada de sendEvent que establezca renderDecisions en true y personalization.sendDisplayEvent en true (o omita esta acción, ya que true es la opción predeterminada):

alloy("sendEvent", {
  renderDecisions: true,
  personalization: { }, // sendDisplayEvent defaults to true
  xdm: {
    web: {
      webPageDetails: {
        name: "home"
      }
    }
  }
});

Enviar eventos de visualización en llamadas a sendEvent subsiguientes

Incluir eventos de visualización en una llamada posterior a sendEvent resulta útil cuando desea adjuntar datos de carga de página adicionales que no están disponibles al solicitar la personalización. Se utiliza comúnmente al implementar eventos de página superior e inferior. La implementación correcta de los eventos de visualización de esta manera ayuda a evitar problemas con la tasa de salida hacia otro sitio en Adobe Analytics.

Envío de eventos de visualización para propuestas procesadas manualmente

Si procesa el contenido usted mismo (ya sea de forma completamente manual o mediante applyPropositions), debe enviar eventos de visualización explícitamente mediante el comando sendEvent. Llame a sendEvent con una carga útil XDM que incluya las siguientes propiedades:

Los dos ejemplos siguientes utilizan esta función de ayuda para crear la carga útil XDM de evento de visualización:

function buildDisplayEventXdm(renderedPropositions) {
  return {
    eventType: "decisioning.propositionDisplay",
    _experience: {
      decisioning: {
        propositions: renderedPropositions.map(({ id, scope, scopeDetails }) => ({
          id,
          scope,
          scopeDetails
        })),
        propositionEventType: { display: 1 }
      }
    }
  };
}

El siguiente ejemplo utiliza el procesamiento manual con eventos de visualización:

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) });
});

El ejemplo siguiente utiliza el comando applyPropositions con eventos de visualización. Encadena a sendEvent, applyPropositions y después a otro 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) });
});

Errores comunes que se deben evitar