Vergleichen der at.js-Bibliothek mit der Adobe Experience Platform Web SDK
Überblick
Dieser Artikel bietet einen Überblick über die Unterschiede zwischen der at.js
-Bibliothek und der Experience Platform Web SDK.
Installieren der Bibliotheken
Installieren von at.js
Adobe können Kundinnen und Kunden die Bibliothek direkt über die Registerkarte Adobe Experience Cloud Implementation herunterladen. Die at.js-Bibliothek wird mit Einstellungen angepasst, die der Kunde hat: clientCode, imsOrgId usw.
Installieren von Web SDK
Die vordefinierte Version ist in einem CDN verfügbar. Sie können direkt auf Ihrer Seite auf die Bibliothek im CDN verweisen oder sie herunterladen und in Ihrer eigenen Infrastruktur hosten. Es ist in minimierten und nicht minimierten Formaten verfügbar. Die nicht minimierte Version ist zum Debuggen hilfreich.
Weitere finden Sie unter „Installieren von Web SDK mithilfeJavaScript-Bibliothek“.
Konfigurieren der Bibliotheken
Konfigurieren von at.js
Am Ende jeder at.js-Datei sehen Sie einen Abschnitt, in dem Adobe ein Einstellungsobjekt instanziiert und übergibt. Es ist anpassbar, beim Herunterladen füllt Adobe diesen Abschnitt mit aktuellen Kundeneinstellungen.
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
});
Konfigurieren von Platform Web SDK
Die Konfiguration für die SDK erfolgt mit dem Befehl configure
. Der configure
Befehl wird immer zuerst aufgerufen.
Anfordern und automatisches Rendern des Seitenladevorgangs Target Angebote
Verwenden von at.js
Wenn Sie at.js 2.x verwenden und die Einstellung pageLoadEnabled,
Bibliotheks-Trigger aktivieren, wird Target Edge mit execute -> pageLoad
aufgerufen. Wenn alle Einstellungen auf die Standardwerte eingestellt sind, ist keine benutzerdefinierte Codierung erforderlich. Nachdem at.js zur Seite hinzugefügt und vom Browser geladen wurde, wird ein Target Edge-Aufruf ausgeführt.
Verwenden von PLatform Web SDK
Inhalte, die in Target Visual Experience Composer erstellt wurden, können von SDK automatisch abgerufen und gerendert werden.
Um Target Angebote anzufordern und automatisch zu rendern, verwenden Sie den Befehl sendEvent
und setzen die Option renderDecisions
auf true.
Dadurch wird die SDK gezwungen, automatisch alle personalisierten Inhalte zu rendern, die für das automatische Rendering geeignet sind.
Beispiel:
alloy("sendEvent", {
"renderDecisions": true,
"xdm": {
"commerce": {
"order": {
"purchaseID": "a8g784hjq1mnp3",
"purchaseOrderNumber": "VAU3123",
"currencyCode": "USD",
"priceTotal": 999.98
}
}
}
});
Experience Platform Web SDK sendet automatisch eine Benachrichtigung mit den Angeboten, die von der Platform WEB SDK ausgeführt wurden. Dies ist ein Beispiel dafür, wie die Payload einer Benachrichtigungsanfrage aussieht:
{
"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"
}
}
}
]
}
Anfordern und () automatischen Rendern von Seitenladezielgruppenangeboten
Verwenden von at.js
Es gibt zwei Möglichkeiten, einen Aufruf an Target Edge auszulösen, der Angebote zum Laden der Seite abruft.
Beispiel 1:
adobe.target.getOffer({
mbox: "target-global-mbox",
success: console.log,
error: console.error
});
Beispiel 2:
adobe.target.getOffers({
request: {
execute: {
pageLoad: {}
}
}
})
.then(console.log)
.catch(console.error);
Verwenden von Platform Web SDK
Führen Sie einen sendEvent
Befehl mit einem speziellen Bereich unter decisionScopes
aus: __view__
. Adobe verwendet diesen Umfang als Signal, um alle Seitenladeaktivitäten aus Target abzurufen und alle Ansichten vorab abzurufen. Der Platform Web SDK versucht auch, alle ansichtsbasierten Aktivitäten des VEC auszuwerten. Das Deaktivieren des Vorabrufs von Ansichten wird derzeit in der Platform Web SDK nicht unterstützt.
Für den Zugriff auf Personalisierungsinhalte können Sie eine Rückruffunktion bereitstellen, die aufgerufen wird, nachdem die SDK eine erfolgreiche Antwort vom Server erhalten hat. Ihr Callback wird als Ergebnisobjekt bereitgestellt, das die Eigenschaft „Vorschläge“ enthalten kann, die alle zurückgegebenen Personalisierungsinhalte enthält.
Beispiel:
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
}
}
}
});
}
});
});
}
});
Anfordern bestimmter formularbasierter Target-Mboxes
Verwenden von at.js
Mithilfe der getOffer
-Funktion können Sie F-Aktivitäten abrufen:
Beispiel 1:
adobe.target.getOffer({
mbox: "hero-banner",
success: console.log,
error: console.error
});
Beispiel 2:
adobe.target.getOffers({
request: {
execute: {
mboxes: [
{
index: 0,
name: "hero-banner"
}]
}
}
})
.then(console.log)
.catch(console.error);
Verwenden von Platform Web SDK
Sie können Form-Based Composer Aktivitäten abrufen, indem Sie den Befehl sendEvent
verwenden und die Mbox-Namen unter der Option decisionScopes
übergeben. Der Befehl sendEvent
gibt eine Zusage zurück, die mit einem Objekt aufgelöst wird, das die angeforderten Aktivitäten/Vorschläge enthält:
Dieses Code-Fragment zeigt, wie das propositions
-Array aussieht:
[
{
"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"
}
}
]
}
]
Beispiel:
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
}
}
}
});
}
}
}
}
});
Anwenden der Target Aktivitäten
Verwenden von at.js
Sie können die Target Aktivitäten mithilfe der applyOffers
anwenden: adobe.target.applyOffer(options).
Beispiel:
adobe.target.getOffers({...})
.then(response => adobe.target.applyOffers({ response: response }))
.then(() => console.log("Success"))
.catch(error => console.log("Error", error));
Weitere Informationen über den applyOffers
-Befehl finden Sie in der dedizierten Dokumentation.
Verwenden von Platform Web SDK
Sie können die Target Aktivitäten mithilfe des Befehls applyPropositions
anwenden.
Beispiel:
alloy("applyPropositions", {
propositions: [...]
});
Weitere Informationen über den applyPropositions
-Befehl finden Sie in der dedizierten Dokumentation.
Tracking von Ereignissen
Verwenden von at.js
Sie können Ereignisse mithilfe der trackEvent
oder mithilfe von sendNotifications.
verfolgen
Diese Funktion löst eine Anforderung zum Melden von Benutzeraktionen aus (wie beispielsweise Klicks und Konversionen). Diese Funktion liefert keine Aktivitäten in der Antwort.
Beispiel 1
adobe.target.trackEvent({
"type": "click",
"mbox": "some-mbox"
});
Beispiel 2
adobe.target.sendNotifications({
request: {
notifications: [{
...,
mbox: {
name: "some-mbox"
},
type: "click",
...
}]
}
});
Verwenden von Platform Web SDK
Sie können Ereignisse und Benutzeraktionen verfolgen, indem Sie den sendEvent
-Befehl aufrufen, die _experience.decisioning.propositions
XDM-fieldgroup
ausfüllen und die eventType
auf einen von zwei Werten setzen:
decisioning.propositionDisplay
: Signalisiert das Rendering der Target.decisioning.propositionInteract
: Signalisiert eine Benutzerinteraktion mit der Aktivität wie ein Mausklick.
Die _experience.decisioning.propositions
XDM-fieldgroup
ist ein Array von -Objekten. Die Eigenschaften der einzelnen -Objekte werden von dem result.propositions
abgeleitet, der im sendEvent
-Befehl zurückgegeben wird: { id, scope, scopeDetails }.
Beispiel 1: Verfolgen eines decisioning.propositionDisplay
Ereignisses nach dem Rendern einer Aktivität
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
}
}
}
}
});
}
});
Beispiel 2: Verfolgen eines decisioning.propositionInteract
Ereignisses nach einem Klick auf eine Metrik
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
}
}
}
});
});
}
}
}
}
});
Beispiel 3: Verfolgen eines Ereignisses, das nach einer Aktion ausgelöst wurde
In diesem Beispiel wird ein Ereignis nachverfolgt, das nach Durchführung einer bestimmten Aktion, z. B. Klicken auf eine Schaltfläche, ausgelöst wurde.
Sie können über das __adobe.target
Datenobjekt beliebige weitere benutzerdefinierte Parameter hinzufügen.
Sie können auch das commerce
XDM-Objekt hinzufügen.
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"
}
}
}
})
Trigger einer Ansichtsänderung in einem Einzelseiten-Programm
Verwenden von at.js
Verwenden Sie die adobe.target.triggerView
. Diese Funktion kann immer aufgerufen werden, wenn eine neue Seite geladen wird oder wenn eine Komponente auf einer Seite erneut wiedergegeben wird. Die adobe.target.triggerView()
sollte für Single Page Applications (SPAs) implementiert werden, um den Visual Experience Composer (VEC) zum Erstellen von A/B Test- und Experience Targeting (XT)-Aktivitäten zu verwenden. Wenn adobe.target.triggerView()
nicht auf der Site implementiert ist, kann VEC nicht für SPAs verwendet werden.
Beispiel
adobe.target.triggerView("homeView")
Verwenden von Platform Web SDK
Um einen Trigger oder ein Signal für eine Einzelseiten-View Change auszugeben, legen Sie die Eigenschaft web.webPageDetails.viewName
unter der Option xdm
des Befehls sendEvent
fest. Der Platform Web SDK prüft den Ansichts-Cache, ob Angebote für die in angegebenen viewName
vorhanden sind, sendEvent
er sie ausführt und ein Anzeigebenachrichtigungsereignis sendet.
Beispiel
alloy("sendEvent", {
renderDecisions: true,
xdm:{
web:{
webPageDetails:{
viewName: "homeView"
}
}
}
});
So nutzen Sie Response Tokens
Personalization-Inhalte, die von Target zurückgegeben werden, enthalten Antwort-Token. Antwort-Token sind Details zu Aktivität, Angebot, Erlebnis, Benutzerprofil, geografischen Informationen und mehr. Diese Details können für Drittanbieter-Tools freigegeben oder zum Debugging verwendet werden. Antwort-Token können in der Target-Benutzeroberfläche konfiguriert werden.
Verwenden von at.js
Verwenden Sie benutzerdefinierte at.js-Ereignisse, um auf die Target-Antwort zu warten und die Antwort-Token zu lesen.
Beispiel
document.addEventListener(adobe.target.event.REQUEST_SUCCEEDED, function(e) {
console.log("Request succeeded", e.detail);
});
Verwenden von Platform Web SDK
Die Antwort-Token werden als Teil der propositions
zurückgegeben, die im Ergebnis des sendEvent
-Befehls verfügbar gemacht werden. Jeder Vorschlag enthält ein Array von items,
, und jedes Element verfügt über ein meta
Objekt, das mit Antwort-Token gefüllt wird, sofern diese in der Target Admin-Benutzeroberfläche aktiviert sind. Weitere Informationen
Beispiel
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
}
]
*/
}
});
Verwalten von Flackern
Verwenden von at.js
Mit at.js können Sie ein Flackern verhindern, indem Sie bodyHidingEnabled: true
so festlegen, dass at.js diejenige ist, um die Sie sich kümmern würden
Vorab-Ausblenden der personalisierten Container, bevor die DOM-Änderungen abgerufen und angewendet werden.
Die Seitenabschnitte, die personalisierte Inhalte enthalten, können vorab ausgeblendet werden, indem die at.js-bodyHiddenStyle.
überschrieben wird
Standardmäßig blendet bodyHiddenStyle
die gesamte HTML-body.
aus
Beide Einstellungen können mit überschrieben werden, window.targetGlobalSettings.
window.targetGlobalSettings
vor dem Laden von at.js platziert werden sollten.
Verwenden von Platform Web SDK
Mit Platform Web SDK kann der Kunde seinen Stil zum Vorab-Ausblenden im configure-Befehl festlegen, wie im folgenden Beispiel gezeigt:
alloy("configure", {
datastreamId: "configurationId",
orgId: "orgId@AdobeOrg",
debugEnabled: true,
prehidingStyle: "body { opacity: 0 !important }"
});
Beim Laden des asynchronen Platform Web SDK empfiehlt Adobe, den folgenden Code-Ausschnitt in die Seite einzufügen, bevor Platform Web SDK eingefügt wird:
<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>
Handhabung von A4T
Verwenden von at.js
Es gibt zwei Arten von A4T-Protokollierung, die mit at.js unterstützt werden:
- Client-seitige Protokollierung in Analytics
- Server-seitige Analytics-Protokollierung
Client-seitige Protokollierung in Analytics
Beispiel 1: Verwenden Target globalen Einstellung
Die Client-seitige Protokollierung in Analytics kann aktiviert werden, indem analyticsLogging: client_side
in den at.js-Einstellungen festgelegt oder das window.targetglobalSettings
-Objekt überschrieben wird.
Wenn diese Option eingerichtet ist, sieht das Format der zurückgegebenen Payload wie folgt aus:
{
"analytics": {
"payload": {
"pe": "tnt",
"tnta": "167169:0:0|0|100,167169:0:0|2|100,167169:0:0|1|100"
}
}
}
Die Payload kann dann über den an Analytics weitergeleitet Data Insertion API.
Beispiel 2: Konfiguration in jeder getOffers
:
adobe.target.getOffers({
request: {
experienceCloud: {
analytics: {
logging: "client_side"
}
},
prefetch: {
mboxes: [{
index: 0,
name: "a1-serverside-xt"
}]
}
}
})
.then(console.log)
Mit diesem Code-Snippet wird die Antwort-Payload wie folgt dargestellt:
{
"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"
}
}
}]
}
}
Die Analytics-Payload (tnta
-Token) sollte mit der Dateneinfüge-Analytics in den -Treffer.
Analytics Server-seitige Protokollierung
Analytics Server-seitige Protokollierung kann aktiviert werden, indem analyticsLogging: server_side
in den at.js-Einstellungen festgelegt oder das window.targetglobalSettings
-Objekt überschrieben wird.
Die Daten fließen dann wie folgt:
Verwenden von Platform Web SDK
Web-SDK unterstützt auch:
- Client-seitige Protokollierung in Analytics
- Server-seitige Analytics-Protokollierung
Analytics Client-seitige Protokollierung
Analytics Client-seitige Protokollierung ist aktiviert, wenn Adobe Analytics für diese DataStream-Konfiguration deaktiviert ist.
Die Kundin bzw. der Kunde hat Zugriff auf das Analytics-Token (tnta
), das über die AnalyticsDateneinfüge-API mitgeteilt werden muss, indem der sendEvent
-Befehl verkettet wird und das resultierende Vorschläge-Array iteriert wird.
Beispiel
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
});
Im Folgenden finden Sie ein Diagramm, das zeigt, wie Daten fließen, wenn Analytics Client-Seite aktiviert ist:
Analytics Server-seitige Protokollierung
Analytics Server-seitige Protokollierung ist aktiviert, wenn Analytics für diese DataStream-Konfiguration aktiviert ist.
Wenn die Server-seitige Analytics-Protokollierung aktiviert ist, wird die A4T-Payload, die für Analytics freigegeben werden muss, damit die Analytics-Berichte die richtigen Impressionen und Konversionen anzeigen, auf Edge Network-Ebene freigegeben, sodass der Kunde keine zusätzliche Verarbeitung durchführen muss.
So fließen Daten in die Systeme, wenn die Server-seitige Analytics-Protokollierung aktiviert ist:
Festlegen Target globalen Einstellungen
Verwenden von at.js
Sie können Einstellungen in der at.js-Bibliothek mithilfe von window.targetGlobalSettings,
überschreiben, anstatt die Einstellungen in der Target-Benutzeroberfläche oder durch Verwendung von REST-APIs zu konfigurieren.
Die Überschreibung sollte definiert werden, bevor at.js geladen wird, oder alternativ unter Administration > Implementierung > at.js-Einstellungen bearbeiten > Code-Einstellungen > Bibliothekskopfzeile.
Beispiel:
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
};
Verwenden von Platform Web SDK
Diese Funktion wird in Web SDK nicht unterstützt.
Aktualisieren Target Profilattribute
Verwenden von at.js
Beispiel 1
adobe.target.getOffer({
mbox: "target-global-mbox",
params: {
"profile.name": "test",
"profile.gender": "female"
},
success: console.log,
error: console.error
});
Beispiel 2
adobe.target.getOffers({
request: {
execute: {
pageLoad: {
profileParameters: {
name: "test",
gender: "female"
}
}
}
}
})
.then(console.log)
.catch(console.error);
Verwenden von Platform Web SDK
Um ein Target zu aktualisieren, verwenden Sie den Befehl sendEvent
und legen Sie die Eigenschaft data.__adobe.target
fest, wobei die Schlüsselnamen mit dem Präfix profile.
Beispiel
alloy("sendEvent", {
renderDecisions: true,
data: {
__adobe: {
target: {
"profile.gender": "female",
"profile.age": 30
}
}
}
});
Wie verwende ich Target Recommendations
Verwenden von at.js
Beispiel 1
adobe.target.getOffer({
mbox: "target-global-mbox",
params: {
"entity.name": "T-shirt",
"entity.id": "1234"
},
success: console.log,
error: console.error
});
Beispiel 2
adobe.target.getOffers({
request: {
execute: {
pageLoad: {
parameters: {
"entity.name": "T-shirt",
"entity.id": "1234"
}
}
}
}
})
.then(console.log)
.catch(console.error);
Verwenden von Platform Web SDK
Um Recommendations zu senden, verwenden Sie den Befehl sendEvent
und legen Sie die data.__adobe.target
Eigenschaft fest, wobei die Schlüsselnamen mit dem Präfix entity.
Beispiel
alloy("sendEvent", {
renderDecisions: true,
data: {
__adobe: {
target: {
"entity.name": "T-shirt",
"entity.id": "1234"
}
}
}
});
Wie verwende ich Drittanbieter-IDs?
Verwenden von at.js
Bei der Verwendung von at.js gibt es mehrere Möglichkeiten, mbox3rdPartyId
mithilfe von getOffer,
oder getOffers
zu senden:
Beispiel 1
adobe.target.getOffer({
mbox:"test",
params:{
"mbox3rdPartyId": "1234"
},
success: console.log,
error: console.error
});
Beispiel 2
adobe.target.getOffers({
request: {
id:{
thirdPartyId: "1234"
},
execute: {
pageLoad: {}
}
}
})
.then(console.log)
.catch(console.error);
Oder es gibt eine Möglichkeit, die mbox3rdPartyId
entweder in targetPageParams
oder targetPageParamsAll.
einzurichten
Wenn Sie targetPageParams
festlegen, sendet es die Anfragen für target-global-mbox
, die auch als pag-lLoad
bezeichnet werden.
Die Empfehlung muss mit targetPageParamsAll
festgelegt werden, da sie bei jeder Target gesendet wird. Der Vorteil der Verwendung von targetPageParamsAll
besteht darin, dass Sie die mbox3rdPartyId
auf der Seite einmal definieren können, um sicherzustellen, dass alle Target-Anfragen die richtigen mbox3rdPartyId.
haben
window.targetPageParamsAll = function() {
return {
"mbox3rdPartyId": "1234"
};
};
window.targetPageParams = function() {
return {
"mbox3rdPartyId": "1234"
};
};
Verwenden von Platform Web SDK
Platform Web SDK unterstützt Target Drittanbieter-ID. Es sind jedoch einige weitere Schritte erforderlich.
Mit Identity Map können Kundinnen und Kunden mehrere Identitäten senden. Alle Identitäten haben einen Namespace. Jeder Namespace kann eine oder mehrere Identitäten aufweisen. Eine bestimmte Identität kann als primär markiert werden. Mit diesem Wissen im Hinterkopf können Sie sehen, welche Schritte zum Einrichten von erforderlich sind, damit Platform Web SDK die Target-Drittanbieter-ID verwenden kann.
- Richten Sie den Namespace ein, der die Target Drittanbieter-ID auf der Seite Datenstromkonfiguration enthält:
- Senden Sie diesen Identity-Namespace in jedem
sendEvent
wie folgt:
alloy("sendEvent", {
"renderDecisions": true,
"xdm": {
"identityMap": {
"TGT3PID": [
{
"id": "1234",
"primary": true
}
]
}
}
});
Wie werden Eigenschafts-Token festgelegt
Verwenden von at.js
Bei der Verwendung von at.js gibt es zwei Möglichkeiten, die Eigenschafts-Token einzurichten: Entweder mit targetPageParams
oder targetPageParamsAll.
Mit targetPageParams
wird das Eigenschafts-Token zum target-global-mbox
-Aufruf hinzugefügt, aber mit targetPageParamsAll
wird das Token zu allen Target-Aufrufen hinzugefügt:
Beispiel 1
window.targetPageParamsAll = function() {
return {
"at_property": "1234"
};
};
Beispiel 2
window.targetPageParams = function() {
return {
"at_property": "1234"
};
};
Verwenden von Platform Web SDK
Mithilfe von Platform Web SDK können Kundinnen und Kunden die Eigenschaft beim Einrichten der Datenstromkonfiguration unter dem Adobe Target-Namespace auf einer höheren Ebene einrichten:
Das bedeutet, dass jeder Target-Aufruf für diese spezifische Datenstromkonfiguration dieses Eigenschafts-Token enthält.
Wie kann ich Mboxes vorab abrufen?
Verwenden von at.js
Diese Funktion ist nur in at.js 2.x verfügbar. at.js 2.x verfügt über eine neue Funktion namens getOffers
. Mit der Funktion getOffers
können Kunden Inhalte für eine oder mehrere Mboxes vorab abrufen. Siehe folgendes Beispiel:
adobe.target.getOffers({
request: {
prefetch: {
mboxes: [{
index: 0,
name: "test-mbox",
parameters: {
...
},
profileParameters: {
...
}
}]
}
}
})
.then(console.log)
.catch(console.error);
mbox
im mboxes
-Array über einen eigenen Index verfügt. Normalerweise hat die erste Mbox die nächste index=0
und so weiter index=1,
.Verwenden von Platform Web SDK
Diese Funktion wird derzeit in Platform Web SDK nicht unterstützt.
Wie kann ich meine Target debuggen?
Verwenden von at.js
Die at.js-Bibliothek stellt die folgenden Debugging-Funktionen bereit:
- Mbox deaktivieren - Deaktiviert das Abrufen und Rendern von Target, um zu überprüfen, ob die Seite ohne Target Interaktionen beschädigt ist
- Mbox Debug - at.js protokolliert jede Aktion
- Target Trace - mit einem in einem Trace-Objekt generierten Mbox-Trace-Token mit Details, die am Entscheidungsprozess beteiligt waren, ist unter
window.___target_trace
Objekt verfügbar.
Verwenden von Platform Web SDK
Bei Verwendung von Platform Web SDK stehen mehrere Debugging-Funktionen zur Verfügung:
- Verwenden von Assurance
- Web SDK Debug aktiviert
- Verwenden Überwachungs-Hooks für Web SDK
- Verwenden Sie Adobe Experience Platform Debugger
- Zielspur