Track events in JSS apps using the Tracking API

Version:

You can use the JSS Tracking API to track events, goals, outcomes, campaigns, and page/route views.

To track events in a JSS page or component:

Configure the Tracking API, providing the Sitecore API host and the Sitecore API key:

import { trackingApi } from '@sitecore-jss/sitecore-jss/tracking

const trackingApiOptions = {
  host: config.sitecoreApiHost,
  querystringParams: {
    sc_apikey: config.sitecoreApiKey,
  },
};

To track a simple event, call the trackEvent method of the JSS Tracking API with a parameter of the type EventInstance. For example, to track the click of a Download button:

trackingApi
  .trackEvent(
    [
      { eventId: 'Download' }
    ], 
    trackingApiOptions
  )
  .then(() => console.log('Clicked Download button'))
  .catch((error) => console.error(error));

The trackEvent method accepts an array of events. For example, to track the click of a button and a page view, you can add the page view event to the array:

[
  { eventId: 'Download' },
  { pageId: '{110D559F-DEA5-42EA-9C1C-8A5DF7E70EF9}', url: '/' }
]

If you have suggestions for improving this article, let us know!