Contesto client in dettaglio

ClientContext rappresenta una raccolta di dati utente assemblata in modo dinamico. 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 nella pagina.

Il contesto client è costituito principalmente dai seguenti aspetti:

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

Per creare un archivio di sessioni autonomo e aggiungerlo al contesto client o creare un archivio di sessioni associato a un componente dell’archivio contesti. AEM installa diversi componenti dell’archivio contesti che puoi utilizzare immediatamente. Puoi utilizzare questi componenti come base per i componenti.

Per informazioni sull'apertura del contesto client, sulla configurazione delle informazioni visualizzate e sulla simulazione dell'esperienza utente, consulta Contesto client.

Archivio sessioni

ClientContext include vari archivi di sessione contenenti dati utente. I dati archiviati provengono dalle seguenti origini:

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

Il framework ClientContext fornisce un API javascript che è possibile utilizzare per interagire con gli archivi di sessione per leggere e scrivere i dati utente, nonché per ascoltare e reagire agli eventi dell'archivio. Puoi anche creare archivi di sessioni per i dati utente utilizzati per il targeting dei contenuti o per altri scopi.

I dati dell’archivio sessioni rimangono sul client. Il contesto client non riscrive i dati sul server. Per inviare dati al server, utilizzare un modulo o sviluppare JavaScript personalizzato.

Ogni archivio di sessione è un insieme 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 e/o sviluppatore. Il seguente codice javascript di esempio definisce un oggetto che rappresenta i dati di profilo che potrebbero contenere gli archivi di sessione:

