ClientContext nei dettagli

ClientContext rappresenta una raccolta assemblata dinamicamente di dati utente. Puoi utilizzare i dati per determinare il contenuto da visualizzare su una pagina web in una determinata situazione (targeting del contenuto). I dati sono disponibili anche per l’analisi dei siti web e per qualsiasi JavaScript sulla pagina.

ClientContext è costituito principalmente dai seguenti aspetti:

• Archivio di sessione contenente i dati utente.
• L’interfaccia utente che visualizza i dati utente e fornisce gli strumenti per simulare l’esperienza utente.
• A API JavaScript per interagire con gli archivi di sessione.

Per creare un archivio di sessione autonomo e aggiungerlo a ClientContext oppure creare un archivio di sessione associato a un componente Archivio di sessione autonomo. Adobe Experience Manager (AEM) installa diversi componenti dell’archivio contestuale che puoi utilizzare immediatamente. Puoi utilizzare questi componenti come base per i tuoi componenti.

Per informazioni sull’apertura di ClientContext, sulla configurazione delle informazioni visualizzate e sulla simulazione dell’esperienza utente, consulta ClientContext.

Archivi sessione

ClientContext include vari archivi di sessione che contengono dati utente. I dati dell’archivio provengono dalle seguenti origini:

• Il browser Web client.
• Il server (vedere Store JSONP per l'archiviazione di informazioni da fonti di terze parti)

Il framework ClientContext fornisce un API JavaScript che puoi utilizzare per interagire con gli archivi di sessione per leggere e scrivere i dati utente e per ascoltare e reagire agli eventi di archiviazione. Puoi anche creare archivi di sessione per i dati utente da utilizzare per il targeting del contenuto o per altri scopi.

I dati dell'archivio sessione rimangono nel client. ClientContext non riscrive i dati sul server. Per inviare dati al server, utilizza un modulo o sviluppa JavaScript personalizzato.

Ogni archivio sessione è una raccolta di coppie proprietà-valore. L’archivio delle sessioni rappresenta una raccolta di dati (di qualsiasi tipo) il cui significato concettuale può essere deciso dal progettista, dallo sviluppatore o da entrambi. L’esempio di codice JavaScript che segue definisce un oggetto che rappresenta i dati di profilo che l’archivio di sessione potrebbe contenere:

{
  age: 20,
  authorizableId: "aparker@geometrixx.info",
  birthday: "27 Feb 1992",
  email: "aparker@geometrixx.info",
  formattedName: "Alison Parker",
  gender: "female",
  path: "/home/users/geometrixx/aparker@geometrixx.info/profile"
}

Un archivio di sessione può essere mantenuto per tutte le sessioni del browser o può durare solo per la sessione del browser in cui viene creato.

Componenti archivio contesto

Un componente archivio contesto è un componente CQ che può essere aggiunto a ClientContext. In genere, i componenti dell’archivio di contesto visualizzano i dati di un archivio di sessione a cui sono associati. Tuttavia, le informazioni visualizzate dai componenti dell’archivio di contesto non sono limitate ai dati dell’archivio di sessione.

I componenti dell’archivio contesto possono includere i seguenti elementi:

• Script JSP che definiscono l’aspetto in ClientContext.
• Proprietà per elencare il componente nel Sidekick.
• Finestre di dialogo di modifica per la configurazione delle istanze dei componenti.
• JavaScript che inizializza l’archivio della sessione.

Per una descrizione dei componenti dell'archivio di contesto installati che è possibile aggiungere all'archivio di contesto, vedere Componenti ClientContext disponibili.

Consegna mirata dei contenuti

Le informazioni sul profilo vengono utilizzate anche per la consegna contenuto di destinazione.

Aggiunta Di ClientContext A Una Pagina

Includi il componente ClientContext nella sezione body delle pagine web per abilitare ClientContext. Il percorso del nodo del componente ClientContext è /libs/cq/personalization/components/clientcontext. Per includere il componente, aggiungi il seguente codice al file JSP del componente Pagina, che si trova appena sotto il body elemento della pagina:

<cq:include path="clientcontext" resourceType="cq/personalization/components/clientcontext"/>

Il componente clientcontext fa sì che la pagina carichi le librerie client che implementano ClientContext.

• API JavaScript ClientContext.
• Framework ClientContext che supporta gli archivi di sessione, la gestione degli eventi e così via.
• Segmenti definiti.
• Gli script init.js generati per ogni componente dell’archivio di contesto aggiunto a ClientContext.
• (Solo istanza Autore) Interfaccia utente di ClientContext.

L’interfaccia utente ClientContext è disponibile solo nell’istanza di authoring.

Estensione ClientContext

Per estendere ClientContext, crea un archivio sessione e, facoltativamente, visualizza i dati dell’archivio:

• Crea un archivio di sessione per i dati utente necessari per il targeting dei contenuti e l’analisi web.
• Crea un componente archivio di contesto per consentire agli amministratori di configurare l’archivio di sessione associato e di visualizzare i dati dell’archivio in ClientContext a scopo di test.

Creazione di un archivio sessioni

Crea un archivio di sessione per i dati da aggiungere e recuperare da ClientContext. In genere, per creare un archivio di sessione si utilizza la procedura seguente:

1. Crea una cartella della libreria client con categories valore proprietà di personalization.stores.kernel. ClientContext carica automaticamente le librerie client di questa categoria.

2. Configura la cartella della libreria client in modo che abbia una dipendenza dal personalization.core.kernel cartella della libreria client. Il personalization.core.kernel La libreria client fornisce l’API JavaScript ClientContext.

3. Aggiungi il JavaScript che crea e inizializza l’archivio della sessione.

L’inclusione di JavaScript nella libreria client personalization.store.kernel determina la creazione dell’archivio al caricamento del framework ClientContext.

Tipi di archivi di sessione

Gli archivi di sessione vengono creati e disponibili durante una sessione del browser oppure vengono memorizzati in modo permanente nell’archiviazione del browser o nei cookie. L’API JavaScript ClientContext definisce diverse classi che rappresentano entrambi i tipi di archivi dati:

• [CQ_Analytics.SessionStore](/docs/experience-manager-65/developing/personlization/client-context/ccjsapi.html?lang=it#cq-analytics-sessionstore): questi oggetti risiedono solo nel DOM della pagina. I dati vengono creati e memorizzati per tutta la durata della pagina.
• [CQ_Analytics.PerstistedSessionStore](/docs/experience-manager-65/developing/personlization/client-context/ccjsapi.html?lang=it#cq-analytics-persistedsessionstore): questi oggetti risiedono nel DOM della pagina e vengono mantenuti nell’archiviazione del browser o nei cookie. I dati sono disponibili su più pagine e tra sessioni utente.

L’API fornisce anche estensioni di queste classi, specializzate per l’archiviazione di dati JSON o JSONP:

• Oggetti di sola sessione: CQ_Analytics.JSONStore e CQ_Analytics.JSONPStore.

• Oggetti persistenti: CQ_Analytics.PersistedJSONStore e CQ_Analytics.PersistedJSONPStore.

Creazione dell'oggetto archivio sessione

Il JavaScript della cartella della libreria client crea e inizializza l’archivio della sessione. L’archivio sessione deve essere registrato utilizzando Context Store Manager. Nell'esempio seguente viene creata e registrata una CQ_Analytics.SessionStore oggetto.

//Create the session store
if (!CQ_Analytics.MyStore) {
    CQ_Analytics.MyStore = new CQ_Analytics.SessionStore();
    CQ_Analytics.MyStore.STOREKEY = "MYSTORE";
    CQ_Analytics.MyStore.STORENAME = "mystore";
    CQ_Analytics.MyStore.data={};
}
//register the session store
if (CQ_Analytics.ClientContextMgr){
    CQ_Analytics.ClientContextMgr.register(CQ_Analytics.MyStore)
}

Per l’archiviazione dei dati JSON, l’esempio che segue crea e registra un CQ_Analytics.JSONStore oggetto.

if (!CQ_Analytics.myJSONStore) {
    CQ_Analytics.myJSONStore = CQ_Analytics.JSONStore.registerNewInstance("myjsonstore",{});
}

Creazione di un componente archivio contesto

Crea un componente archivio di contesto per eseguire il rendering dei dati archivio sessione in ClientContext. Una volta creato, puoi trascinare il componente archivio di contesto in ClientContext per eseguire il rendering dei dati da un archivio di sessione. I componenti dell’archivio contesto sono costituiti dai seguenti elementi:

• Script JSP per il rendering dei dati.
• Una finestra di dialogo per modifica.
• Uno script JSP per l’inizializzazione dell’archivio di sessione.
• (Facoltativo) Cartella della libreria client che crea l'archivio sessione. Non è necessario includere la cartella della libreria client se il componente utilizza un archivio di sessione esistente.

Estensione dei componenti dell’archivio contesto forniti

AEM fornisce i componenti archivio dati generico e archivio dati contestuali genericstoreproperties che è possibile estendere. La struttura dei dati del tuo archivio determina il componente che estendi:

• Coppie proprietà-valore: estendere GenericStoreProperties componente. Questo componente esegue automaticamente il rendering degli archivi di coppie proprietà-valore. Vengono forniti diversi punti di interazione:

  • prolog.jsp e epilog.jsp: interazione tra componenti che consente di aggiungere logica lato server prima o dopo il rendering del componente.

• Dati complessi: estendere GenericStore componente. L’archivio delle sessioni necessita di un metodo "renderer" chiamato ogni volta che è necessario eseguire il rendering del componente. La funzione di rendering viene chiamata con due parametri:

  • @param {String} store
    Archivio di cui eseguire il rendering

  • @param {String} divId
    ID del div in cui deve essere eseguito il rendering dell’archivio.

Configurazione dell'aspetto nel Sidekick

Quando si modifica ClientContext, i componenti dell’archivio contestuale vengono visualizzati nel Sidekick. Come per tutti i componenti, il componentGroup e jcr:title le proprietà del componente contesto client determinano il gruppo e il nome del componente.

Tutti i componenti che hanno un componentGroup valore proprietà di Client Context viene visualizzato in Sidekick per impostazione predefinita. Se utilizzi un valore diverso per componentGroup , è necessario aggiungere manualmente il componente al Sidekick utilizzando la modalità Progettazione.

Istanze componente archivio contesto

Quando aggiungi un componente archivio contesto a ClientContext, viene creato un nodo che rappresenta l’istanza del componente /etc/clientcontext/default/content/jcr:content/stores. Questo nodo contiene i valori delle proprietà configurati utilizzando la finestra di dialogo per modifica del componente.

Quando ClientContext viene inizializzato, questi nodi vengono elaborati.

Inizializzazione dell'archivio sessioni associato

Aggiungi un file init.js.jsp al componente per generare il codice JavaScript che inizializza l’archivio sessioni utilizzato dal componente archivio contesto. Ad esempio, utilizza lo script di inizializzazione per recuperare le proprietà di configurazione del componente e utilizzarle per popolare l’archivio della sessione.

Il JavaScript generato viene aggiunto alla pagina quando ClientContext viene inizializzato al caricamento della pagina sia sulle istanze di authoring che di pubblicazione. Questa JSP viene eseguita prima del caricamento e del rendering dell’istanza del componente dell’archivio di contesto.

Il codice deve impostare il tipo MIME del file su text/javascript, o non viene eseguito.

La procedura seguente crea il file di script init.js.jsp e aggiunge il codice che imposta il tipo mime corretto. Segue il codice che esegue l'inizializzazione dell'archivio.

1. Fai clic con il pulsante destro del mouse sul nodo del componente archivio di contesto e fai clic su Crea > Crea file.

2. Nel campo Nome digitare init.js.jsp e quindi fare clic su OK.

3. Nella parte superiore della pagina, aggiungi il seguente codice e fai clic su Salva tutto.

   <%@page contentType="text/javascript" %>
   

Rendering dei dati dell'archivio sessione per i componenti genericstoreproperties

Visualizza i dati dell’archivio sessioni in ClientContext utilizzando un formato coerente.

Visualizzazione dei dati delle proprietà

La taglib di personalizzazione fornisce le personalization:storePropertyTag tag che visualizza il valore di una proprietà da un archivio sessione. Per utilizzare il tag, includi la seguente riga di codice nel file JSP:

<%@taglib prefix="personalization" uri="https://www.day.com/taglibs/cq/personalization/1.0" %>

Il tag ha il seguente formato:

<personalization:storePropertyTag propertyName="property_name" store="session_store_name"/>

Il propertyName attribute è il nome della proprietà store da visualizzare. Il store attribute è il nome dell’archivio registrato. Il seguente tag di esempio visualizza il valore del authorizableId proprietà del profile memorizzare:

<personalization:storePropertyTag propertyName="authorizableId" store="profile"/>

Struttura HTML

La cartella della libreria client personalization.ui (/etc/clientlibs/foundation/personalization/ui/theme/default?lang=it) fornisce gli stili CSS utilizzati da ClientContext per formattare il codice HTML. Il codice seguente illustra la struttura consigliata da utilizzare per la visualizzazione dei dati dell'archivio:

<div class="cq-cc-store">
   <div class="cq-cc-thumbnail">
      <div class="cq-cc-store-property">
           <!-- personalization:storePropertyTag for the store thumbnail image goes here -->
      </div>
   </div>
   <div class="cq-cc-content">
       <div class="cq-cc-store-property cq-cc-store-property-level0">
           <!-- personalization:storePropertyTag for a store property goes here -->
       </div>
       <div class="cq-cc-store-property cq-cc-store-property-level1">
           <!-- personalization:storePropertyTag for a store property goes here -->
       </div>
       <div class="cq-cc-store-property cq-cc-store-property-level2">
           <!-- personalization:storePropertyTag for a store property goes here -->
       </div>
       <div class="cq-cc-store-property cq-cc-store-property-level3">
           <!-- personalization:storePropertyTag for a store property goes here -->
       </div>
   </div>
   <div class="cq-cc-clear"></div>
</div>

Il /libs/cq/personalization/components/contextstores/profiledata il componente archivio di contesto utilizza questa struttura per visualizzare i dati dall’archivio di sessione del profilo. Il cq-cc-thumbnail in questa classe viene posizionata l'immagine di anteprima. Il cq-cc-store-property-level*x* le classi formattano i dati alfanumerici:

• level0, level1 e level2 sono distribuiti verticalmente e utilizzano un font bianco.
• level3 ed eventuali livelli aggiuntivi sono distribuiti orizzontalmente e utilizzano un carattere bianco con uno sfondo più scuro.

Rendering dei dati dell'archivio sessione per i componenti genericstore

Per eseguire il rendering dei dati di archivio utilizzando un componente genericstore, è necessario effettuare le seguenti operazioni:

• Aggiungi il tag personalization:storeRendererTag allo script JSP del componente per identificare il nome dell’archivio sessione.
• Implementa un metodo di rendering nella classe dell’archivio di sessione.

Identificazione dell'archivio sessioni genericstore

La taglib di personalizzazione fornisce le personalization:storePropertyTag tag che visualizza il valore di una proprietà da un archivio sessione. Per utilizzare il tag, includi la seguente riga di codice nel file JSP:

<%@taglib prefix="personalization" uri="https://www.day.com/taglibs/cq/personalization/1.0" %>

Il tag ha il seguente formato:

<personalization:storeRendererTag store="store_name"/>

Implementazione del metodo del renderer dell’archivio sessioni

L’archivio delle sessioni necessita di un metodo "renderer" chiamato ogni volta che è necessario eseguire il rendering del componente. La funzione di rendering viene chiamata con due parametri:

• @param {String} store Archivio per il rendering
• @param {String} ID div del div in cui deve essere eseguito il rendering dell’archivio.

Interazione con gli archivi di sessione

Utilizza JavaScript per interagire con gli archivi di sessione.

Accesso agli store della sessione

Ottieni un oggetto archivio sessione per leggere o scrivere dati nell’archivio. CQ_Analytics.ClientContextMgr fornisce l’accesso ai negozi in base al nome. Una volta ottenuti, utilizzare i metodi di CQ_Analytics.SessionStore o CQ_Analytics.PersistedSessionStore per interagire con i dati dell’archivio.

L'esempio seguente ottiene profile archiviare e quindi recuperare formattedName dall'archivio.

function getName(){
   var profilestore = CQ_Analytics.ClientContextMgr.getRegisteredStore("profile");
   if(profilestore){
      return profilestore.getProperty("formattedName", false);
   } else {
      return null;
   }
}

Creazione di un listener per reagire a un aggiornamento dell’archivio sessioni

La sessione memorizza gli eventi di attivazione, pertanto è possibile aggiungere listener e attivare eventi in base a tali eventi.

Gli archivi di sessione sono basati su Observable pattern. Si estendono CQ_Analytics.Observable che fornisce [addListener](/docs/experience-manager-65/developing/personlization/client-context/ccjsapi.md#addlistener-event-fct-scope) metodo.

Nell'esempio seguente viene aggiunto un listener al update evento del profile archivio sessioni.

var profileStore = ClientContextMgr.getRegisteredStore("profile");
if( profileStore ) {
  //callback execution context
  var executionContext = this;

  //add "update" event listener to store
  profileStore.addListener("update",function(store, property) {
    //do something on store update

  },executionContext);
}

Controllo della definizione e inizializzazione di un archivio sessioni

Gli archivi di sessione non sono disponibili finché non vengono caricati e inizializzati con i dati. I seguenti fattori possono influenzare la tempistica di disponibilità dell’archivio sessioni:

• Caricamento pagina
• Caricamento JavaScript
• Tempo di esecuzione JavaScript
• Tempi di risposta per le richieste XHR
• Modifiche dinamiche all’archivio delle sessioni

Utilizza il CQ_Analytics.ClientContextUtils dell'oggetto onStoreRegistered e onStoreInitialized metodi per accedere agli archivi di sessione solo quando sono disponibili. Questi metodi consentono di registrare i listener di eventi che reagiscono agli eventi di registrazione e inizializzazione della sessione.

Nell’esempio seguente viene utilizzato onStoreRegistered evento del profile archivio sessioni. Quando l’archivio viene registrato, un listener viene aggiunto al update dell’archivio di sessione. Quando l’archivio viene aggiornato, il contenuto <div class="welcome"> nella pagina viene aggiornato con il nome dell’elemento profile archiviare.

//listen for the store registration
CQ_Analytics.ClientContextUtils.onStoreRegistered("profile", listen);

//listen for the store's update event
function listen(){
 var profilestore = CQ_Analytics.ClientContextMgr.getRegisteredStore("profile");
    profilestore.addListener("update",insertName);
}

//insert the welcome message
function insertName(){
 $("div.welcome").text("Welcome "+getName());
}

//obtain the name from the profile store
function getName(){
 var profilestore = CQ_Analytics.ClientContextMgr.getRegisteredStore("profile");
 if(profilestore){
  return profilestore.getProperty("formattedName", false);
    } else {
        return null;
    }
}

Esclusione di una proprietà dal cookie sessionpersistence

Per evitare che una proprietà di un PersistedSessionStore di essere mantenuto (ovvero, escluderlo dal sessionpersistence cookie), aggiungi la proprietà all’elenco delle proprietà non persistenti dell’archivio sessioni persistenti.

Consulta [CQ_Analytics.PersistedSessionStore.setNonPersisted(propertyName)](/docs/experience-manager-65/developing/personlization/client-context/ccjsapi.md#setnonpersisted-name)

CQ_Analytics.ClientContextUtils.onStoreRegistered("surferinfo", function(store) {
  //this will exclude the browser, OS and resolution properties of the surferinfo session store from the
  store.setNonPersisted("browser");
  store.setNonPersisted("OS");
  store.setNonPersisted("resolution");
});

Configurazione del dispositivo di scorrimento

Condizioni

La pagina corrente deve avere una pagina corrispondente per dispositivi mobili; questo viene determinato solo se la pagina ha una Live Copy configurata con una configurazione di rollout mobile ( rolloutconfig.path.toLowerCase contiene mobile).

Configurazione

Quando si passa dalla pagina desktop all'equivalente mobile:

• Il DOM della pagina mobile è caricato.

• Principale div (obbligatorio) che contiene il contenuto, viene estratto e inserito nella pagina del desktop corrente.

• Le classi CSS e body che vengono caricate devono essere configurate manualmente.

Ad esempio:

window.CQMobileSlider["geometrixx-outdoors"] = {
  //CSS used by desktop that need to be removed when mobile
  DESKTOP_CSS: [
    "/etc/designs/${app}/clientlibs_desktop_v1.css"
  ],

  //CSS used by mobile that need to be removed when desktop
  MOBILE_CSS: [
    "/etc/designs/${app}/clientlibs_mobile_v1.css"
  ],

  //id of the content that needs to be removed when mobile
  DESKTOP_MAIN_ID: "main",

  //id of the content that needs to be removed when desktop
  MOBILE_MAIN_ID: "main",

  //body classes used by desktop that need to be removed when mobile
  DESKTOP_BODY_CLASS: [
    "page"
  ],

  //body classes used by mobile that need to be removed when desktop
  MOBILE_BODY_CLASS: [
    "page-mobile"
  ]
};

Esempio: creazione di un componente archivio contestuale personalizzato

In questo esempio, puoi creare un componente archivio di contesto che recupera i dati da un servizio esterno e li memorizza nell’archivio di sessione:

• Estende il componente genericstoreproperties.
• Inizializza un archivio utilizzando un oggetto JavaScript CQ_Analytics.JSONPStore.
• Chiama un servizio JSONP per recuperare i dati e aggiungerli all'archivio.
• Esegue il rendering dei dati in ClientContext.

Aggiungere il componente geologico

Crea un’applicazione CQ e aggiungi il componente geoloc.

1. Apri CRXDE Liti nel browser (https://localhost:4502/crx/de).

2. Fare clic con il pulsante destro del mouse /apps e fai clic su Crea > Crea cartella. Specifica un nome per myapp e quindi fare clic su OK.

3. Analogamente, sotto myapp, crea una cartella denominata contextstores. "

4. Fare clic con il pulsante destro del mouse /apps/myapp/contextstores e fai clic su Crea > Crea componente. Specifica i seguenti valori delle proprietà e fai clic su Avanti:

   • Etichetta: geoloc
   • Titolo: Archivio località
   • Super Type: cq/personalization/components/contextstore/genericstoreproperties
   • Gruppo: ClientContext

5. Nella finestra di dialogo Crea componente fare clic su Avanti in ogni pagina fino a quando il pulsante OK non viene attivato e quindi fare clic su OK.

6. Fai clic su Salva tutto.

Creare la finestra di dialogo Modifica geologica

Il componente Archivio di contesto richiede una finestra di dialogo per modifica. La finestra di dialogo per modifica geografica contiene un messaggio statico che indica che non vi sono proprietà da configurare.

1. Fare clic con il pulsante destro del mouse /libs/cq/personalization/components/contextstores/genericstoreproperties/dialog e fai clic su Copia.

2. Fare clic con il pulsante destro del mouse /apps/myapp/contextstores/geoloc e fai clic su incolla.

3. Elimina tutti i nodi secondari sotto il nodo /apps/myapp/contextstore/geoloc/dialog/items/items/tab1/items:

   • archiviare
   • proprietà
   • miniatura

4. Fare clic con il pulsante destro del mouse /apps/myapp/contextstores/geoloc/dialog/items/items/tab1/items e fai clic su Crea > Crea nodo. Specificare i valori delle proprietà seguenti e fare clic su OK:

   • Nome: statico
   • Tipo: cq:Widget

5. Aggiungi le seguenti proprietà al nodo:

   Nome	Tipo	Valore
   cls	Stringa	x-form-fieldset-description
   text	Stringa	Il componente geologico non richiede alcuna configurazione.
   xtype	Stringa	statico

6. Fai clic su Salva tutto.

   

Creare lo script di inizializzazione

Aggiungi un file init.js.jsp al componente geoloc e utilizzalo per creare l’archivio della sessione, recuperare i dati della posizione e aggiungerlo all’archivio.

Il file init.js.jsp viene eseguito quando ClientContext viene caricato dalla pagina. A questo punto, l’API JavaScript ClientContext viene caricata e disponibile per lo script.

1. Fai clic con il pulsante destro del mouse sul nodo /apps/myapp/contextstore/geoloc e fai clic su Crea > Crea file. Specificare il nome di init.js.jsp e fare clic su OK.

2. Aggiungi il codice seguente nella parte superiore della pagina, quindi fai clic su Salva tutto.

   <%@page contentType="text/javascript;charset=utf-8" %><%
   %><%@include file="/libs/foundation/global.jsp"%><%
   log.info("***** initializing geolocstore ****");
   String store = "locstore";
   String jsonpurl = "https://api.wipmania.com/jsonp?callback=${callback}";
   
   %>
   var locstore = CQ_Analytics.StoreRegistry.getStore("<%= store %>");
   if(!locstore){
    locstore = CQ_Analytics.JSONPStore.registerNewInstance("<%= store %>", "<%= jsonpurl %>",{});
   }
   <% log.info(" ***** done initializing geoloc ************"); %>
   

Eseguire il rendering dei dati dell’archivio sessione geoloc

Aggiungi il codice al file JSP del componente geoloc per eseguire il rendering dei dati dell’archivio in ClientContext.

1. In CRXDE Liti, apri /apps/myapp/contextstores/geoloc/geoloc.jsp file.

2. Aggiungi il seguente codice HTML sotto il codice stub:

   <%@taglib prefix="personalization" uri="https://www.day.com/taglibs/cq/personalization/1.0" %>
   <div class="cq-cc-store">
      <div class="cq-cc-content">
          <div class="cq-cc-store-property cq-cc-store-property-level0">
              Continent: <personalization:storePropertyTag propertyName="address/continent" store="locstore"/>
          </div>
          <div class="cq-cc-store-property cq-cc-store-property-level1">
              Country: <personalization:storePropertyTag propertyName="address/country" store="locstore"/>
          </div>
          <div class="cq-cc-store-property cq-cc-store-property-level2">
              City: <personalization:storePropertyTag propertyName="address/city" store="locstore"/>
          </div>
          <div class="cq-cc-store-property cq-cc-store-property-level3">
              Latitude: <personalization:storePropertyTag propertyName="latitude" store="locstore"/>
          </div>
          <div class="cq-cc-store-property cq-cc-store-property-level4">
              Longitude: <personalization:storePropertyTag propertyName="longitude" store="locstore"/>
          </div>
      </div>
       <div class="cq-cc-clear"></div>
   </div>
   

3. Fai clic su Salva tutto.

Aggiungere il componente a ClientContext

Aggiungi il componente Archivio posizione a ClientContext in modo che venga inizializzato al caricamento della pagina.

1. Apri la home page dei Geometrixx Outdoors nell’istanza di authoring (https://localhost:4502/content/geometrixx-outdoors/en.html).

2. Fare clic su Ctrl-Alt-C (Windows) o su Control-Opzione-C (Mac) per aprire ClientContext.

3. Fare clic sull'icona Modifica nella parte superiore di ClientContext per aprire ClientContext Designer.

   

4. Trascina il componente Archivio posizione in ClientContext.

Visualizzare le informazioni sulla posizione in ClientContext

Apri la home page dei Geometrixx Outdoors in modalità di modifica, quindi apri ClientContext per visualizzare i dati dal componente Archivio posizione.

1. Apri la pagina inglese del sito Geometrixx Outdoors. (https://localhost:4502/content/geometrixx-outdoors/en.html)
2. Per aprire ClientContext, premere Ctrl-Alt-c (Windows) o Control-option-c (Mac).

Creazione di un contesto client personalizzato

Per creare un secondo contesto client, duplica il ramo:

/etc/clientcontext/default

• La sottocartella:
  /content
  contiene il contenuto del contesto client personalizzato.

• La cartella:
  /contextstores
  consente di definire configurazioni diverse per gli archivi contestuali.

Per utilizzare il contesto client personalizzato, modifica la proprietà
path
nello stile di progettazione del componente contesto client, come incluso nel modello di pagina. Ad esempio, come posizione standard di:
/libs/cq/personalization/components/clientcontext/design_dialog/items/path