Event tracking on flyer.vn

1What fires today

The page carries the Meta pixel for dataset 490693673604378. The library is loaded lazily, on the first touch, key press or scroll, and otherwise when the browser goes idle or the page is hidden. Calls made before it loads are queued and flushed, so nothing is lost as long as the visitor does anything at all.

A headless run on 19/09/2026 recorded these, in this order, while loading the page with a campaign parameter, picking a grade, picking a package and creating an order.

Every event carries src, taken from utm_content or utm_campaign, so behaviour can be read per ad creative. The click identifier is captured correctly: loading the page with an fbclid produced both _fbc and _fbp cookies.

Three facts that limit everything else

1. No event identifier. Every request went out with eid empty. Without it, a server event and a browser event describing the same purchase would be counted twice, so the conversions interface cannot be turned on safely until this is fixed. This is the first change, not the last.
2. No matching data. The pixel is initialised with the dataset alone. The page asks for a phone number, which in Vietnam is the strongest identifier there is, and never passes it to Meta. Match quality stays at whatever the browser cookie can carry.
3. Purchase depends on an open tab. It fires only inside the polling callback. A parent who transfers the money and closes the page, or who pays the next morning, produces no purchase event at all. Every campaign optimising on purchases is therefore learning from a subset of real buyers, biased toward the fastest ones.

2The three kinds of trigger

Website events get mixed up because the word "event" covers three different things. Separating them decides where the code lives and what the campaign may optimise for.

The third row is the one this page has not built yet, and it is exactly the model behind the Pancake teardown: a seller picks an order status, and the platform turns that status change into the conversion event. FLYER already has the equivalent state machine. The orders Worker at flyer.vn/phong-thi-ao/api holds every order in key-value storage and moves it through created, claimed and fulfilled. That Worker is the right place for the money events, and it is already written.

3The event map for this page

The target design. The live marker means it already works; to build means it does not exist yet.

Money events carry value, currency, content_ids, external_id and the hashed phoneCurrency is always VND, value is what is actually chargedOrder code example: FLYERZ5BYUD

4What to add, in order

4.1 Give every event an identifier

This changes nothing visible and unblocks everything else. The identifier must be derived from the order code wherever an order exists, so the browser and the Worker produce the same string without talking to each other.

const rnd = () => Math.random().toString(36).slice(2, 10);
const SESSION = rnd();                         // one per page view

// standard event, with an explicit id
const std = (name, params, eventID) => {
  try {
    if (window.fbq) fbq('track', name,
      Object.assign({}, SRC, params || {}),
      { eventID: eventID || (name.toLowerCase() + ':' + SESSION) });
  } catch (e) {}
};

// at checkout, after the order code is known
std('InitiateCheckout', { value: pk.price, currency: 'VND',
    content_ids: [k], content_name: pk.name }, 'checkout:' + o.code);

Meta treats the same event name with the same identifier, arriving within forty-eight hours, as one event. That is what makes it safe for the page and the Worker to both report a checkout.

4.2 Hand the identity to Meta

Two separate things. In the browser, re-initialise the pixel with matching data once the parent has typed a valid phone number; the library normalises and hashes the values before they leave the device.

// after phoneNorm() returns a valid number
fbq('init', '490693673604378', {
  ph: '84' + phone.slice(1),   // 0912345678 -> 84912345678
  em: email || undefined,
  external_id: orderCode
});

On the server, the Worker needs the browser cookies to attribute the event, so they have to travel with the order. Add four fields to the existing POST /orders body.

const ck = n => (document.cookie.match('(^|;)\\s*' + n + '\\s*=\\s*([^;]+)') || [])[2] || '';

body: JSON.stringify({
  phone, phone_e164: '+84' + phone.slice(1), email, grade,
  package: k, amount: pk.price, source: 'landing-v2', code: mkCode(),
  fbp: ck('_fbp'),
  fbc: ck('_fbc'),               // present only if the visit carried fbclid
  page_url: location.href,
  ua: navigator.userAgent
});

Store those four with the order. They are what lets a purchase confirmed three hours later still be attributed to the ad that produced it.

4.3 Send the money events from the Worker

One function, called from the three places the order changes state. It needs two secrets on the Worker: the dataset identifier and a conversions access token generated in Events Manager.

const sha256 = async (v) => {
  const buf = await crypto.subtle.digest('SHA-256', new TextEncoder().encode(v));
  return [...new Uint8Array(buf)].map(b => b.toString(16).padStart(2, '0')).join('');
};

async function metaEvent(env, name, order, eventId, extra = {}) {
  const user_data = {
    ph: [await sha256(String(order.phone_e164 || '').replace(/\D/g, ''))],
    client_user_agent: order.ua,
    fbp: order.fbp || undefined,
    fbc: order.fbc || undefined,
    external_id: [await sha256(order.code)]
  };
  if (order.email) user_data.em = [await sha256(order.email.trim().toLowerCase())];

  const payload = { data: [{
    event_name: name,
    event_time: Math.floor(Date.now() / 1000),
    event_id: eventId,
    action_source: 'website',
    event_source_url: order.page_url || 'https://flyer.vn/phong-thi-ao/',
    user_data,
    custom_data: Object.assign({
      value: order.amount, currency: 'VND',
      content_ids: [order.package], content_type: 'product'
    }, extra)
  }] };

  await fetch(`https://graph.facebook.com/v21.0/${env.PIXEL_ID}/events?access_token=${env.CAPI_TOKEN}`,
    { method: 'POST', headers: { 'content-type': 'application/json' },
      body: JSON.stringify(payload) });
}

Wire it to the endpoints that already exist in the Worker.

Send it with waitUntil so a slow call to Meta never delays the response the support page or the parent is waiting for. Write the identifier into the stored order as well, so a retry cannot produce a second purchase with a new identifier.

4.4 Close the loop with the bank

The purchase event is only as timely as the moment someone marks the order paid. Today that is a person on the support page. The SePay webhook matching the transfer description to the order code is the last piece, and it is the same piece the activation-code work is waiting on. When it lands, point it at the fulfil path so the purchase event and the activation code come from one place.

5Naming and parameter rules

• Use the standard name whenever one exists. Only standard events can be chosen as a campaign objective without building a custom conversion first. The six in use here are the right six.
• Prefix every custom event with the page it belongs to, as PTA_ already does. It keeps one dataset readable when several FLYER pages report into it.
• One event per stage, and never two names for the same moment. AddToCart and PTA_PlanSelect currently fire on the same click. That is acceptable because one is standard and one carries the diagnostic detail, but do not let the pattern spread.
• Value and currency travel together on every event that has money, and the value is what is actually charged, not the list price.
• Never send a raw phone number or email in a parameter. In the browser, pass them through the pixel's matching fields, which hash before sending. On the server, hash with SHA-256 yourself, after normalising: digits only for the phone with the country code and no plus sign, lowercase and trimmed for the email.
• Keep src on everything. It is the only way to see which creative produced which behaviour once several ads point at the same page.
• Decide the attribution window and write it down. Meta's default is seven days after a click and one day after a view. Parents on this page compare prices for longer than that, and a transfer often happens the next evening. Report on the seven-day window, but expect the order book to show purchases the ad account never claims.

6How to verify

1. Test events. In Events Manager open the dataset, take the test code, and pass it as test_event_code in the Worker payload while testing. Browser and server events appear in the same live view, which is where deduplication can be seen working: one purchase, two sources, one row.
2. Check the overlap. After a week, the dataset's diagnostics report a deduplication rate for each event name. If the browser and server purchase counts are both present but the deduplication rate is near zero, the identifiers do not match.
3. Watch match quality. Events Manager scores each event's customer information. Adding the hashed phone should move the purchase event well up that scale.
4. Reconcile against the order book weekly. The Worker's admin list is the truth. Compare its paid orders against purchases in Ads Manager. A gap is normal because of the attribution window; a gap that grows means events are failing.
5. Re-run the browser trace after any change to the page. Loading the page with a campaign parameter and clicking through to the QR should produce the same ordered list of events as section 1.

7Google, TikTok and Zalo

The page currently has no analytics tag, no TikTok pixel and no Google tag. That is a defensible choice while only Meta campaigns point here, and it keeps the page fast. Three things are worth knowing before that changes.

• Analytics is a different job from conversion signal. If the question is which section parents read before buying, that is measurement and belongs in an analytics tool. If the question is which ad to show next, that is the pixel. Do not add a tag manager only to answer the second question.
• TikTok needs its own event set and its own identifier on the conversation or order, and its counting method will not agree with Meta's. Expect two numbers and reconcile against the order book rather than against each other.
• Zalo clicks leave the page. The click is recorded as a custom event, but what happens in the conversation afterwards is only visible in Pancake. Joining the two requires the phone number, which both sides have.

8What changes in the ad account

The measurement work only pays off if the campaigns are told to use it.

Until the server events are live, none of these rows can be trusted, because the purchase count in the account is missing every buyer who closed the tab. Fix section 4.1 and 4.3 first, let a week of data accumulate, then pick the row that matches the volume.