Übersicht über die Adobe Client-Datenschicht
Die Adobe Client-Datenschicht (ACDL) ist eine kleine Open-Source-JavaScript-Bibliothek, die Ihrer Website eine standardmäßige Möglichkeit bietet, Daten und Ereignisse für beliebige Skripte auf der Seite verfügbar zu machen. Ihr Site-Code überträgt Daten und Ereignisse an ein JavaScript-Array namens adobeDataLayer. Tag-Regeln, die Web-SDK und andere Skripte lesen diese Daten und überwachen diese Ereignisse, unabhängig davon, wann das ACDL-Skript geladen wird.
Dieses Handbuch dokumentiert die ACDL-Bibliothek. Informationen zur Verwendung von ACDL in der Datenerfassungs-UI finden Sie in der Tag-Erweiterung der Adobe-Client-Datenschicht.
Gründe für die Verwendung einer Datenschicht why
Ohne Datenschicht kratzen Tags häufig Werte von der Seite ab, z. B. Text im DOM oder Parameter in der URL. Diese Implementierungen funktionieren nicht mehr, wenn sich das Seiten-Design ändert, und sie können nur erfassen, was die Seite anzeigt. Eine Datenschicht trennt zwei Verantwortlichkeiten:
- Ihr Website-Code beschreibt, was auf der Seite geschieht, z. B. der Seitenname, das Produkt, das ein Besucher angesehen hat, oder das Formular, das er gesendet hat.
- Ihre Tags und andere Skripte entscheiden, was mit diesen Informationen geschehen soll, z. B. welche Daten wann an Adobe gesendet werden.
ACDL fügt diesem Muster die folgenden Funktionen hinzu:
- Asynchrones Laden. Site-Code kann Daten pushen, bevor das ACDL-Skript geladen wird. ACDL verarbeitet beim Laden alles in der richtigen Reihenfolge, sodass Sie es mit
asyncoderdeferladen können, ohne Daten zu verlieren. - Ereignisse und Listener. Skripte können auf benannte Ereignisse oder Datenänderungen warten, einschließlich Ereignisse, die vor dem Hinzufügen des Listeners aufgetreten sind.
- Berechneter Status. ACDL führt jeden Daten-Push in einem einzigen Objekt zusammen, das jedes Skript jederzeit lesen kann.
- Verlauf. Das -Array speichert die Daten und Ereignisse, die gepusht wurden, um die Implementierung zu debuggen.
Funktionsweise how-it-works
ACDL basiert auf einem einfachen JavaScript-Array:
- Ihre Seite erstellt das
window.adobeDataLayer-Array, falls es noch nicht vorhanden ist. - Ihr Website-Code fügt Elemente mit
push()zum Array hinzu. Ein Element kann ein Datenobjekt, ein Ereignisobjekt oder eine Funktion sein. Bevor ACDL geladen wird, warten diese Elemente im Array wie eine Warteschlange. - Wenn das ACDL-Skript geladen wird, fügt es dem Array Methoden hinzu, z. B.
getState()undaddEventListener(), und ersetztpush()durch seine eigene Version. Anschließend verarbeitet es jedes Element in der Warteschlange in der Reihenfolge, in der es gepusht wurde. - Ab diesem Zeitpunkt verarbeitet ACDL jedes neue Element, sobald es gepusht wird. Sie führt Daten in den berechneten Status zusammen, ruft übereinstimmende Ereignis-Listener auf und speichert Daten und Ereignisobjekte im Array als History.
// Site code: describe what happened on the page
window.adobeDataLayer = window.adobeDataLayer || [];
window.adobeDataLayer.push({
page: { title: "Home", language: "en" }
});
window.adobeDataLayer.push({ event: "page view" });
// Another script: react to what happened
window.adobeDataLayer.push(function(dl) {
dl.addEventListener("page view", function(event) {
console.log("Page title:", dl.getState("page.title"));
});
});
Da der Listener den Standard allBereich verwendet wird er für das page view Ereignis ausgeführt, obwohl dieses Ereignis zuerst gepusht wurde.
ACDL speichert und verteilt Daten innerhalb der Seite. Es sendet keine Daten. Um Daten an Adobe zu senden, verwenden Sie Tags oder die Web-SDK, um aus der Datenschicht zu lesen. Siehe Senden von Adobe Client-Datenschichtdaten mit der Web-SDK.
Funktionsweise von ACDL mit anderen Adobe-Tools adobe-tools
Datenformat data-format
ACDL erfordert keine bestimmte Datenstruktur. Sie können jedes einfache Objekt per Push übertragen und ACDL führt es in den berechneten Status zusammen. Da viele Skripte und Teams auf dieselben Daten angewiesen sind, sollten die folgenden Best Practices berücksichtigt werden:
- Legen Sie eine Struktur fest bevor Sie in die Datenschicht schreiben, und dokumentieren Sie sie für alle, die Daten per Push übertragen oder lesen.
- Verwenden Sie JSON-kompatible Werte z. B. Zeichenfolgen, Zahlen, boolesche Werte, einfache Objekte und Arrays. Andere Werte, z. B.
DateObjekte und Funktionen, überleben die Zusammenführung nicht. Siehe Werttypen. - Betrachten Sie Ihr Ziel. Wenn Sie die Daten an Adobe Experience Platform senden, können Sie sie so strukturieren, dass sie Ihrem XDM-Schema ähneln, sodass Sie sie einfach zuordnen können, oder Ihre eigene Struktur beibehalten und sie im Datenstrom mit " für die Datenerfassung“ .
Browser-Anforderungen browser-requirements
ACDL 3.x verwendet die structuredClone() des Browsers und eine moderne JavaScript-Syntax. Sie erfordert einen der folgenden Browser oder höher:
- Chrome 98
- Edge 98
- Firefox 94
- Safari 15.4
ACDL 2.x stellt niedrigere Browser-Anforderungen. Siehe Upgrade von 2.x auf 3.x für die Unterschiede zwischen den Versionen.
Versionen und Quell-Code source
ACDL ist Open Source unter der Apache-Lizenz 2.0.
- Source-Code und Probleme:
adobe/adobe-client-data-layerauf GitHub - Package:
@adobe/adobe-client-data-layeron npm - Versionshinweise: GitHub-Versionen
Um zu überprüfen, welche Version auf einer Seite ausgeführt wird, lesen Sie die version Eigenschaft in der Browser-Konsole:
adobeDataLayer.version