Rendering delle offerte HTML senza selettori
Utilizza questo modello quando le proposte includono contenuto HTML, ma devi specificare dove applicarlo (selettore) e come applicarlo (tipo di azione). Per eseguire questa operazione, chiamare applyPropositions con un oggetto metadata impostato dall'ambito. I valori actionType supportati sono setHtml, replaceHtml e appendHtml.
1. Gestire la visualizzazione momentanea di altri contenuti (facoltativo)
Se nascondi il contenuto durante il rendering, sei tenuto a rivelarlo al termine del rendering. Per ulteriori informazioni, vedere Gestione visualizzazione momentanea di altri contenuti.
2. Richiedere le proposte per gli ambiti che si intende presentare
alloy("sendEvent", {
personalization: {
decisionScopes: ["discount", "salutation"]
},
xdm: { }
}).then(({ propositions = [] }) => {
// Render in the next step
});
Per ulteriori informazioni, vedere personalization.decisionScopes.
3. Eseguire il rendering delle offerte con applyPropositions metadati
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. Registrazione degli eventi di visualizzazione per le proposte sottoposte a rendering
Gli eventi di visualizzazione non vengono inviati automaticamente quando si chiama applyPropositions. Al termine del rendering, utilizza una chiamata sendEvent che fa riferimento alle proposte sottoposte a rendering:
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 }
}
}
}
});
});
});
Per ulteriori informazioni, vedere Gestione eventi di visualizzazione.
sendEvent inferiore.5. Nuova rappresentazione
Se l'implementazione richiede un nuovo rendering in un secondo momento (ad esempio nelle applicazioni a pagina singola), chiamare nuovamente applyPropositions con le stesse proposte e gli stessi metadati:
alloy("applyPropositions", {
propositions,
metadata: {
discount: { selector: "#daily-special", actionType: "replaceHtml" }
}
});
Se devi registrare un evento di visualizzazione per quel rendering, vedi Gestione eventi di visualizzazione.