Procesar ofertas de HTML sin selectores

Utilice este patrón cuando las propuestas incluyan contenido de HTML, pero debe proporcionar dónde aplicarlo (selector) y cómo aplicarlo (tipo de acción). Puede hacerlo llamando a applyPropositions con un objeto metadata escrito por el ámbito. actionType valores admitidos son setHtml, replaceHtml y appendHtml.

​1. Administrar el parpadeo (opcional)

Si oculta contenido durante el procesamiento, es usted el responsable de mostrarlo una vez finalizado el procesamiento. Consulte Administrar parpadeo para obtener más información.

​2. Solicite propuestas para los ámbitos que desea procesar

alloy("sendEvent", {
  personalization: {
    decisionScopes: ["discount", "salutation"]
  },
  xdm: { }
}).then(({ propositions = [] }) => {
  // Render in the next step
});

Consulte personalization.decisionScopes para obtener más información.

​3. Procesar ofertas con applyPropositions metadatos

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 = [] }) => {
    return { renderedPropositions };
  });
});

​4. Registre eventos de visualización para propuestas procesadas

Los eventos de visualización no se envían automáticamente al llamar a applyPropositions. Una vez finalizado el procesamiento, utilice una llamada a sendEvent que haga referencia a las propuestas procesadas:

function toDisplayPayload(propositions) {
  return propositions.map((p) => ({
    id: p.id,
    scope: p.scope,
    scopeDetails: p.scopeDetails
  }));
}

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 = [] }) => {
    return alloy("sendEvent", {
      xdm: {
        _experience: {
          decisioning: {
            propositions: toDisplayPayload(renderedPropositions),
            propositionEventType: { display: 1 }
          }
        }
      }
    });
  });
});

Consulte Administrar eventos de visualización para obtener más información.

TIP
Si usa eventos de página superior e inferior, esta llamada de "visualización de registros" se implementa comúnmente en la llamada inferior sendEvent.

​5. Nueva renderización

Si su implementación requiere que se vuelva a procesar más adelante (por ejemplo, en aplicaciones de una sola página), vuelva a llamar a applyPropositions con las mismas propuestas y metadatos:

alloy("applyPropositions", {
  propositions,
  metadata: {
    discount: { selector: "#daily-special", actionType: "replaceHtml" }
  }
});

Si necesita registrar un evento de visualización para ese nuevo procesamiento, consulte Administrar eventos de visualización.

recommendation-more-help
1ae86b30-e55e-49c1-ab11-9d0356a5f3e1