Web SDK-implementaties valideren met Experience Platform Debugger
Leer hoe u uw Adobe Experience Platform Web SDK-implementatie met Adobe Experience Platform Debugger kunt valideren.
Experience Platform Debugger is de uitbreiding van a Chrome die u helpt de technologie zien van Adobe die in uw Web-pagina's wordt uitgevoerd. Experience Platform Debugger en de ontwikkelaarsconsole van uw browser zijn de beste manieren om de browser-zijaspecten van uw implementatie van Web SDK te bevestigen en te zuiveren. Adobe Experience Platform Assurance, dat in de volgende les wordt behandeld, geeft de beste mening van de gegevens aangezien het van en naar het Platform Edge Network reist.
Als u Foutopsporing nog nooit eerder hebt gebruikt, kunt u deze overzichtsvideo van vijf minuten bekijken:
In deze les, gebruikt u de uitbreiding van Adobe Experience Platform Debugger om het markeringsbezit te vervangen dat op de Luma demowebsite met uw eigen bezit wordt hard gecodeerd.
Deze techniek wordt omgevingsomschakeling genoemd en is later handig wanneer u met tags op uw eigen website werkt. Het staat u toe om uw productiewebsite in uw browser te laden, maar met uw ontwikkeling de tagbibliotheek. Hierdoor kunt u op een betrouwbare manier wijzigingen in tags doorvoeren en valideren, onafhankelijk van uw reguliere code-releases. Per slot van rekening is deze scheiding van marketing markeringsversies van uw regelmatige codeversies één van de belangrijkste redenen klanten in de eerste plaats labels gebruiken!
Leerdoelstellingen
Aan het eind van deze les, zult u debugger kunnen gebruiken om:
- Een alternatieve tagbibliotheek laden
- Valideren van de client-side XDM-gebeurtenis vangt gegevens op en verzendt deze naar het Platform Edge Network
- Edge Trace inschakelen om verzoeken van Platform Edge Network op de server weer te geven
Vereisten
U bent vertrouwd met de markeringen van de Inzameling van Gegevens en de demowebsite van de Luma en hebt de vorige lessen in het leerprogramma voltooid:
Alternatieve tagbibliotheken laden met Foutopsporing
De Experience Platform Debugger beschikt over een coole functie waarmee u een bestaande tagbibliotheek kunt vervangen door een andere. Deze techniek is nuttig voor bevestiging en staat ons toe om vele implementatiestappen in dit leerprogramma over te slaan.
-
Zorg ervoor u de de demowebsite van de Luma open hebt en selecteert het Debugger van Experience Platform uitbreidingspictogram
-
Foutopsporing opent en toont sommige details van de hard-gecodeerde implementatie (u kunt de plaats van de Luma na het openen van Debugger moeten opnieuw laden)
-
Bevestig dat Debugger "Connected to Luma"zoals hieronder afgebeeld is en selecteer dan het "lock"pictogram is om Debugger aan de plaats van de Luma te sluiten.
-
Selecteer de knop Sign In , meld u aan bij Adobe Experience Cloud met uw Adobe-id en selecteer uw organisatie.
note tip TIP Als de debugger uw gebruikersbenaming in plaats van uw naam van de Org na het ondertekenen binnen toont, teken uit en probeer opnieuw. 
-
Ga nu naar Experience Platform Tags in de linkernavigatie
-
Selecteer de tab Configuration
-
Open rechts van waar de Page Embed Codes wordt weergegeven het vervolgkeuzemenu Actions en selecteer Replace
-
Aangezien u voor authentiek wordt verklaard, zal Foutopsporing uw beschikbare markeringseigenschappen en milieu's trekken. Selecteer uw eigenschap
-
Selecteer uw
Development-omgeving
note tip TIP Als u de eigenschap en de omgeving niet kunt selecteren met de vervolgkeuzelijst, gaat u naar Tags > Environments > Development > Install en selecteert u het pictogram om de ingesloten code te kopiëren en in Foutopsporing te plakken:
-
Selecteer de knop Apply
-
De website van de Luma zal met uw eigen markeringsbezit nu opnieuw laden.
Terwijl u de zelfstudie voortzet, gebruikt u deze techniek om de Luministoewijzing toe te wijzen aan uw eigen tageigenschap om de implementatie van Platform Web SDK te valideren. Wanneer u tags op uw eigen website gebruikt, kunt u dezelfde techniek gebruiken om bibliotheken met ontwikkelingslabels op uw productiewebsite te valideren.
Valideren met foutopsporing
Valideer netwerkverzoeken en XDM
U kunt Foutopsporing gebruiken om cliënt-zijbakens te bevestigen die van uw implementatie van het Web SDK van het Platform worden teweeggebracht om de gegevens te bekijken die naar Platform Edge Network worden verzonden:
-
Ga naar Summary in de linkernavigatie om de details van uw markeringseigenschap te zien
-
Ga nu naar Experience Platform Web SDK in de linkernavigatie om de Network Requests te zien
-
De rij events openen
-
Let op hoe u het gebeurtenistype
web.webPageDetails.pageViewkunt zien dat u in de Update variable -handeling hebt opgegeven, en andere variabelen die zich buiten het vak bevinden en die aan deAEP Web SDK ExperienceEvent-veldgroep voldoen.
-
Schuif omlaag naar het
web-object, selecteer dit om het te openen en inspecteer hetwebPageDetails.name. Deze moeten overeenkomen met de overeenkomstige gegevenslaagvariabelen vooradobeDataLayerop de startpagina
adobeDataLayer op de startpagina weergeven en vergelijken:- Open de browsergereedschappen voor ontwikkelaars op de startpagina van Luma. In het geval van Chrome selecteert u de knop
F12op het toetsenbord - Selecteer de tab Console
- Voer
adobeDataLayerin en selecteerEnterop het toetsenbord om de waarden van de gegevenslaag weer te geven
Valideer de gebeurtenissen en variabelen die zijn ingesteld op de productpagina's, de tekstpagina en de pagina voor bevestiging van de bestelling.
Identiteitskaart valideren
U kunt ook de identiteitskaartgegevens valideren:
-
Selecteer Sign In op de website van de Luma . Selecteer Create Account en maak een account aan de hand van de referenties
test@test.com/test -
Gebruik de sneltoets Jump to most recent in Foutopsporing om snel naar de meest recente Web SDK-gebeurtenis te gaan (dit is de laatste kolom). Selecteer de rij events om de modale details te openen.
-
Onderzoek naar identityMap binnen modal. Hier ziet u
lumaCrmIdmet drie sleutels van authenticatedState, id, en primaire aanwijzing:
Valideren met ontwikkelaarsgereedschappen voor browsers
Veel webontwikkelaars geven de voorkeur aan de implementatie in de ontwikkelprogramma's van hun browser. Dit is vooral belangrijk omdat niet alle browsers de Debugger uitbreiding steunen. Vanwege het flexibele framework zijn er aanvullende implementatiedetails die u kunt inspecteren, zoals cookies en reactiegegevens.
Netwerkverzoeken valideren
De de verzoekdetails van SDK van het Web zijn ook zichtbaar in het Web van de browser ontwikkelaars hulpmiddelen van het Netwerk tabel (het veronderstellen van de website laadt uw markeringsbibliotheek).
-
Open het 1} lusje van het Netwerk van de de Webontwikkelaar van browser hulpmiddelen {en laad de pagina opnieuw. Filter voor vraag met
/eeom van de vraag de plaats te bepalen, het te selecteren, en dan in de Kopballen tabel te kijken, en nuttige lading tabel
-
Ga naar het lusje van de Voorproef en neem nota hoe de ECID waarde in de netwerkreactie inbegrepen is.
note note NOTE De waarde ECID is zichtbaar in de netwerkreactie. Het is niet inbegrepen in het identityMapgedeelte van het netwerkverzoek, noch wordt het opgeslagen in dit formaat in een koekje.
Web SDK cookies
Terwijl wij in de ontwikkelaarshulpmiddelen zijn, nemen een blik bij sommige koekjesWeb SDK reeksen in browser. Open Application > Cookies > https://luma.enablementadobe.com
Verschillende cookies worden ingesteld door Web SDK:
- kndctr_[ IMS_ORGID ]_AdobeOrg_identity: dit slaat gegevens met betrekking tot ECID op
- kndctr_[ IMS_ORGID ]_AdobeOrg_cluster: dit slaat de plaats op van het gegevenscentrum die wordt gebruikt zodat de verdere netwerkvraag wordt verpletterd aan de zelfde servers van Edge
- AMCV_[ IMS_ORGID ]%40AdobeOrg: dit is het erfenisCookie van AMCV die door de bibliotheken van Experience Cloud van de pre-Web wordt gebruikt en het wordt geplaatst omdat wij het gebrek Migrate ECID to VisitorAPI to the web SDK plaatsen selecteerde in de de etikettenuitbreiding van SDK van het Web van Adobe Experience Platform. Deze instelling is belangrijk om ingeschakeld te zijn wanneer u uw pagina's migreert van oudere bibliotheken naar Web SDK, maar u kunt deze instelling uitschakelen nadat al uw pagina's gedurende een bepaalde tijd zijn gemigreerd.
Als u deze cookies wist en de pagina opnieuw laadt, ziet u mogelijk extra cookies van derden die zijn ingesteld op het .demdex.net -domein. Deze worden ingesteld omdat de standaardinstelling Use third party-cookies: Enabled in de Adobe Experience Platform Web SDK-tagextensie is ingeschakeld. Als uw browser cookies van derden niet toestaat, worden deze verwijderd wanneer u de pagina opnieuw laadt.
Lokale opslag met luminantie
De Luma-demo-website gebruikt uitsluitend clienttechnologieën zoals HTML, CSS en JavaScript. Er zijn geen back-endopslagmechanismen, behalve de Experience Cloud-implementatie die door de standaardstatus van de website wordt gebruikt. Informatie zoals gebruikersnamen wordt alleen lokaal in uw browser opgeslagen met localStorage. Als u deze gegevens verwijdert of een incognitorvenster gebruikt, zult u dus zien dat u mogelijk een gebruikersaccount voor de test opnieuw moet maken die u eerder hebt gemaakt.
Leer vervolgens hoe u deze netwerkverzoeken valideert wanneer ze via Adobe Experience Platform Assurance worden ontvangen en verzonden vanuit Platform Edge Network!