Doc Status: Current | Direct Hono CAPI documented | Token must stay in Cloudflare Worker secrets | Verify against dashboard audit rows and Meta Events Manager

Why This Matters

Meta Pixel and Conversions API work together to give House of Legends one reliable conversion story from ad click to paid booking. This matters because Meta uses this data to optimize ad delivery — the more accurately Meta can see which clicks turn into paying guests, the better it spends the advertising budget. Here is how it works in plain language:
  1. Browser Pixel tracks what visitors do on the website — browsing shows, starting checkout, submitting inquiries.
  2. Server CAPI confirms actual payment outcomes directly from House of Legends’ payment system to Meta.
  3. Both signals share a unique event ID, so Meta automatically deduplicates and never double-counts a single booking.
The result: Meta sees the full customer journey, not just what happens inside the browser.

Current Status

Meta tracking is configured for direct integration. The browser Pixel sends events on landing pages, and Hono is the only server transport for Meta Conversions API. Server CAPI events send only when the Cloudflare Worker has a valid META_CONVERSIONS_API_ACCESS_TOKEN; otherwise Hono writes a SKIPPED audit row.
Tracking LayerStatus
Browser PixelActive — mounted on landing pages
Server CAPIConfigured — sends from Hono when token secret is present
DeduplicationActive — both layers share event IDs
Admin audit logVisible at /dashboard/integration/meta/events

Browser Pixel Events

The website tracks these visitor actions and sends them as standard Meta events:
Visitor ActionMeta Event Name
Views any pagePageView
Views a show detail pageViewContent
Adds tickets to their selectionAddToCart
Starts the checkout processInitiateCheckout
Enters payment detailsAddPaymentInfo
Completes a paid bookingPurchase
Submits a booking inquiryLead
Each event includes the booking value, currency, show details, and content names. The app never sends raw email, phone, customer name, dietary notes, payment secrets, or AI conversation text to Meta.

Browser Pixel

ItemValue
Environment variableNEXT_PUBLIC_META_PIXEL_ID
Pixel ID1686954142433862
ScopePublic (not a secret)
OwnerLanding app via apps/landing/lib/analytics/analytics.ts

Server-Side CAPI

ItemValue
Access token secretMETA_CONVERSIONS_API_ACCESS_TOKEN (Hono Worker secret via wrangler secret put)
Enabled flagMETA_CONVERSIONS_API_ENABLED=true (Hono Worker env)
Graph API versionMETA_GRAPH_API_VERSION=v22.0
Test event codeMETA_CONVERSIONS_API_TEST_EVENT_CODE (use only during verification)
Ownerapps/hono/src/services/analytics/meta-conversions-api.service.ts
The Meta access token is a Hono Worker secret. Do not add it to app code, docs, local env files, public env files, generated clients, or browser config. If a token appears in chat, logs, screenshots, or issue trackers, treat it as exposed and rotate it before production use. The Pixel ID is public and safe to embed in the landing build.

Two-Signal Purchase Tracking

Paid bookings are tracked using two independent signals that Meta combines into one deduplicated conversion. This is important for ad optimization accuracy.

How It Works

  1. Browser signal — When a guest completes payment and lands on the payment result page, the browser fires a Purchase event to Meta.
  2. Server signal — Simultaneously, the House of Legends payment backend independently confirms the payment with Meta’s server API.
  3. Deduplication — Both signals carry the same unique booking ID. Meta recognizes they represent the same purchase and counts it once.

Signal 1 — Browser Pixel Purchase

  • Where: /booking/payment-result via BookingConfirmationClient with shouldTrackPurchase=true
  • When: Only when backend paymentStatus === "PAID"
  • How: analytics.purchase() -> fbq("track", "Purchase", parameters, { eventID })
  • Guard: Session storage (analytics_purchase_sent_<transactionId>) prevents re-fires. useRef prevents double-fires in one component lifecycle.

Signal 2 — Server CAPI Purchase

  • Where: Hono applyReservationHostedPaymentResult() in apps/hono/src/services/reservations/reservation-payment.service.ts
  • When: After OnePay confirms success and reservation changes to paymentStatus="PAID"
  • How: captureMetaPurchaseConversion() sends Meta CAPI Purchase with hashed email/phone, VND value, reservation reference, content IDs, and the shared event_id

Shared Event ID

