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:
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.
Obiettivi 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:
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.
-
Assicurati di avere aperto il sito Luma e seleziona l’icona dell’estensione Experienci Platform Debugger
-
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)
-
Conferma che il debugger è "Connesso a Luma" come illustrato di seguito, quindi selezionare la"blocca" per bloccare Debugger sul sito Luma.
-
Seleziona la Accedi e accedi a Adobe Experience Cloud utilizzando il tuo ID Adobe.
-
Ora vai a Tag Experience Platform nel menu di navigazione a sinistra
-
Seleziona la Configurazione scheda
-
A destra della posizione in cui è visualizzato Codici di incorporamento pagina, apri Azioni e seleziona Sostituisci
-
Poiché sei autenticato, il Debugger estrae le proprietà e gli ambienti dei tag disponibili. Seleziona il
Web SDK Courseproprietà -
Seleziona il
Developmentambiente -
Seleziona la Applica pulsante
-
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:
-
Vai a Riepilogo nel menu di navigazione a sinistra, per visualizzare i dettagli della proprietà tag
-
Ora vai a Experienci Platform Web SDK nel menu di navigazione a sinistra per visualizzare Richieste di rete
-
Apri Eventi row (non preoccuparti se questa schermata mostra più richieste della tua, include richieste da lezioni future e per ora puoi ignorarle)
-
Nota come è possibile visualizzare
web.webpagedetails.pageViewtipo di evento specificato nel Invia evento e altre variabili pronte all’uso conformi allaAEP Web SDK ExperienceEvent Mixinformato
-
Scorri verso il basso fino a
webdell'oggetto, selezionare per aprirlo ed esaminarewebPageDetails.name,webPageDetails.server, ewebPageDetails.siteSection. Devono corrispondere alle corrispondenti variabili del livello dati digitalData sulla home page
Puoi anche convalidare i dettagli di Identity Map:
-
Accedi al sito Luma utilizzando le credenziali
test@adobe.com/test -
Torna alla home page di Luma
-
Apri Experienci Platform Web SDK sezione nel menu di navigazione a sinistra
-
Seleziona la Eventi riga per aprire i dettagli in un pop-up
-
Cerca identityMap all'interno del pop-up. Qui dovresti vedere
lumaCrmIdcon 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).
-
Apri gli strumenti di sviluppo web del browser Rete e ricarica la pagina. Filtra per chiamate con
/eeper individuare la chiamata, selezionarla e quindi cercare nella Intestazioni e Payload scheda
-
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
note note NOTE 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.