Convalidare le implementazioni Web SDK con Experienci Platform Debugger

Scopri come convalidare l’implementazione di Platform Web SDK con l’Adobe Experience Platform Debugger.

Experienci Platform Debugger è un’estensione disponibile per i browser Chrome e Firefox che consente di visualizzare la tecnologia Adobe implementata nelle pagine web. Scarica la versione per il browser preferito:

• Estensione Firefox
• Estensione Chrome

Se non hai mai utilizzato il debugger prima, e questo è diverso dal precedente Adobe Experience Cloud Debugger, guarda questo video introduttivo di cinque minuti:

In questa lezione, utilizzerai Estensione Adobe Experience Platform Debugger per sostituire la proprietà di tag in codifica fissa Sito di dimostrazione Luma con la tua proprietà.

Questa tecnica è denominata cambio di ambiente e sarà utile in un secondo momento, quando lavorerai con i tag sul tuo sito web. Puoi caricare il tuo sito web di produzione nel browser, ma con sviluppo nell’ambiente dei tag. Questa funzionalità ti consente di creare e convalidare le modifiche ai tag in modo indipendente dalle regolari versioni del codice. Dopo tutto, questa separazione tra versioni di tag di marketing e versioni di codice è uno dei motivi principali per cui i clienti utilizzano i tag.

Finalità di apprendimento

Alla fine di questa lezione, potrai utilizzare il debugger per:

• Caricare una libreria di tag alternativa
• Convalida che l’oggetto XDM acquisisce e invia i dati come previsto Edge Network

Prerequisiti

Conosci i tag di raccolta dati e la Sito di dimostrazione Luma e hanno completato le seguenti lezioni precedenti nell’esercitazione:

• Configurare le autorizzazioni
• Configurare uno schema XDM
• Configurare uno spazio dei nomi delle identità
• Configurare uno stream di dati
• Estensione Web SDK installata nella proprietà tag
• Creare elementi dati
• Creare una regola di tag

Caricare librerie di tag alternative con Debugger

Questa esercitazione utilizza una versione in hosting pubblico del Sito web di dimostrazione Luma. Apri la home page e aggiungi un segnalibro.

Experienci Platform Debugger dispone di una funzione interessante che consente di sostituire una libreria di tag esistente con una diversa. Questa tecnica è utile per la convalida e ci consente di saltare molti passaggi di implementazione in questa esercitazione.

1. Assicurati di avere aperto il sito Luma e seleziona l’icona dell’estensione Experienci Platform Debugger

2. Debugger si aprirà e mostrerà alcuni dettagli dell’implementazione hardcoded, che non è correlata a questa esercitazione (potrebbe essere necessario ricaricare il sito Luma dopo aver aperto Debugger)

3. Conferma che il debugger è "Connesso a Luma" come illustrato di seguito, quindi selezionare la"blocca" per bloccare Debugger sul sito Luma.

4. Seleziona la Accedi e accedi a Adobe Experience Cloud utilizzando il tuo ID Adobe.

5. Ora vai a Tag Experience Platform nel menu di navigazione a sinistra

   

6. Seleziona la Configurazione scheda

7. A destra della posizione in cui è visualizzato Codici di incorporamento pagina, apri Azioni e seleziona Sostituisci

   

8. Poiché sei autenticato, il Debugger estrae le proprietà e gli ambienti dei tag disponibili. Seleziona il Web SDK Course proprietà

9. Seleziona il Development ambiente

10. Seleziona la Applica pulsante

    

11. Il sito web Luma verrà ricaricato con la proprietà tag.

    

Continuando l’esercitazione, utilizzerai questa tecnica per mappare il sito Luma sulla tua proprietà tag per convalidare l’implementazione dell’SDK web per Platform. Quando inizi a utilizzare i tag sul sito web di produzione, puoi usare questa stessa tecnica per convalidare le modifiche.

Convalidare l’implementazione in Experienci Platform Debugger

Puoi utilizzare il debugger per convalidare l’implementazione di Platform Web SDK e visualizzare i dati inviati a Platform Edge Network:

1. Vai a Riepilogo nel menu di navigazione a sinistra, per visualizzare i dettagli della proprietà tag

   

2. Ora vai a Experienci Platform Web SDK nel menu di navigazione a sinistra per visualizzare Richieste di rete

3. Apri Eventi row (non preoccuparti se questa schermata mostra più richieste della tua, include richieste da lezioni future e per ora puoi ignorarle)

   

4. Nota come è possibile visualizzare web.webpagedetails.pageView tipo di evento specificato nel Invia evento e altre variabili pronte all’uso conformi alla AEP Web SDK ExperienceEvent Mixin formato

   

5. Scorri verso il basso fino a web dell'oggetto, selezionare per aprirlo ed esaminare webPageDetails.name, webPageDetails.server, e webPageDetails.siteSection. Devono corrispondere alle corrispondenti variabili del livello dati digitalData sulla home page

   

Puoi anche convalidare i dettagli di Identity Map:

1. Accedi al sito Luma utilizzando le credenziali test@adobe.com/test

2. Torna alla home page di Luma

3. Apri Experienci Platform Web SDK sezione nel menu di navigazione a sinistra

   

4. Seleziona la Eventi riga per aprire i dettagli in un pop-up

   

5. Cerca identityMap all'interno del pop-up. Qui dovresti vedere lumaCrmId con tre chiavi di authenticatedState, id e primary:
   

Convalida con gli strumenti di sviluppo del browser

Questi tipi di dettagli della richiesta sono visibili anche negli strumenti di sviluppo web del browser Rete (supponendo che il sito web stia caricando la libreria di tag).

1. Apri gli strumenti di sviluppo web del browser Rete e ricarica la pagina. Filtra per chiamate con /ee per individuare la chiamata, selezionarla e quindi cercare nella Intestazioni e Payload scheda

   

2. Vai a Risposta e osserva come il valore ECID viene incluso nella risposta. Copia questo valore così come lo utilizzerai per convalidare le informazioni sul profilo nel prossimo esercizio

   

   NOTA

   Potresti non visualizzare la stessa quantità di richieste di payload presente nella schermata precedente. Questa disparità è dovuta al fatto che le lezioni future configurazione di Target sono state completate al momento dell’acquisizione della schermata. Per il momento puoi ignorare questa differenza.

Ora che un oggetto XDM viene attivato su una pagina e sai come convalidare la raccolta dati, puoi configurare le singole applicazioni Adobe utilizzando Platform Web SDK.

Successivo: