Amplitude cross domain tracking

Track responders in Amplitude across domains

Overview

If you would like to track Amplitude users across multiple domains e.g:

  • Site 1: https://www.example.com

  • Site 2: https://www.flow.example.com (the domain hosting the Formsort flow)

You must explicitly pass the amplitude device id from the top level domain to the one hosting the Formsort flow. This can be done for the both with a direct link deployment or an embedded flow.

Setup

Step 1: Enable using cross domain tracking in the Amplitude integration

Navigate to the Amplitude integration and enable "Use device ID from URL parameter".

Step 2: Pass the device id as a query parameter to responders hitting the flow

Follow the official Amplitude documentation. After deploying the flow in Step 1, you can now pass a device id into the flow as a parameter.

Pass the device id as a query parameter, for example this may look like:

  1. From the initial Site 1 grab the Device ID from the Amplitude SDK using amplitude.getInstance().options.deviceId.

  2. Pass the Device ID to the new Site 2 via a URL parameter when the user navigates. (e.g. https://flow.example.com/client/{{your_account_name}}/flow/{{your_flow_name}}/variant/{{your_flow_variant_name}}/?amp_device_id=device_id_from_site_1)

  3. Initialize the Amplitude SDK on Site 2 with amplitude.init('API_KEY', null, {deviceIdFromUrlParam: true}).

Passing via embed

If you want to enable cross domain tracking in an embedded flow, you can pass amp_device_id via query_params in our react-embed package. e.g.

// in the main site retrieve device id from amp instance
const ampDeviceId = amplitude.getInstance().options.deviceId;

// pass the device id to Formsort flow
<EmbedFlow
  clientLabel="client"
  flowLabel="onboarding"
  queryParams={[['amp_device_id', ampDeviceId]]}
/>

If you don't use react, you can do the same using our web-embed-api. e.g.

// in the main site retrieve device id from amp instance
const ampDeviceId = amplitude.getInstance().options.deviceId;

embed.loadFlow(
  'client', // client label
  'onboarding', // flow label
  'main', // variant label - optional
  [['amp_device_id', ampDeviceId]] // query params
)

Note: After initializing amplitude, Formsort flow removes device id from URL. But cross-domain tracking keeps working if user refreshes the page.

Last updated