Die neueste Version von at.js Adobe Target bietet umfassende Funktionen, mit denen Ihr Unternehmen mithilfe von Client-seitigen Technologien der neuesten Generation Personalisierungen ausführen kann. Diese neue Version konzentriert sich auf die Aktualisierung von at.js, um harmonische Interaktionen mit Einzelseitenanwendungen (SPAs) zu ermöglichen.
Im Folgenden finden Sie einige Vorteile der Verwendung von at.js 2.x, die in früheren Versionen nicht verfügbar waren:
Möglichkeit zur Zwischenspeicherung aller Angebote beim Seitenladen, um mehrere Server-Aufrufe auf einen einzelnen Server-Aufruf zu reduzieren
Drastische Verbesserung der Erlebnisse Ihrer Endbenutzer auf Ihrer Site, da Angebote sofort über den Cache angezeigt werden, ohne dass die herkömmlichen Serveraufrufe verzögert werden.
Einfaches, einzeiliges Code- und einmaliges Entwicklersetup, damit Ihre Marketing-Fachleute A/B Test- und Experience Targeting (XT)-Aktivitäten über den VEC in Ihren SPAs erstellen und ausführen können.
at.js 2.x-Systemdiagramme
Die folgenden Diagramme helfen Ihnen, den Workflow von at.js 2.x mit Ansichten zu verstehen und zu verstehen, wie dies die SPA-Integration verbessert. Eine bessere Einführung in die in at.js 2.x verwendeten Konzepte finden Sie unter Implementierung von Einzelseiten-Apps.
(Klicken Sie auf das Bild, um es auf die volle Breite zu erweitern.)
{modal="regular"}
Aufruf
Details
1
Ein Aufruf gibt die Experience Cloud ID zurück, falls sich der Benutzer authentifiziert hat. Bei einem weiteren Aufruf wird die Kunden-ID synchronisiert.
2
Die Bibliothek at.js wird synchron geladen und im Dokumentenkörper verborgen.
„at.js“ kann auch asynchron geladen werden, mit der Option, dass ein Code-Ausschnitt auf der Seite vorab ausgeblendet wird.
3
Es wird eine Seitenlade-Anfrage durchgeführt, in der alle konfigurierten Parameter (MCID, SDID und Kunden-ID) enthalten sind.
4
Profilskripte werden ausgeführt und anschließend in den Profilspeicher eingespeist. Der Store fordert qualifizierte Zielgruppen aus der Zielgruppenbibliothek an (z. B. von Adobe Analytics freigegebene Zielgruppen, Audience Manager usw.).
Kundenattribute werden in einem Batch-Prozess an den Profilspeicher übermittelt.
5
Basierend auf den URL-Anfrageparametern und den Profildaten entscheidet Target, welche Aktivitäten und Erlebnisse für die aktuelle Seite und zukünftige Ansichten an den Besucher zurückgegeben werden sollen.
6
Zielgerichteter Inhalt wird zurück an die Seite übermittelt. Dieser enthält optional Profilwerte für eine weitere Personalisierung.
Zielgerichtete Inhalte auf der aktuellen Seite werden so schnell wie möglich angezeigt, ohne dass der Standardinhalt flackert.
Zielgerichtete Inhalte für Ansichten, die als Ergebnis von Benutzeraktionen in einer SPA angezeigt werden, werden im Browser zwischengespeichert, sodass die SPA sofort ohne zusätzlichen Server-Aufruf angezeigt werden kann, wenn die Ansichten durch triggerView() ausgelöst werden.
7
Analytics-Daten werden an Datenerfassungsserver übermittelt.
8
Zielgruppendaten werden über die SDID mit Analytics abgeglichen und in den Analytics-Reporting-Speicher verarbeitet.
Analytics Daten können dann sowohl in Analytics als auch Target über Analytics for Target (A4T)-Berichte angezeigt werden.
Egal, wo triggerView() in Ihrer SPA implementiert ist, werden die Ansichten und Aktionen aus dem Cache abgerufen und dem Benutzer ohne Serveraufruf gezeigt. triggerView() sendet außerdem eine Benachrichtigungsanfrage an das Target-Back-End, um Impressions-Zählungen zu erhöhen und aufzuzeichnen.
(Klicken Sie auf das Bild, um es auf die volle Breite zu erweitern.)
{modal="regular"}
Aufruf
Details
1
triggerView() wird in der Einzelseiten-App aufgerufen, um eine Ansicht wiederzugeben und Aktionen anzuwenden, die visuelle Elemente ändern.
2
Gezielte Inhalte für die Ansicht werden aus dem Cache gelesen.
3
Die zielgerichteten Inhalte werden so schnell wie möglich bereitgestellt, ohne dass Standardinhalte aufflackern.
4
Die Benachrichtigungsanfrage wird an den Target-Profilspeicher gesendet, damit der Besucher in der Aktivität erfasst und die Metrik erhöht wird.
5
Analytics Daten an Datenerfassungs-Server gesendet.
6
Target Daten werden über die SDID mit Analytics Daten abgeglichen und in den Analytics-Reporting-Speicher verarbeitet. Analytics Daten können dann sowohl in Analytics als auch Target über A4T-Berichte angezeigt werden.
Die Bereitstellung von at.js mit Tags in Adobe Experience Platform ist die bevorzugte Methode.
Oder
Laden Sie at.js 2.x manuell über die Target-Benutzeroberfläche herunter und stellen Sie es mit der Methode Ihrer Wahl bereit.
Nicht mehr unterstützte Funktionen von at.js
Es gibt mehrere Funktionen, die in at.js 2.x veraltet sind.
WARNING
Wenn diese veralteten Funktionen auf Ihrer Site weiterhin verwendet werden, wenn at.js 2.x bereitgestellt wird, werden Konsolenwarnungen angezeigt. Beim Aktualisieren wird empfohlen, die Bereitstellung von at.js 2.x in einer Staging-Umgebung zu testen. Stellen Sie dabei sicher, dass Sie alle Warnhinweise durchgehen, die in der Konsole protokolliert wurden, und die veralteten Funktionen in die neuen Funktionen übersetzen, die in at.js 2.x eingeführt wurden.
Sie finden die veralteten Funktionen und das zugehörige Gegenstück unten. Eine vollständige Liste der Funktionen finden Sie unter „at.js“-Funktionen.
NOTE
at.js 2.x blendet mboxDefault markierten Elemente nicht mehr automatisch vorab aus. Kunden müssen daher die Pre-Hide-Logik entweder manuell auf der Site selbst oder über einen Tag-Manager verwalten.
mboxCreate(mbox,params)
Beschreibung:
Führt eine Anfrage aus und wendet das Angebot auf das nächste DIV mit dem mboxDefault-Klassennamen an.
Beispiel:
<div class="mboxDefault">
default content to replace by offer
</div>
<script>
mboxCreate('mboxName','param1=value1','param2=value2');
</script>
at.js 2.x Äquivalent
Eine Alternative zu mboxCreate(mbox, params) sind getOffer() und applyOffer().
Beispiel:
<div class="mboxDefault">
default content to replace by offer
</div>
<script>
var el = document.currentScript.previousElementSibling;
adobe.target.getOffer({
mbox: "mboxName",
params: {
param1: "value1",
param2: "value2"
},
success: function(offer) {
adobe.target.applyOffer({
mbox: "mboxName",
selector: el,
offer: offer
});
},
error: function(error) {
console.error(error);
el.style.visibility = "visible";
}
});
</script>
„mboxDefine()“ und „mboxUpdate()“
Beschreibung:
Erstellt eine interne Zuordnung zwischen einem Element und einem Mbox-Namen, führt die Anforderung jedoch nicht aus. Wird zusammen mit mboxUpdate() verwendet, was die Anfrage ausführt und das Angebot auf das in mboxDefine() von der nodeId identifizierte Element anwendet. Die Funktion kann auch dazu genutzt werden, eine Mbox zu aktualisieren, die durch mboxCreate initiiert wurde.
Eine Alternative zu mboxDefine() und mboxUpdate sind getOffer() und applyOffer(), mit Verwendung der Selektor-Option in applyOffer(). Mit diesem Ansatz können Sie das Angebot einem Element mit jedem CSS-Selektor zuordnen, nicht nur mit einem mit einer ID.
Stellt eine Standardart zur Registrierung bestimmter Erweiterungen dar.
Dies wird nicht mehr unterstützt und sollte nicht verwendet werden.
Zusammenfassung veralteter, neuer und unterstützter at.js-Funktionen in 2.x
Methode
Unterstützt?
Neu?
Nicht mehr verwendet?
(Standardinhalt wird angezeigt)
getOffer()
Ja
getOffers()
Ja
applyOffer()
Ja
applyOffers()
Ja
triggerView()
Ja
trackEvent()
Ja
mboxCreate()
Ja
mboxDefine()
mboxUpdate()
Ja
targetGlobalSettings()
Ja
Data Providers
Ja
targetPageParams()
Ja
targetPageParamsAll()
Ja
registerExtension()
Ja
At.js Custom Events
Ja
Einschränkungen und Legenden
Beachten Sie die folgenden Einschränkungen und Legenden:
Konversions-Tracking
Kunden, die mboxCreate() für ihr Konversions-Tracking verwenden, müssen trackEvent() oder getOffer() benutzen.
Bereitstellung von Angeboten
Kunden, die mboxCreate() nicht durch getOffer() oder applyOffer() ersetzen, riskieren möglicherweise, dass Angebote nicht bereitgestellt werden.
Kann at.js 2.x auf einigen Seiten verwendet werden, während at.js 1.x auf anderen Seiten verwendet wird?
Ja, das Besucherprofil wird über verschiedene Seiten mit verschiedenen Versionen und Bibliotheken hinweg erhalten. Das Cookie-Format ist identisch.
Neue API-Verwendung in at.js 2.x
at.js 2.x verwendet eine neue API, die wir Bereitstellungs-API nennen. Um zu debuggen, ob at.js den Target Edge-Server korrekt aufruft, können Sie die Registerkarte „Netzwerk“ der Entwickler-Tools Ihres Browsers nach „Bereitstellung“, “tt.omtrdc.net” oder Ihrem Client-Code filtern. Sie werden außerdem feststellen, dass Target eine JSON-Nutzlast anstelle von Schlüssel/Wert-Paaren sendet.
Target Globale Mbox wird nicht mehr verwendet
In at.js 2.x wird “target-global-mbox” in den Netzwerkaufrufen nicht mehr angezeigt. Stattdessen haben wir in der JSON-Payload, die an die Target-Server gesendet wird, die Syntax “target-global-mbox” durch “execute > pageLoad” ersetzt, wie unten dargestellt:
Im Grunde wurde das Konzept der globalen Mbox eingeführt, um Target mitzuteilen, ob Angebote und Inhalt beim Laden der Seite abgerufen werden sollten. Daher haben wir dies in unserer neuesten Version deutlicher gemacht.
Ist der Name der globalen Mbox in at.js nicht mehr wichtig?
Kunden können einen globalen Mbox-Namen über Target > Administration > Implementation > Edit at.js Settings angeben. Diese Einstellung wird von den Target-Edge-Servern verwendet, um „Ausführen > Seite laden“ in den globalen Mbox-Namen zu übersetzen, der in der Target-Benutzeroberfläche angezeigt wird. Dadurch können Kunden mit dem globalen Mbox-Namen weiterhin Server-seitige APIs, den Form-Based Composer und Profilskripts verwenden und Zielgruppen erstellen. Wir empfehlen dringend, auch auf der Seite Administration > Visual Experience Composer denselben globalen Mbox-Namen zu konfigurieren, falls Sie noch Seiten haben, die at.js 1.x verwenden, wie in den folgenden Abbildungen dargestellt.
und
Muss die Einstellung für die automatische Erstellung einer globalen Mbox für at.js 2.x aktiviert werden?
In den meisten Fällen ja. Diese Einstellung weist at.js 2.x an, beim Laden der Seite eine Anfrage an die Target Edge-Server auszulösen. Da die globale Mbox als „Ausführen > Seite laden“ übersetzt wird, sollte diese Einstellung aktiviert sein, wenn Sie eine Anfrage beim Laden der Seite auslösen möchten.
Funktionieren bestehende VEC-Aktivitäten weiterhin, auch wenn der Name der globalen Mbox in at.js 2.x nicht angegeben ist?
Ja, weil „Ausführen > Seite laden“ auf dem Target-Backend wie target-global-mbox behandelt wird.
Wenn meine formularbasierten Aktivitäten auf target-global-mbox zielen, funktionieren diese Aktivitäten weiterhin?
Ja, weil „Ausführen > Seite laden“ auf den Target-Edge-Servern wie target-global-mbox behandelt wird.
Unterstützte und nicht unterstützte at.js 2.x-Einstellungen
Einstellung
Unterstützt?
X-Domäne
Nein
Globale Mbox automatisch erstellen
Ja
Globaler Mbox-Name
Ja
Unterstützung für Domain-übergreifendes Tracking in at.js 2.x
Durch domänenübergreifendes Tracking können Besucher auf verschiedenen Domänen verbunden werden. Da für jede Domain ein neues Cookie erstellt werden muss, ist es schwierig, Besucher zu tracken, wenn sie beim Navigation von einer Domain zu einer anderen wechseln. Um domänenübergreifendes Tracking zu ermöglichen, verwendet Target ein Drittanbieter-Cookie, um Besucher über verschiedene Domänen hinweg zu verfolgen. Auf diese Weise können Sie eine Target-Aktivität erstellen, die sich über siteA.com und siteB.com erstreckt, während Besuchern dasselbe Erlebnis angezeigt wird, auch wenn sie die Domain wechseln. Diese Funktion ist mit dem Verhalten von Drittanbietern und Erstanbieter-Cookies von Target verknüpft.
NOTE
Domain-übergreifendes Tracking wird ab at.js 2.10 unterstützt, wird aber in at.js 2.x vor 2.10 nicht standardmäßig unterstützt. Domain-übergreifendes Tracking wird in at.js 2.x über die Experience Cloud ID (ECID) Library v4.3.0+ unterstützt.
Target wird das Drittanbieter-Cookie in <CLIENTCODE>.tt.omtrdc.net gespeichert. Das Erstanbieter-Cookie wird in clientdomain.com gespeichert. Die erste Anfrage gibt HTTP-Antwort-Header zurück, die versuchen, Drittanbieter-Cookies namens mboxSession und mboxPC festzulegen. Eine Weiterleitungsanfrage wird zusammen mit einem zusätzlichen Parameter (mboxXDomainCheck=true) zurückgesendet. Wenn der Browser Drittanbieter-Cookies akzeptiert, enthält die Weiterleitungsanfrage diese Cookies und das Erlebnis wird zurückgegeben. Dieser Workflow ist möglich, da wir die HTTP GET-Methode verwenden.
In at.js 2.x wird HTTP GET jedoch nicht verwendet. Stattdessen wird HTTP POST über at.js 2.x verwendet, um JSON-Payloads an Target Edge-Server zu senden. Die Verwendung von HTTP-POST bedeutet, dass die Umleitungsanfrage, um zu überprüfen, ob ein Browser Drittanbieter-Cookies unterstützt, beschädigt wird. Dies liegt daran, dass HTTP GET-Anfragen idempotent sind, während HTTP POST nicht idempotent ist und nicht willkürlich wiederholt werden darf. Daher wird domänenübergreifendes Tracking in at.js 2.x (vor 2.10) standardmäßig nicht unterstützt. Nur at.js 1.x unterstützt standardmäßig das Domain-übergreifende Tracking.
Um Domain-übergreifendes Tracking für at.js v2.10 oder höher zu verwenden, haben Sie folgende Möglichkeiten:
Installieren Sie ECID-Bibliothek v4.3.0+ in Verbindung mit at.js 2.x. Die ECID-Bibliothek hat den Zweck, persistente IDs zu verwalten, die zur domänenübergreifenden Identifizierung eines Besuchers verwendet werden können. Nach der Installation der ECID-Bibliothek v4.3.0+ und at.js 2.x können Sie Aktivitäten erstellen, die mehrere Domänen umfassen und Benutzer tracken können. Beachten Sie, dass diese Funktion erst nach Ablauf der Sitzung funktioniert.
Anstatt die ECID-Bibliothek zu installieren, können Sie bei Verwendung von at.js v2.10 oder höher die Einstellung Domain-übergreifend in der Target-Benutzeroberfläche unter Administration > Implementation aktivieren. (Alternativ können Sie die Option crossDomain im at.js Code auf enabled setzen.)
Um domänenübergreifendes Tracking für Versionen von at.js v2.x vor 2.10 zu verwenden, können Sie die oben stehende Option #1 implementieren (installieren Sie die ECID-Bibliothek).
Automatische Erstellung einer globalen Mbox wird unterstützt
Diese Einstellung weist at.js 2.x an, beim Laden der Seite eine Anfrage an die Target Edge-Server auszulösen. Da die globale Mbox als „Ausführen > Seite laden“ übersetzt wird und dies von den Target-Edge-Servern interpretiert wird, sollten Kunden dies aktivieren, wenn sie eine Anfrage beim Laden der Seite auslösen möchten.
Globaler Mbox-Name wird unterstützt
Kunden können einen globalen Mbox-Namen über Target > Administration > Implementation > Edit angeben. Diese Einstellung wird von den Target-Edge-Servern verwendet, um „Ausführen > Seite laden“ in den eingegebenen globalen Mbox-Namen zu übersetzen. Dadurch können Kunden weiterhin Server-seitige APIs, den formularbasierten Composer und Profilskripts verwenden und Zielgruppen erstellen, die auf die globale Mbox zielen.
Gelten die folgenden benutzerdefinierten at.js-Ereignisse für triggerView() oder gilt dies nur für applyOffer() oder applyOffers()?
adobe.target.event.CONTENT_RENDERING_FAILED
adobe.target.event.CONTENT_RENDERING_SUCCEEDED
adobe.target.event.CONTENT_RENDERING_NO_OFFERS
adobe.target.event.CONTENT_RENDERING_REDIRECT
Ja, die benutzerdefinierten at.js-Ereignisse gelten auch für triggerView().
Wenn ich triggerView() mit {"page" : "true"} aufrufe, werde eine Benachrichtigung an das Target-Backend gesendet und die Impression erhöht. Führt dies auch dazu, dass die Profilskripts ausgeführt werden?
Wenn ein Prefetch-Aufruf an das Target-Backend erfolgt, werden die Profilskripts ausgeführt. Anschließend werden die betroffenen Profildaten verschlüsselt und an die Client-Seite zurückgegeben. Nachdem triggerView() mit {"page": "true"} aufgerufen wurde, wird eine Benachrichtigung zusammen mit den verschlüsselten Profildaten gesendet. Dann entschlüsselt das Target-Backend die Profildaten und speichert sie in den Datenbanken.
Müssen wir vor dem Aufrufen von triggerView() Pre-hiding-Code hinzufügen, um Flackern zu verhindern?
Nein, Sie müssen vor dem Aufrufen von triggerView() keinen Pre-hiding-Code hinzufügen. at.js 2.x verwaltet die Logik des Vorab-Ausblendens und Flackerns, bevor die Ansicht angezeigt und angewendet wird.
Welche at.js 1.x-Parameter zum Erstellen von Zielgruppen werden in at.js 2.x nicht?
Die folgenden at.js 1.x-Parameter werden NICHT derzeit für die Erstellung von Zielgruppen bei Verwendung von at.js 2.x unterstützt:
browserHeight
browserWidth
browserTimeOffset
screenHeight
screenWidth
screenOrientation
colorDepth
devicePixelRatio
vst.*-Parameter (siehe unten)
at.js 2.x unterstützt nicht das Erstellen von Zielgruppen mit vst.*-Parametern
Kunden mit at.js 1.x konnten vst.*-Mbox-Parameter verwenden, um Zielgruppen zu erstellen. Dies war ein unbeabsichtigter Nebeneffekt davon, wie at.js 1.x Mbox-Parameter an das Target-Backend sendete. Nach der Migration zu at.js 2.x können Sie mit diesen Parametern keine Zielgruppen mehr erstellen, da at.js 2.x Mbox-Parameter anders sendet.
Kompatibilität von at.js
Die folgenden Tabellen erläutern die at.js. 2.x Kompatibilität mit verschiedenen Aktivitätstypen, Integrationen, Funktionen und at.js-Funktionen.
Aktivitätstypen
Typ
Unterstützt?
A/B Test
Ja
Auto-Allocate
Ja
Auto-Target
Ja
Experience Targeting
Ja
Multivariate Test
Ja
Automated Personalization
Ja
Recommendations
Ja
NOTE
Auto-Target Aktivitäten werden über at.js 2.x und den VEC unterstützt, wenn alle Änderungen auf die Page Load Event angewendet werden. Wenn Änderungen an bestimmten Ansichten hinzugefügt werden, werden nur A/B Test-, Auto-Allocate- und Experience Targeting (XT)-Aktivitäten unterstützt.
at.js 2.x verwendet genau wie at.js 1.x die benutzerdefinierte at-request-succeeded, um Antwort-Token zu präsentieren. Codebeispiele, die das at-request-succeeded benutzerdefinierte Ereignis verwenden, finden Sie unter Antwort-Token.
at.js 1.x-Parameter zur at.js 2.x-Payload-Zuordnung
In diesem Abschnitt werden die Zuordnungen zwischen at.js 1.x und at.js 2.x beschrieben.
Beachten Sie vor dem Befassen mit der Parameterzuordnung, dass sich die Endpunkte, die diese Bibliotheksversionen verwenden, geändert haben:
Ein weiterer wichtiger Unterschied besteht darin, dass:
at.js 1.x - Client-Code ist Teil des Pfads
at.js 2.x - Client-Code wird als Abfragezeichenfolgenparameter gesendet, z. B.: http://<client code>.tt.omtrdc.net/rest/v1/delivery?client=democlient
In den folgenden Abschnitten werden jeder at.js 1.x-Parameter, seine Beschreibung und die entsprechende 2.x JSON-Payload (falls zutreffend) aufgeführt:
Die WEB-GL-Renderer-Funktionen des Browsers. Dies wird von unserem Geräteerkennungsmechanismus verwendet, um festzustellen, ob das Gerät des Besuchers ein Desktop, iPhone, Android-Gerät usw. ist.
Version wird als Abfragezeichenfolgenparameter über den Versionsparameter gesendet.
Schulungsvideo: at.js 2.x Architekturdiagramm
at.js 2.x erweitert die Unterstützung von Adobe Target für SPAs und integriert diese in andere Experience Cloud-Lösungen. In diesem Video wird erklärt, wie alles zusammenkommt.