L1 · Read a beacon in the AEP Debugger

Lab 1: Read a beacon in the AEP Debugger

Objective

See a real hit in action using the AEP (Adobe Experience Platform) Debugger browser extension.

What you'll learn

• How to use the AEP Debugger to inspect hits
• What a real hit looks like (timestamp, visitor ID, variables)
• How to confirm your implementation is sending data

Prerequisites

• Chrome or Firefox browser
• AEP Debugger extension installed (or install it now from your browser's extension store)

The lab

Step 1: Install AEP Debugger

1. Go to your browser's extension store (Chrome Web Store or Firefox Add-ons)
2. Search for "Adobe Experience Platform Debugger"
3. Install the official Adobe extension
4. Pin it to your browser toolbar (makes it easy to access)

Step 2: Open Example Super

1. In a new tab, go to any website with Adobe Analytics installed (or example-super.com.au if available)
2. Open the AEP Debugger (click the icon in your toolbar)
3. Click the "Adobe Analytics" tab

Step 3: Read the hit

You should see a panel showing:

Adobe Analytics
  Report Suite: example_super_prod

  Page Name: "Home"

  Variables:
    prop1: "homepage"
    eVar1: "organic_search"
    event1: (page view)

  Network Requests:
    [timestamp] adobe.analytics.com/...

What you're seeing:

• Report Suite: which database the hit is going to
• Page Name: what the page is labeled as
• Variables: all the props/eVars you defined
• Network request: the actual HTTP request sent to Adobe

Step 4: Click around the site

1. Navigate to another page (e.g., Search Results)
2. Watch the AEP Debugger. A new hit should appear
3. Notice:

- Page Name changed - Some eVars persisted (still show values from the previous hit) - Some props are different (hit-scoped, so they reset)

Step 5: Do an action that fires an event

1. Find a button or action tracked on the site (e.g., submit a form, click a link)
2. Do the action
3. In the AEP Debugger, notice:

- A new hit appears - The event column shows which event fired (event1, event2, etc.) - The Page Name might be the same, but other data might be different

What's happening behind the scenes

Every time you load a page or click a tracked link:

1. JavaScript fires: s.pageName = "..."; s.t();
2. Web SDK collects: timestamp, visitor ID, all variables
3. Network request: Sent to Adobe's Edge
4. Hit stored: Lands in the report suite database
5. Debugger shows: All the variables in that hit

Exercise: Identify 3 hits

1. Load a page (Hit 1 - page view)
2. Navigate to another page (Hit 2 - page view)
3. Do an action that fires an event (Hit 3 - custom event)

In the AEP Debugger, identify for each hit:

• Page Name
• At least 2 props or eVars that were sent
• The event that fired (if any)

Write these down. You'll use them in the next lab.

Troubleshooting

"I don't see any hits in the debugger"

• Make sure you're on a website with Adobe Analytics (not all sites have it)
• Open the debugger BEFORE loading the page (so you see the first hit)
• Check the "Adobe Analytics" tab (not the Experience Platform tab)

"I see hits but they look empty"

• The site might not have props/eVars configured (they send the required data only)
• That's okay. At least you see the page name and the hit structure

Key insight

The AEP Debugger is your most useful tool for understanding what data is actually being sent. When you implement tracking, you'll use this constantly to verify your code works.

---

Next: S2 · Dimensions, metrics and what a report is