{
  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 delle sessioni può essere mantenuto in tutte le sessioni del browser, oppure può durare solo per la sessione del browser in cui viene creato.

Componenti per gli archivi di contesto

Un componente dell’archivio contesti è un componente CQ che può essere aggiunto al contesto client. In genere, i componenti dell’archivio di contesto visualizzano i dati provenienti da un archivio di sessioni 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 contesti possono includere i seguenti elementi:

• Script JSP che definiscono l’aspetto nel contesto client.
• Proprietà per elencare il componente nella barra laterale.
• Modificare le finestre di dialogo per configurare le istanze dei componenti.
• JavaScript che inizializza l'archivio sessioni.

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

Consegna di contenuti mirati

Le informazioni sul profilo vengono utilizzate anche per la distribuzione di contenuti mirati.

Aggiunta Di Contesto Client 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 di pagina, che si trova appena sotto l' 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 Client Context.

• API javascript Client Context.
• Il framework Client Context che supporta gli archivi di sessione, la gestione degli eventi, ecc.
• Segmenti definiti.
• Gli script init.js generati per ciascun componente dell’archivio di contesto aggiunto al contesto client.
• (Solo per l’istanza di authoring) L’interfaccia utente del contesto client.

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

Estensione del contesto client

Per estendere Client Context, crea un archivio di 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 per l’archivio di contesto per consentire agli amministratori di configurare l’archivio di sessioni associato e di visualizzare i dati dell’archivio di dati nel contesto client a scopo di test.

Creazione di un archivio sessioni

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

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

2. Configura la cartella della libreria client in modo che abbia una dipendenza dalla cartella della libreria client personalization.core.kernel. La libreria client personalization.core.kernel fornisce l’API JavaScript Client Context.

3. Aggiungi il javascript che crea e inizializza l'archivio sessioni.

L'inclusione del javascript nella libreria client personalization.stores.kernel causa la creazione dell'archivio quando viene caricato il framework del contesto client.

Tipi di archivi di sessioni

Gli archivi di sessione vengono creati e disponibili durante una sessione del browser oppure vengono mantenuti nell'archiviazione del browser o nei cookie. L'API JavaScript del contesto client definisce diverse classi che rappresentano entrambi i tipi di archivio 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 mantenuti 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 sono persistenti sia nell’archiviazione del browser che nei cookie. I dati sono disponibili su più pagine e tra sessioni utente.

L’API fornisce anche le estensioni di queste classi specializzate per la memorizzazione di dati JSON o JSONP:

• Oggetti solo sessione: CQ_Analytics.JSONStore e CQ_Analytics.JSONPStore.

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

Creazione dell'oggetto Session Store

Il javascript della cartella della libreria client crea e inizializza l'archivio sessioni. L'archivio delle sessioni deve quindi essere registrato utilizzando Context Store Manager. Nell'esempio seguente viene creato e registrato un oggetto CQ_Analytics.SessionStore.

//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 memorizzare i dati JSON, l'esempio seguente crea e registra un oggetto CQ_Analytics.JSONStore .

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

Creazione di un componente Context Store

Crea un componente per l’archivio di contesto per eseguire il rendering dei dati dell’archivio di sessione nel contesto client. Una volta creato, puoi trascinare il componente dell’archivio contesti sul contesto client per eseguire il rendering dei dati da un archivio sessioni. I componenti dell’archivio contesti sono costituiti dai seguenti elementi:

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

Estensione dei componenti dell'archivio contesti forniti

AEM fornisce i componenti dell'archivio dati generici e quelli dell'archivio dati contestuali genericstoreproperties che è possibile estendere. La struttura dei dati dell’archivio determina il componente che si estende:

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

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

• Dati complessi: Estendi il componente GenericStore . L’archivio sessioni dovrà quindi utilizzare un metodo "renderer" che verrà chiamato ogni volta che il componente deve essere rappresentato. 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 dello store.

Configurazione dell’aspetto nella barra laterale

Durante la modifica del contesto client, i componenti dell’archivio del contesto vengono visualizzati nella barra laterale. Come per tutti i componenti, le proprietà componentGroup e jcr:title del componente ClientContext determinano il gruppo e il nome del componente.

Tutti i componenti con un valore di proprietà componentGroup pari a Client Context vengono visualizzati nella barra laterale per impostazione predefinita. Se utilizzi un valore diverso per la proprietà componentGroup , devi aggiungere manualmente il componente alla barra laterale utilizzando la modalità Progettazione .

Istanze dei componenti dell'archivio contesti

Quando aggiungi un componente dell'archivio di contesto al contesto client, un nodo che rappresenta l'istanza del componente viene creato qui sotto /etc/clientcontext/default/content/jcr:content/stores. Questo nodo contiene i valori delle proprietà configurati utilizzando la finestra di dialogo di modifica del componente.

Quando Client Context viene inizializzato, questi nodi vengono elaborati.

Inizializzazione dell'archivio sessioni associato

Aggiungi un file init.js.jsp al tuo componente per generare codice javascript che inizializza l’archivio sessioni utilizzato dal componente dell’archivio contesti. Ad esempio, utilizza lo script di inizializzazione per recuperare le proprietà di configurazione per il componente e utilizzale per popolare l’archivio sessioni.

Il javascript generato viene aggiunto alla pagina quando Client Context viene inizializzato al caricamento della pagina sia sulle istanze di authoring che di pubblicazione. Questo JSP viene eseguito prima che l’istanza del componente dell’archivio di contesto venga caricata e sottoposta a rendering.

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

La procedura seguente crea il file di script init.js.jsp e aggiunge il codice che imposta il tipo di 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 contesti e fai clic su Crea > Crea file .

2. Nel campo Nome digitare init.js.jsp, 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 sessioni per i componenti genericstoreproperties

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

Visualizzazione dei dati di proprietà

La libreria di personalizzazione fornisce il tag personalization:storePropertyTag che visualizza il valore di una proprietà da un archivio sessioni. 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"/>

L'attributo propertyName è il nome della proprietà store da visualizzare. L'attributo store è il nome dell'archivio registrato. Il seguente tag di esempio visualizza il valore della proprietà authorizableId dell'archivio profile:

<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 Client Context 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 componente per l’archivio di contesto /libs/cq/personalization/components/contextstores/profiledata utilizza questa struttura per visualizzare i dati dall’archivio delle sessioni del profilo. La classe cq-cc-thumbnail inserisce l'immagine miniatura. Le classi cq-cc-store-property-level*x* formattano i dati alfanumerici:

• livello0, livello1 e livello2 sono distribuiti verticalmente e utilizzano un font bianco.
• livello3 ed eventuali livelli aggiuntivi vengono distribuiti orizzontalmente e utilizzano un carattere bianco con uno sfondo più scuro.

Rendering dei dati dell'archivio sessioni per i componenti di genericstore

Per eseguire il rendering dei dati dell’archivio utilizzando un componente genericstore, è necessario:

• Aggiungi il tag personalization:storeRendererTag allo script JSP del componente per identificare il nome dell'archivio sessioni.
• Implementa un metodo renderer sulla classe dell'archivio sessioni.

Identificazione dello store di sessioni genericstore

La libreria di personalizzazione fornisce il tag personalization:storePropertyTag che visualizza il valore di una proprietà da un archivio sessioni. 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 di rendering dell’archivio sessioni

L’archivio sessioni dovrà quindi utilizzare un metodo "renderer" che verrà chiamato ogni volta che il componente deve essere rappresentato. La funzione di rendering viene chiamata con due parametri:

• Archivio @param {String}
  Archivio di cui eseguire il rendering
• @param {String} divId
  Id del div in cui deve essere eseguito il rendering dello store.

Interazione con gli archivi di sessioni

Utilizza javascript per interagire con gli archivi di sessione.

Accesso agli archivi delle sessioni

Ottenere un oggetto archivio sessioni per leggere o scrivere dati nell'archivio. CQ_Analytics. ClientContextMicrosoft consente l'accesso agli archivi in base al nome dell'archivio. Una volta ottenuto, utilizza i metodi di CQ_Analytics.SessionStore o CQ_Analytics.PersistedSessionStore per interagire con i dati dell'archivio.

L'esempio seguente ottiene l'archivio profile e quindi recupera la proprietà 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, quindi è possibile aggiungere listener e attivare gli eventi in base a questi eventi.

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

Nell'esempio seguente viene aggiunto un listener all'evento update dell'archivio di sessione profile.

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 il tempo di disponibilità dell'archivio sessioni:

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

Utilizza i metodi CQ_Analytics.ClientContextUtils dell'oggetto onStoreRegistered e onStoreInitialized per accedere agli archivi di sessioni 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 l’evento onStoreRegistered dell’archivio sessioni profile. Quando l’archivio è registrato, viene aggiunto un listener all’evento update dell’archivio delle sessioni. Quando l’archivio viene aggiornato, il contenuto dell’elemento <div class="welcome"> nella pagina viene aggiornato con il nome dell’ profile archivio.

//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 di persistenza sessione

Per evitare che una proprietà di PersistedSessionStore venga mantenuta (ovvero escluderla dal cookie sessionpersistence), aggiungi la proprietà all'elenco delle proprietà non persistenti dell'archivio di 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 mobile corrispondente; questo è determinato solo se la pagina dispone di una LiveCopy configurata con una configurazione di rollout mobile ( rolloutconfig.path.toLowerCase contiene mobile).

Configurazione

Quando si passa dalla pagina desktop al suo equivalente mobile:

• Il DOM della pagina mobile viene caricato.

• Il div principale (obbligatorio) contenente il contenuto, viene estratto e inserito nella pagina desktop corrente.

• Le classi CSS e corpo da caricare devono essere configurate manualmente.

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 per l’archiviazione del contesto personalizzato

In questo esempio, si crea un componente dell’archivio di contesto che recupera i dati da un servizio esterno e li memorizza nell’archivio delle sessioni:

• 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 nel contesto client.

Aggiungi il componente geoloc

Crea un'applicazione CQ e aggiungi il componente geoloc.

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

2. Fai clic con il pulsante destro del mouse sulla cartella /apps e fai clic su Crea > Crea cartella. Specificare un nome di myapp, quindi fare clic su OK.

3. Allo stesso modo, sotto myapp, crea una cartella denominata contextstores. "

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

   • Etichetta: geoloc
   • Titolo: Store posizione
   • Super Type: cq/personalization/components/contextstores/genericstoreproperties
   • Gruppo: Contesto client

5. Nella finestra di dialogo Crea componente fare clic su Avanti su ciascuna pagina fino a quando il pulsante OK non è abilitato, quindi fare clic su OK.

6. Fai clic su Salva tutto.

Creare la finestra di dialogo Modifica geoloc

Il componente per l’archiviazione del contesto richiede una finestra di dialogo di modifica. La finestra di dialogo di modifica del geoloc conterrà un messaggio statico che indica che non sono presenti proprietà da configurare.

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

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

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

   • archiviare
   • proprietà
   • miniatura

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

   • Nome: statico
   • Tipo: cq:Widget

5. Aggiungi le seguenti proprietà al nodo :

   Nome	Tipo	Valore
   cls	Stringa	x-form-field-description
   testo	Stringa	Il componente geoloc non richiede alcuna configurazione.
   xtype	Stringa	statici

6. Fai clic su Salva tutto.

   

Creare lo script di inizializzazione

Aggiungi un file init.js.jsp al componente geoloc e usalo per creare l'archivio sessioni, recuperare i dati sulla posizione e aggiungerlo all'archivio.

Il file init.js.jsp viene eseguito quando il contesto client viene caricato dalla pagina. A questo punto, l’API JavaScript Client Context viene caricata e disponibile per il tuo script.

1. Fai clic con il pulsante destro del mouse sul nodo /apps/myapp/contextstores/geoloc e fai clic su Crea > Crea file. Specificare un 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 ************"); %>
   

Esegui il rendering dei dati dell'archivio sessioni geoloc

Aggiungi il codice al file JSP del componente geoloc per eseguire il rendering dei dati dell’archivio nel contesto client.

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

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.

Aggiungi il componente al contesto client

Aggiungi il componente Location Store al contesto client 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. Fai clic su Ctrl-Alt-C (windows) o Ctrl-Opzione-c (Mac) per aprire Client Context.

3. Fai clic sull’icona di modifica nella parte superiore del contesto client per aprire Client Context Designer.

   

4. Trascina il componente Store posizione nel contesto client.

Consulta Informazioni sulla posizione nel contesto client

Apri la home page dei Geometrixx Outdoors in modalità di modifica, quindi apri Client Context per visualizzare i dati dal componente Location Store.

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

Creazione di un contesto client personalizzato

Per creare un secondo contesto client, devi duplicare il ramo:

/etc/clientcontext/default

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

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

Per utilizzare il proprio 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