Comparar la biblioteca at.js con Adobe Experience Platform Web SDK
Información general
Este artículo proporciona información general sobre las diferencias entre la biblioteca at.js
y Experience Platform Web SDK.
Instalación de las bibliotecas
Instalación de at.js
Adobe permite que los clientes descarguen la biblioteca directamente desde la ficha Adobe Experience Cloud, Implementation. La biblioteca at.js se personaliza con opciones que el cliente tiene como: clientCode, imsOrgId, etc.
Instalación de Web SDK
La versión prediseñada está disponible en una CDN. Puede hacer referencia a la biblioteca en la CDN directamente en la página o descargarla y alojarla en su propia infraestructura. Está disponible en formatos minificado y no minificado. La versión no minificada es útil para la depuración.
Consulte Instalar Web SDK mediante la biblioteca JavaScript para obtener más información.
Configuración de las bibliotecas
Configuración de at.js
Al final de cada archivo at.js, verá una sección en la que Adobe crea una instancia y pasa un objeto de configuración. Se puede personalizar; en el momento de la descarga, Adobe rellena esa sección con la configuración actual del cliente.
window.adobe.target.init(window, document, {
"clientCode": "demo",
"imsOrgId": "",
"serverDomain": "localhost:5000",
"timeout": 2000,
"globalMboxName": "target-global-mbox",
"version": "2.0.0",
"defaultContentHiddenStyle": "visibility: hidden;",
"defaultContentVisibleStyle": "visibility: visible;",
"bodyHiddenStyle": "body {opacity: 0 !important}",
"bodyHidingEnabled": true,
"deviceIdLifetime": 63244800000,
"sessionIdLifetime": 1860000,
"selectorsPollingTimeout": 5000,
"visitorApiTimeout": 2000,
"overrideMboxEdgeServer": false,
"overrideMboxEdgeServerTimeout": 1860000,
"optoutEnabled": false,
"optinEnabled": false,
"secureOnly": false,
"supplementalDataIdParamTimeout": 30,
"authoringScriptUrl": "//cdn.tt.omtrdc.net/cdn/target-vec.js",
"urlSizeLimit": 2048,
"endpoint": "/rest/v1/delivery",
"pageLoadEnabled": true,
"viewsEnabled": true,
"analyticsLogging": "server_side",
"serverState": {},
"decisioningMethod": "server-side",
"legacyBrowserSupport": false
});
Configuración de Platform Web SDK
La configuración de SDK se completó con el comando configure
. Se llama primero al comando configure
siempre.
Cómo solicitar y procesar automáticamente ofertas de carga de página Target
Uso de at.js
Si usa at.js 2.x y habilita la configuración pageLoadEnabled,
, la biblioteca déclencheur una llamada a Target Edge con execute -> pageLoad
. Si todos los ajustes están configurados con los valores predeterminados, no es necesaria ninguna codificación personalizada. Una vez que at.js se agrega a la página y el explorador lo carga, se ejecuta una llamada de Edge Target.
Usando PLatform Web SDK
El contenido creado en Target Compositor de experiencias visuales se puede recuperar y procesar automáticamente en SDK.
Para solicitar y procesar automáticamente Target ofertas, use el comando sendEvent
y establezca la opción renderDecisions
en true.
. Si lo hace, SDK procesará automáticamente todo el contenido personalizado que sea apto para la representación automática.
Ejemplo:
alloy("sendEvent", {
"renderDecisions": true,
"xdm": {
"commerce": {
"order": {
"purchaseID": "a8g784hjq1mnp3",
"purchaseOrderNumber": "VAU3123",
"currencyCode": "USD",
"priceTotal": 999.98
}
}
}
});
Experience Platform Web SDK envía automáticamente una notificación con las ofertas ejecutadas por Platform WEB SDK. Este es un ejemplo del aspecto que tiene una carga útil de solicitud de notificación:
{
"events": [{
"xdm": {
"_experience": {
"decisioning": {
"propositions": [
{
"id": "AT:eyJhY3Rpdml0eUlkIjoiMTI3MDE5IiwiZXhwZXJpZW5jZUlkIjoiMCJ9",
"scope": "cart",
"scopeDetails": {
"decisionProvider": "TGT",
"activity": {
"id": "127019"
},
"experience": {
"id": "0"
},
"strategies": [
{
"step": "entry",
"algorithmID": "0",
"trafficType": "0"
},
{
"step": "display",
"algorithmID": "0",
"trafficType": "0"
}
],
"characteristics": {
"eventToken": "bKMxJ8dCR1XlPfDCx+2vSGqipfsIHvVzTQxHolz2IpSCnQ9Y9OaLL2gsdrWQTvE54PwSz67rmXWmSnkXpSSS2Q=="
}
}
}
]
}
},
"eventType": "display",
"web": {
"webPageDetails": {
"viewName": "cart",
"URL": "https://alloyio.com/personalizationSpa/cart"
},
"webReferrer": {
"URL": ""
}
},
"device": {
"screenHeight": 800,
"screenWidth": 1280,
"screenOrientation": "landscape"
},
"environment": {
"type": "browser",
"browserDetails": {
"viewportWidth": 1280,
"viewportHeight": 284
}
},
"placeContext": {
"localTime": "2021-12-10T15:50:34.467+02:00",
"localTimezoneOffset": -120
},
"timestamp": "2021-12-10T13:50:34.467Z",
"implementationDetails": {
"name": "https://ns.adobe.com/experience/alloy",
"version": "2.6.2",
"environment": "browser"
}
}
}
]
}
Cómo solicitar y NOT procesar automáticamente ofertas de Page Load Target
Uso de at.js
Existen dos maneras de activar una llamada a Target Edge que obtenga ofertas para la carga de página.
Ejemplo 1:
adobe.target.getOffer({
mbox: "target-global-mbox",
success: console.log,
error: console.error
});
Ejemplo 2:
adobe.target.getOffers({
request: {
execute: {
pageLoad: {}
}
}
})
.then(console.log)
.catch(console.error);
Usando Platform Web SDK
Ejecute un comando sendEvent
con un ámbito especial en decisionScopes
: __view__
. Adobe utiliza este ámbito como señal para recuperar todas las actividades de carga de página de Target y recuperar previamente todas las vistas. Platform Web SDK también intenta evaluar todas las actividades basadas en vistas del VEC. Actualmente no se admite la deshabilitación de la recuperación previa de vista en Platform Web SDK.
Para acceder a cualquier contenido personalizado, puede proporcionar una función de llamada de retorno, a la que se llamará después de que SDK reciba una respuesta correcta del servidor. La llamada de retorno se proporciona como un objeto result, que puede contener la propiedad propositions que contiene cualquier contenido de personalización devuelto.
Ejemplo:
alloy("sendEvent", {
xdm: {...},
decisionScopes: ["__view__"]
}).then(function(result) {
if (result.propositions) {
result.propositions.forEach(proposition => {
proposition.items.forEach(item => {
if (item.schema === HTML_SCHEMA) {
// manually apply offer
document.getElementById("form-based-offer-container").innerHTML =
item.data.content;
const executedPropositions = [
{
id: proposition.id,
scope: proposition.scope,
scopeDetails: proposition.scopeDetails
}
];
// manually send the display notification event, so that Target/Analytics impressions aare increased
alloy("sendEvent",{
"xdm": {
"eventType": "decisioning.propositionDisplay",
"_experience": {
"decisioning": {
"propositions": executedPropositions
}
}
}
});
}
});
});
}
});
Cómo solicitar mboxes específicos de Form Based Target
Uso de at.js
Puede recuperar actividades mediante la función getOffer
:
Ejemplo 1:
adobe.target.getOffer({
mbox: "hero-banner",
success: console.log,
error: console.error
});
Ejemplo 2:
adobe.target.getOffers({
request: {
execute: {
mboxes: [
{
index: 0,
name: "hero-banner"
}]
}
}
})
.then(console.log)
.catch(console.error);
Usando Platform Web SDK
Puede recuperar actividades basadas en Form-Based Composer usando el comando sendEvent
y pasando los nombres de mbox bajo la opción decisionScopes
. El comando sendEvent
devuelve una promesa que se resuelve con un objeto que contiene las actividades/propuestas solicitadas:
Este fragmento de código es el aspecto de la matriz propositions
:
[
{
"id": "AT:eyJhY3Rpdml0eUlkIjoiNDM0Njg5IiwiZXhwZXJpZW5jZUlkIjoiMCJ9",
"scope": "hero-banner",
"scopeDetails": {
"decisionProvider": "TGT",
"activity": {
"id": "434689"
},
"experience": {
"id": "0"
},
"strategies": [
{
"algorithmID": "0",
"trafficType": "0"
}
],
"characteristics": {
"eventToken": "2lTS5KA6gj4JuSjOdhqUhGqipfsIHvVzTQxHolz2IpTMromRrB5ztP5VMxjHbs7c6qPG9UF4rvQTJZniWgqbOw=="
}
},
"items": [
{
"id": "1184844",
"schema": "https://ns.adobe.com/personalization/html-content-item",
"meta": {
"geo.state": "bucuresti",
"activity.id": "434689",
"experience.id": "0",
"activity.name": "a4t test form based activity",
"offer.id": "1184844",
"profile.tntId": "04608610399599289452943468926942466370-pybgfJ"
},
"data": {
"id": "1184844",
"format": "text/html",
"content": "<div> analytics impressions </div>"
}
}
]
},
{
"id": "AT:eyJhY3Rpdml0eUlkIjoiNDM0Njg5IiwiZXhwZXJpZW5jZUlkIjoiMCJ9",
"scope": "hero-banner",
"scopeDetails": {
"decisionProvider": "TGT",
"activity": {
"id": "434689"
},
"characteristics": {
"eventToken": "E0gb6q1+WyFW3FMbbQJmrg=="
}
},
"items": [
{
"id": "434689",
"schema": "https://ns.adobe.com/personalization/measurement",
"data": {
"type": "click",
"format": "application/vnd.adobe.target.metric"
}
}
]
}
]
Ejemplo:
alloy("sendEvent", {
xdm: { ...},
decisionScopes: ["hero-banner"]
}).then(function (result) {
var propositions = result.propositions;
if (propositions) {
// Find the discount proposition, if it exists.
for (var i = 0; i < propositions.length; i++) {
var proposition = propositions[i];
for (var j = 0; j < proposition.items; j++) {
var item = proposition.items[j];
if (item.schema === HTML_SCHEMA) {
// apply offer
document.getElementById("form-based-offer-container").innerHTML =
item.data.content;
const executedPropositions = [
{
id: proposition.id,
scope: proposition.scope,
scopeDetails: proposition.scopeDetails
}
];
alloy("sendEvent", {
"xdm": {
"eventType": "decisioning.propositionDisplay",
"_experience": {
"decisioning": {
"propositions": executedPropositions
}
}
}
});
}
}
}
}
});
Cómo aplicar las actividades Target
Uso de at.js
Puede aplicar las actividades Target mediante la función applyOffers
: adobe.target.applyOffer(options).
Ejemplo:
adobe.target.getOffers({...})
.then(response => adobe.target.applyOffers({ response: response }))
.then(() => console.log("Success"))
.catch(error => console.log("Error", error));
Obtenga más información acerca del comando applyOffers
en la documentación dedicada.
Usando Platform Web SDK
Puede aplicar las actividades Target mediante el comando applyPropositions
.
Ejemplo:
alloy("applyPropositions", {
propositions: [...]
});
Obtenga más información acerca del comando applyPropositions
en la documentación dedicada.
Seguimiento de eventos
Uso de at.js
Puede realizar el seguimiento de eventos mediante la función trackEvent
o mediante sendNotifications.
Esta función activa una solicitud para informar sobre las acciones de los usuarios, como clics y conversiones. Esta función no ofrece actividades en la respuesta.
Ejemplo 1
adobe.target.trackEvent({
"type": "click",
"mbox": "some-mbox"
});
Ejemplo 2
adobe.target.sendNotifications({
request: {
notifications: [{
...,
mbox: {
name: "some-mbox"
},
type: "click",
...
}]
}
});
Usando Platform Web SDK
Puede realizar un seguimiento de eventos y acciones del usuario llamando al comando sendEvent
, rellenando el XDM _experience.decisioning.propositions
de fieldgroup
y estableciendo eventType
en uno de los dos valores siguientes:
decisioning.propositionDisplay
: Indica la representación de la actividad Target.decisioning.propositionInteract
: indica la interacción de un usuario con la actividad, como un clic del ratón.
El XDM _experience.decisioning.propositions
fieldgroup
es una matriz de objetos. Las propiedades de cada objeto se derivan del objeto result.propositions
devuelto en el comando sendEvent
: { id, scope, scopeDetails }.
Ejemplo 1 - Rastrear un evento decisioning.propositionDisplay
después de procesar una actividad
alloy("sendEvent", {
xdm: {},
decisionScopes: ['discount']
}).then(function(result) {
var propositions = result.propositions;
var discountProposition;
if (propositions) {
// Find the discount proposition, if it exists.
for (var i = 0; i < propositions.length; i++) {
var proposition = propositions[i];
if (proposition.scope === "discount") {
discountProposition = proposition;
break;
}
}
}
if (discountProposition) {
// Find the item from proposition that should be rendered.
// Rather than assuming there a single item that has HTML
// content, find the first item whose schema indicates
// it contains HTML content.
for (var j = 0; j < discountProposition.items.length; j++) {
var discountPropositionItem = discountProposition.items[i];
if (discountPropositionItem.schema === "https://ns.adobe.com/personalization/html-content-item") {
var discountHtml = discountPropositionItem.data.content;
// Render the content
var dailySpecialElement = document.getElementById("daily-special");
dailySpecialElement.innerHTML = discountHtml;
// For this example, we assume there is only a single place to update in the HTML.
break;
}
}
// Send a "decisioning.propositionDisplay" event signaling that the proposition has been rendered.
alloy("sendEvent", {
"xdm": {
"eventType": "decisioning.propositionDisplay",
"_experience": {
"decisioning": {
"propositions": [{
"id": id,
"scope": scope,
"scopeDetails": scopeDetails
}],
"propositionEventType": {
"display": 1
}
}
}
}
});
}
});
Ejemplo 2 - Rastrear un evento decisioning.propositionInteract
después de que se produzca una métrica de clics
alloy("sendEvent", {
xdm: { ...},
decisionScopes: ["hero-banner"]
}).then(function (result) {
var propositions = result.propositions;
if (propositions) {
// Find the discount proposition, if it exists.
for (var i = 0; i < propositions.length; i++) {
var proposition = propositions[i];
for (var j = 0; j < proposition.items.length; j++) {
var item = proposition.items[j];
if (item.schema === "https://ns.adobe.com/personalization/measurement") {
// add metric to the DOM element
const button = document.getElementById("form-based-click-metric");
button.addEventListener("click", event => {
const executedPropositions = [
{
id: proposition.id,
scope: proposition.scope,
scopeDetails: proposition.scopeDetails
}
];
// send the click track event
alloy("sendEvent", {
"xdm": {
"eventType": "decisioning.propositionInteract",
"_experience": {
"decisioning": {
"propositions": executedPropositions
}
}
}
});
});
}
}
}
}
});
Ejemplo 3 - Rastrear un evento desencadenado después de realizar una acción
Este ejemplo rastrea un evento que se activó después de realizar una acción específica, como hacer clic en un botón.
Puede agregar cualquier parámetro personalizado adicional a través del objeto de datos __adobe.target
.
También puede agregar el objeto XDM commerce
.
alloy("sendEvent", {
"xdm": {
"_experience": {
"decisioning": {
"propositions": [
{
"scope": "orderConfirm" //example scope name
}
],
"propositionEventType": {
"display": 1
}
}
},
"eventType": "decisioning.propositionDisplay"
},
"commerce": {
"order": {
"purchaseID": "a8g784hjq1mnp3",
"purchaseOrderNumber": "VAU3123",
"currencyCode": "USD",
"priceTotal": 999.98
}
},
"data": {
"__adobe": {
"target": {
"pageType": "Order Confirmation",
"user.categoryId": "Insurance"
}
}
}
})
Cómo almacenar en déclencheur un cambio de vista en una aplicación de una sola página
Uso de at.js
Usar la función adobe.target.triggerView
. Se puede llamar a esta función cada vez que se carga una página nueva o cuando se vuelve a procesar un componente de una página. La función adobe.target.triggerView()
debe implementarse para que las aplicaciones de una sola página (SPA) utilicen el Visual Experience Composer (VEC) para crear actividades A/B Test y Experience Targeting (XT). Si adobe.target.triggerView()
no está implementado en el sitio, el VEC no se puede usar para SPA.
Ejemplo
adobe.target.triggerView("homeView")
Usando Platform Web SDK
Para almacenar en déclencheur o señalar una aplicación de una sola página View Change, establezca la propiedad web.webPageDetails.viewName
en la opción xdm
del comando sendEvent
. Platform Web SDK comprueba la caché de la vista; si hay ofertas para viewName
especificado en sendEvent
, las ejecuta y envía un evento de notificación de visualización.
Ejemplo
alloy("sendEvent", {
renderDecisions: true,
xdm:{
web:{
webPageDetails:{
viewName: "homeView"
}
}
}
});
Cómo aprovechar Response Tokens
El contenido de Personalization devuelto desde Target incluye tokens de respuesta. Los tokens de respuesta son detalles acerca de la actividad, oferta, experiencia, perfil de usuario, información geográfica y más. Estos detalles se pueden compartir con herramientas de terceros o utilizar para la depuración. Los tokens de respuesta se pueden configurar en la interfaz de usuario Target.
Uso de at.js
Utilice eventos personalizados de at.js para detectar la respuesta Target y leer los tokens de respuesta.
Ejemplo
document.addEventListener(adobe.target.event.REQUEST_SUCCEEDED, function(e) {
console.log("Request succeeded", e.detail);
});
Usando Platform Web SDK
Los tokens de respuesta se devuelven como parte de propositions
que se exponen en el resultado del comando sendEvent
. Cada propuesta contiene una matriz de items,
y cada elemento tiene un objeto meta
rellenado con tokens de respuesta si están habilitados en la interfaz de usuario de administración de Target. Más información
Ejemplo
alloy("sendEvent", {
renderDecisions: true,
xdm: {}
}).then(function(result) {
if (result.propositions) {
// Format of result.propositions:
/*
[
{
"id": "",
"scope": "",
"items": [
{
"id": "",
"schema": "",
"data": {},
"meta": { // RESPONSE TOKENS
"activity.name": ...,
"offer.id": ...,
"profile.activeActivities": ...
}
}
],
"scopeDetails": {}
"renderAttempted": false
}
]
*/
}
});
Cómo administrar el parpadeo
Uso de at.js
Con at.js puede administrar el parpadeo configurando bodyHidingEnabled: true
para que at.js sea el que se encargue de
preocultando los contenedores personalizados antes de recuperar y aplicar los cambios de DOM.
Las secciones de página que contienen contenido personalizado se pueden ocultar previamente anulando at.js bodyHiddenStyle.
De forma predeterminada bodyHiddenStyle
oculta todo el HTML body.
Ambas configuraciones se pueden sobrescribir usando window.targetGlobalSettings.
window.targetGlobalSettings
debe colocarse antes de cargar at.js.
Usando Platform Web SDK
Con Platform Web SDK, el cliente puede configurar su estilo de ocultamiento previo en el comando configure, como en el siguiente ejemplo:
alloy("configure", {
datastreamId: "configurationId",
orgId: "orgId@AdobeOrg",
debugEnabled: true,
prehidingStyle: "body { opacity: 0 !important }"
});
Al cargar el elemento asincrónico Platform Web SDK, Adobe recomienda que se inserte el siguiente fragmento en la página antes de que se inserte Platform Web SDK:
<script>
!function(e,a,n,t){
if (a) return;
var i=e.head;if(i){
var o=e.createElement("style");
o.id="alloy-prehiding",o.innerText=n,i.appendChild(o),
setTimeout(function(){o.parentNode&&o.parentNode.removeChild(o)},t)}}
(document, document.location.href.indexOf("adobe_authoring_enabled") !== -1, "body { opacity: 0 !important }", 3000);
</script>
Cómo se gestiona A4T
Uso de at.js
Existen dos tipos de registro de A4T compatibles con at.js:
- Registro del lado del cliente de Analytics
- Registro en el servidor de Analytics
Registro del lado del cliente de Analytics
Ejemplo 1: Usando Target configuración global
El registro de cliente de Analytics se puede habilitar estableciendo analyticsLogging: client_side
en la configuración de at.js o anulando el objeto window.targetglobalSettings
.
Cuando se configura esta opción, el formato de la carga útil que se devuelve es el siguiente:
{
"analytics": {
"payload": {
"pe": "tnt",
"tnta": "167169:0:0|0|100,167169:0:0|2|100,167169:0:0|1|100"
}
}
}
La carga útil se puede reenviar a Analytics mediante Data Insertion API.
Ejemplo 2: Configurándolo en cada función getOffers
:
adobe.target.getOffers({
request: {
experienceCloud: {
analytics: {
logging: "client_side"
}
},
prefetch: {
mboxes: [{
index: 0,
name: "a1-serverside-xt"
}]
}
}
})
.then(console.log)
Este fragmento de código muestra el aspecto de la carga útil de respuesta:
{
"prefetch": {
"mboxes": [{
"index": 0,
"name": "a1-serverside-xt",
"options": [{
"content": "<img src=\"http://s7d2.scene7.com/is/image/TargetAdobeTargetMobile/L4242-xt-usa?tm=1490025518668&fit=constrain&hei=491&wid=980&fmt=png-alpha\"/>",
"type": "html",
"eventToken": "n/K05qdH0MxsiyH4gX05/2qipfsIHvVzTQxHolz2IpSCnQ9Y9OaLL2gsdrWQTvE54PwSz67rmXWmSnkXpSSS2Q==",
"responseTokens": {
"profile.memberlevel": "0",
"geo.city": "bucharest",
"activity.id": "167169",
"experience.name": "USA Experience",
"geo.country": "romania"
}
}],
"analytics": {
"payload": {
"pe": "tnt",
"tnta": "167169:0:0|0|100,167169:0:0|2|100,167169:0:0|1|100"
}
}
}]
}
}
La carga útil Analytics (tnta
token) debe incluirse en la visita de Analytics mediante la API de inserción de datos.
Registro del lado del servidor Analytics
Analytics El registro en el servidor se puede habilitar estableciendo analyticsLogging: server_side
en la configuración de at.js o anulando el objeto window.targetglobalSettings
.
A continuación, los datos fluyen de la siguiente manera:
Usando Platform Web SDK
La SDK web también admite:
- Registro en el lado del cliente de Analytics
- Registro en el servidor de Analytics
Registro del lado del cliente Analytics
Analytics El registro del lado del cliente está habilitado cuando Adobe Analytics está deshabilitado para esa configuración de DataStream.
El cliente tiene acceso al token Analytics (tnta
) que debe compartirse con Analytics mediante la API de inserción de datos encadenando el comando sendEvent
e iterando a través de la matriz de propuestas resultante.
Ejemplo
alloy("sendEvent", {
"renderDecisions": true,
"xdm": {
"web": {
"webPageDetails": {
"name": "Home Page"
}
}
}
}
).then(function (results) {
var analyticsPayloads = new Set();
for (var i = 0; i < results.propositions.length; i++) {
var proposition = results.propositions[i];
var renderAttempted = proposition.renderAttempted;
if (renderAttempted === true) {
var analyticsPayload = getAnalyticsPayload(proposition);
if (analyticsPayload !== undefined) {
analyticsPayloads.add(analyticsPayload);
}
}
}
var analyticsPayloadsToken = concatenateAnalyticsPayloads(analyticsPayloads);
// send the page view Analytics hit with collected Analytics payload using Data Insertion API
});
Este diagrama muestra cómo fluyen los datos cuando el lado del cliente Analytics está habilitado:
Registro del lado del servidor Analytics
Analytics El registro en el servidor está habilitado cuando Analytics está habilitado para esa configuración de DataStream.
Cuando el registro de Analytics del lado del servidor está habilitado, la carga útil de A4T que debe compartirse con Analytics para que la creación de informes de Analytics muestre las impresiones y conversiones correctas se comparta en el nivel de Edge Network, de modo que el cliente no tenga que realizar ningún procesamiento adicional.
Así es como los datos fluyen a los sistemas cuando el registro de Analytics en el servidor está habilitado:
Establecer la configuración global de Target
Uso de at.js
En lugar de definir la configuración en la interfaz de usuario de window.targetGlobalSettings,
, puede anular la configuración de la biblioteca at.js mediante Target o usar las API de REST.
La anulación debe definirse antes de que se cargue at.js o en Administración > Implementación > Editar la configuración de at.js > Configuración del código > Encabezado de la biblioteca.
Ejemplo:
window.targetGlobalSettings = {
timeout: 200, // using custom timeout
visitorApiTimeout: 500, // using custom API timeout
enabled: document.location.href.indexOf('https://www.adobe.com') >= 0 // enabled ONLY on adobe.com
};
Usando Platform Web SDK
Esta función no se admite en Web SDK.
Actualizar atributos de perfil Target
Uso de at.js
Ejemplo 1
adobe.target.getOffer({
mbox: "target-global-mbox",
params: {
"profile.name": "test",
"profile.gender": "female"
},
success: console.log,
error: console.error
});
Ejemplo 2
adobe.target.getOffers({
request: {
execute: {
pageLoad: {
profileParameters: {
name: "test",
gender: "female"
}
}
}
}
})
.then(console.log)
.catch(console.error);
Usando Platform Web SDK
Para actualizar un perfil Target, use el comando sendEvent
y establezca la propiedad data.__adobe.target
, prefiriendo los nombres de clave mediante profile.
Ejemplo
alloy("sendEvent", {
renderDecisions: true,
data: {
__adobe: {
target: {
"profile.gender": "female",
"profile.age": 30
}
}
}
});
¿Cómo se usa Target Recommendations?
Uso de at.js
Ejemplo 1
adobe.target.getOffer({
mbox: "target-global-mbox",
params: {
"entity.name": "T-shirt",
"entity.id": "1234"
},
success: console.log,
error: console.error
});
Ejemplo 2
adobe.target.getOffers({
request: {
execute: {
pageLoad: {
parameters: {
"entity.name": "T-shirt",
"entity.id": "1234"
}
}
}
}
})
.then(console.log)
.catch(console.error);
Usando Platform Web SDK
Para enviar datos de Recommendations, use el comando sendEvent
y establezca la propiedad data.__adobe.target
, prefiriendo los nombres de clave con entity.
Ejemplo
alloy("sendEvent", {
renderDecisions: true,
data: {
__adobe: {
target: {
"entity.name": "T-shirt",
"entity.id": "1234"
}
}
}
});
¿Cómo utilizo los ID de terceros?
Uso de at.js
Con at.js hay varias formas de enviar mbox3rdPartyId
, con getOffer,
o getOffers
:
Ejemplo 1
adobe.target.getOffer({
mbox:"test",
params:{
"mbox3rdPartyId": "1234"
},
success: console.log,
error: console.error
});
Ejemplo 2
adobe.target.getOffers({
request: {
id:{
thirdPartyId: "1234"
},
execute: {
pageLoad: {}
}
}
})
.then(console.log)
.catch(console.error);
O existe una forma de configurar mbox3rdPartyId
en targetPageParams
o targetPageParamsAll.
Al establecer targetPageParams
, envía las solicitudes de target-global-mbox
, también conocidas como pag-lLoad
.
La recomendación se debe establecer usando targetPageParamsAll
, ya que se enviará en cada solicitud Target. La ventaja de usar targetPageParamsAll
es que puede definir mbox3rdPartyId
en la página una vez para asegurarse de que todas las Target solicitudes tengan el derecho mbox3rdPartyId.
window.targetPageParamsAll = function() {
return {
"mbox3rdPartyId": "1234"
};
};
window.targetPageParams = function() {
return {
"mbox3rdPartyId": "1234"
};
};
Usando Platform Web SDK
Platform Web SDK admite Target ID de terceros. Sin embargo, se requieren algunos pasos más.
El mapa de identidad permite a los clientes enviar varias identidades. Todas las identidades tienen un espacio de nombres. Cada área de nombres puede tener una o más identidades. Una identidad en particular se puede marcar como principal. Con este conocimiento en mente puede ver cuáles son los pasos necesarios para configurar para que Platform Web SDK use Target ID de terceros.
- Configure el área de nombres que contiene el ID de terceros de Target en la página de configuración del flujo de datos:
- Envíe ese área de nombres de identidad en cada comando de
sendEvent
de esta manera:
alloy("sendEvent", {
"renderDecisions": true,
"xdm": {
"identityMap": {
"TGT3PID": [
{
"id": "1234",
"primary": true
}
]
}
}
});
¿Cómo se establecen los tokens de propiedad?
Uso de at.js
Con at.js hay dos formas de configurar los tokens de propiedad, ya sea con targetPageParams
o targetPageParamsAll.
. Con targetPageParams
se agrega el token de propiedad a la llamada target-global-mbox
, pero con targetPageParamsAll
se agrega el token a todas las llamadas a Target:
Ejemplo 1
window.targetPageParamsAll = function() {
return {
"at_property": "1234"
};
};
Ejemplo 2
window.targetPageParams = function() {
return {
"at_property": "1234"
};
};
Usando Platform Web SDK
Los clientes de Platform Web SDK pueden configurar la propiedad en un nivel superior, al configurar la secuencia de datos, en el área de nombres Adobe Target:
Esto significa que cada llamada de Target para esa configuración de secuencia de datos específica contiene ese token de propiedad.
¿Cómo puedo recuperar previamente los mboxes?
Uso de at.js
Esta funcionalidad solo está disponible en at.js 2.x. at.js 2.x tiene una nueva función denominada getOffers
. La función getOffers
permite a los clientes recuperar previamente contenido para uno o más mboxes. Vea el siguiente ejemplo:
adobe.target.getOffers({
request: {
prefetch: {
mboxes: [{
index: 0,
name: "test-mbox",
parameters: {
...
},
profileParameters: {
...
}
}]
}
}
})
.then(console.log)
.catch(console.error);
mbox
de la matriz mboxes
tenga su propio índice. Normalmente el primer mbox tiene index=0
el siguiente index=1,
y así sucesivamente.Usando Platform Web SDK
Esta funcionalidad no se admite actualmente en Platform Web SDK.
Cómo depuro mi implementación de Target
Uso de at.js
La biblioteca at.js expone estas funciones de depuración:
- Deshabilitar mbox: deshabilitar Target para que no recupere ni procese para comprobar si la página está rota sin interacciones Target
- Depuración de mbox: at.js registra todas las acciones
- Seguimiento de destino: con un token de seguimiento de mbox generado en un objeto de seguimiento con detalles que participaron en el proceso de toma de decisiones disponible en el objeto
window.___target_trace
.
Usando Platform Web SDK
Tiene varias capacidades de depuración al usar Platform Web SDK:
- Usando Assurance
- Depuración de Web SDK habilitada
- Utilizar vínculos de supervisión de Web SDK
- Usar Adobe Experience Platform Debugger
- Seguimiento de destino