DocumentationExperience PlatformCollecte de données

Rendu des offres HTML sans sélecteurs

Last update: Fri Feb 13 2026 00:00:00 GMT+0000 (Coordinated Universal Time)

Créé pour :

  • Développeur

Utilisez ce modèle lorsque vos propositions incluent du contenu HTML, mais que vous devez indiquer où l’appliquer (sélecteur) et comment l’appliquer (type d’action). Pour ce faire, appelez applyPropositions avec un objet metadata indexé par la portée. Les valeurs actionType prises en charge sont setHtml, replaceHtml et appendHtml.

​1. Gestion du scintillement (facultatif)

Si vous masquez le contenu lors du rendu, vous êtes responsable de sa révélation une fois le rendu terminé. Voir Gérer le scintillement pour plus d’informations.

​2. Propositions de requête pour les portées que vous avez l’intention de rendre

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

Voir personalization.decisionScopes pour plus d’informations.

​3. Rendu des offres avec des métadonnées applyPropositions

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. Enregistrer les événements d’affichage pour les propositions rendues

Les événements d’affichage ne sont pas automatiquement envoyés lors de l’appel de applyPropositions. Une fois le rendu terminé, utilisez un appel sendEvent qui référence les propositions rendues :

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

Voir Gérer les événements d’affichage pour plus d’informations.

TIP
Si vous utilisez des événements Page supérieure et page inférieure, cet appel d’« affichage des enregistrements » est généralement implémenté dans l’appel d’sendEvent inférieure.

​5. Rendu

Si votre implémentation nécessite un nouveau rendu ultérieurement (par exemple dans les applications monopages), appelez-applyPropositions de nouveau avec les mêmes propositions et métadonnées :

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

Si vous devez enregistrer un événement d’affichage pour ce nouveau rendu, voir Gérer les événements d’affichage.

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