Both signals use the same deterministic format:
reservation:<reservationId>:purchase
Built by buildPaidBookingEventId() from @hol/shared/analytics/marketing-event-id. Meta deduplicates when both Pixel and CAPI report the same purchase.
The /booking/confirmation page is the email receipt route. It renders booking details but does not fire a browser Purchase event (shouldTrackPurchase=false). It must stay live because sent confirmation emails link to it.

Server-Side Events

The payment backend sends these events directly to Meta. Server-sent events carry hashed customer data (not raw data) and confirmed payment amounts, making them more reliable than browser-only tracking.
EventWhen It Fires
PurchaseGuest completes a paid booking (confirmed by payment system)
InitiateCheckoutGuest enters the payment checkout step
AddPaymentInfoGuest submits their payment details
LeadGuest submits a qualified booking inquiry
For browser-origin events, landing sends them to POST /api/analytics/meta/outbound-event. Hono accepts only InitiateCheckout, AddPaymentInfo, and Lead. It creates an audit row only when it performs an outbound send attempt.

What Meta Receives

SignalIncludes
Server PurchaseHashed email/phone, booking value, currency, content IDs, reservation reference, event ID
Browser-origin eventsBrowser cookie data, source URL, IP, user-agent, commerce fields
Neither signal includes raw email, phone, customer name, form text, or payment secrets. Meta only sees hashed versions of customer contact data.

Admin Audit Log

Every Meta event sent by the server creates an audit record. Staff can review these in the dashboard to troubleshoot tracking issues and confirm that purchases are being reported correctly.
Audit FieldWhat It Shows
Event statusSent, Failed, Skipped, Pending
Reservation referenceHuman-readable booking ID
Event IDUnique deduplication key shared with browser Pixel
Pixel IDWhich Meta Pixel was used
Value / currencyVND amount of the booking
Sanitized payloadWhat was sent to Meta (access token and raw PII removed)
Meta responseWhat Meta replied
Meta trace IDFor debugging in Meta Events Manager
Every outbound CAPI attempt creates an audit row in hol_meta_conversions_api_events. View them at:
/dashboard/integration/meta/events

Meta Custom Conversion (Fallback)

If you need a custom conversion before server CAPI is fully verified, use an event-based rule in Meta Events Manager:
Event equals Purchase
Optional URL filter contains /booking/payment-result
Do not use a URL-only rule. The payment-result page can receive failed, pending, and not-found outcomes. Only the paymentStatus=PAID gate ensures Meta trains on actual purchases.

Setup

1

Create the Meta token

In Meta Events Manager, open the Pixel/Dataset, go to Settings, and generate a Conversions API access token. If Meta offers Dataset Quality API with direct integration, use it so Events Manager exposes match-rate and data-quality diagnostics.
2

Set Hono secrets

wrangler secret put META_CONVERSIONS_API_ACCESS_TOKEN
wrangler secret put META_CONVERSIONS_API_TEST_EVENT_CODE  # only during verification
3

Confirm public vars

Keep META_CONVERSIONS_API_ENABLED=true, META_PIXEL_ID=1686954142433862, and META_GRAPH_API_VERSION=v22.0 in the Hono Worker configuration.
4

Confirm secret presence

Run wrangler secret list from apps/hono and confirm META_CONVERSIONS_API_ACCESS_TOKEN is listed. The command shows only secret names, not values.
5

Check the admin audit

Open /dashboard/integration/meta/events and confirm Hono created audit rows for each outbound send attempt.
6

Verify in Meta Events Manager

Complete a production booking and confirm the server-sent Purchase appears alongside the browser Pixel Purchase, both sharing the same event_id.

Verification

1

Confirm browser events

Open landing with the Pixel configured. In Meta Events Manager, confirm PageView, ViewContent, InitiateCheckout, AddPaymentInfo, Purchase, and Lead appear.
2

Confirm booking conversion

Complete a paid booking flow. Confirm Meta receives the browser Purchase with a valid event_id.
3

Confirm CAPI Purchase

In Meta Events Manager, verify Hono sends a server Purchase after paid OnePay booking. Missing token means Hono stores a Skipped audit row.
4

Confirm CAPI intent events

Trigger begin_checkout, add_payment_info, and a lead submission. Confirm /dashboard/integration/meta/events shows audit rows for InitiateCheckout, AddPaymentInfo, and Lead.
5

Verify deduplication

Confirm Meta Events Manager shows both Pixel and CAPI Purchase events for the same booking with the same event_id, and deduplication is active.

Relationship to Other Platforms

Meta Pixel is one of three destinations that consume browser events from the centralized analytics module. See Analytics Overview for the full architecture, GTM for tag management, and PostHog for product analytics.