Fügen Sie Ihren Seiten ContextHub hinzu, um die ContextHub-Funktionen zu aktivieren und eine Verknüpfung mit den ContextHub-JavaScript-Bibliotheken herzustellen.
Die ContextHub-JavaScript-API ermöglicht den Zugriff auf die von ContextHub verwalteten Kontextdaten. Diese Seite enthält einen kurzen Überblick über die wichtigsten Funktionen der API für den Zugriff auf Kontextdaten und deren Bearbeitung. Ausführlichere Informationen und Code-Beispiele finden Sie unter den Links zur API-Referenzdokumentation.
Schließen Sie die contexthub
-Komponente in den Bereich head
Ihrer Seite ein, um die ContextHub-Funktionen zu aktivieren und eine Verknüpfung mit den ContextHub-JavaScript-Bibliotheken herzustellen. Der HTL-Code für Ihre Seitenkomponente sollte in etwa wie im folgenden Beispiel aussehen:
<sly data-sly-resource="${'contexthub' @ resourceType='granite/contexthub/components/contexthub'}"/>
Beachten Sie, dass Sie auch konfigurieren müssen, ob die ContextHub-Symbolleiste im Vorschaumodus angezeigt wird. Siehe Ein- und Ausblenden der ContextHub-Benutzeroberfläche.
Verwenden Sie ContextHub-Stores, um Kontextdaten beizubehalten. ContextHub bietet die folgenden Storetypen, die die Grundlage aller Storetypen bilden:
Alle Speichertypen sind Erweiterungen der Klasse ContextHub.Store.Core
. Informationen zum Erstellen eines neuen Storetyps finden Sie unter Erstellen benutzerdefinierter Stores. Weitere Informationen zu Beispiel-Store-Typen finden Sie unter Beispiele für ContextHub-Store-Kandidaten.
ContextHub-Stores verwenden einen der folgenden Persistenzmodi:
Standardmäßig verwendet ContextHub den lokalen Persistenzmodus. Wenn der Browser HTML5 localStorage nicht unterstützt oder zulässt, wird die Sitzungspersistenz verwendet. Wenn der Browser HTML5 sessionStorage nicht unterstützt oder zulässt, wird die Persistenz Window.name verwendet.
Intern speichern Sie Daten in einer Baumstruktur, sodass Werte als primäre Typen oder komplexe Objekte hinzugefügt werden können. Wenn Sie komplexe Objekte zu Stores hinzufügen, bilden die Objekteigenschaften Zweige in der Datenstruktur. Im folgenden Beispiel wird das folgende komplexe Objekt einem leeren, als Store bezeichneten Ort hinzugefügt:
Object {
number: 321,
data: {
city: "Basel",
country: "Switzerland",
details: {
population: 173330,
elevation: 260
}
}
}
Die Baumstruktur der Speicherdaten kann wie folgt gestaltet werden:
/
|- number
|- data
|- city
|- country
|- details
|- population
|- elevation
Die Baumstruktur definiert Datenelemente im Speicher als Schlüssel-Wert-Paare. Im obigen Beispiel entspricht der Schlüssel /number
dem Wert 321
und der Schlüssel /data/country
dem Wert Switzerland
.
Für die Bearbeitung von JavaScript-Objekten stellt ContextHub die Klasse ContextHub.Utils.JSON.tree
bereit. Mithilfe der Funktionen dieser Klasse können Sie JavaScript-Objekte bearbeiten, bevor Sie sie einem Store hinzufügen oder nachdem Sie sie aus einem Store abgerufen haben.
Darüber hinaus bietet die Klasse ContextHub.Utils.JSON
Funktionen zum Serialisieren von Objekten zu Zeichenfolgen und zum Deserialisieren von Zeichenfolgen zu Objekten. Verwenden Sie diese Klasse zur Behandlung von JSON-Daten, um Browser zu unterstützen, die nativ nicht über die Funktionen JSON.parse
und JSON.stringify
verfügen.
Verwenden Sie das JavaScript-Objekt ContextHub
, um einen Store als JavaScript-Objekt abzurufen. Nach dem Abrufen des Store-Objekts können Sie die darin enthaltenen Daten bearbeiten. Verwenden Sie zum Abrufen des Stores die Funktion getAllStores
oder getStore
.
Die JavaScript-Klasse ContexHub.Store.Core
definiert mehrere Funktionen für die Interaktion mit Store-Daten. Die folgenden Funktionen ermöglichen das Speichern und Abrufen mehrerer in Objekten enthaltener Datenelemente:
Einzelne Datenelemente werden als Satz von Schlüssel/Wert-Paaren gespeichert. Um Werte zu speichern und abzurufen, geben Sie den entsprechenden Schlüssel an:
Beachten Sie, dass benutzerdefinierte Speicherkandidaten weitere Funktionen definieren können, die den Zugriff auf Speicherdaten ermöglichen.
ContextHub kennt nicht standardmäßig die aktuell angemeldeten Benutzer, die auf Veröffentlichungs-Servern verwendet werden, und diese Benutzer werden von ContextHub als "Anonym"betrachtet.
Sie können ContextHub über angemeldete Benutzer informieren, indem Sie den Profil-Store laden. Den Beispiel-Code finden Sie auf GitHub.
ContextHub enthält ein Ereignis-Framework, das automatische Reaktionen auf Store-Ereignisse ermöglicht. Jedes Store-Objekt enthält ein Objekt vom Typ ContextHub.Utils.Eventing
, das als Eigenschaft eventing
des Stores verfügbar ist. Verwenden Sie die Funktion on
oder once
, um eine JavaScript-Funktion an ein Store-Ereignis zu binden.
Die ContextHub JavaScript API bietet Browser-übergreifende Unterstützung für die Behandlung der Cookies von Browsern. Der Namespace ContextHub.Utils.Cookie
definiert eine Reihe von Funktionen zum Erstellen, Bearbeiten und Löschen von Cookies.
Mit der ContextHub-Segment-Engine können Sie ermitteln, welche der registrierten Segmente im aktuellen Kontext aufgelöst werden. Verwenden Sie die Funktion „getResolvedSegments“ der Klasse ContextHub.SegmentEngine.SegmentManager
, um aufgelöste Segmente abzurufen. Verwenden Sie anschließend die Funktion getName
oder getPath
der Klasse ContextHub.SegmentEngine.Segment
, um auf ein Segment zu testen.
ContextHub-Segmente werden unter dem Knoten /conf/<site>/settings/wcm/segments
installiert.
Die folgenden Segmente werden mit der WKND-Tutorial-Site installiert.
Die Regeln zur Auflösung dieser Segmente werden wie folgt zusammengefasst:
Die installierten Segmente werden als Referenzkonfigurationen bereitgestellt, um Ihnen bei der Erstellung einer eigenen dedizierten Konfiguration für Ihr Projekt zu helfen, und sollten daher nicht direkt verwendet werden.
Es gibt verschiedene Optionen zum Debugging von ContextHub, einschließlich der Erstellung von Protokollen. Weitere Informationen finden Sie unter Konfigurieren von ContextHub.
ContextHub bietet eine Diagnoseseite, auf der Sie einen Überblick über das ContextHub-Framework erhalten.