Track user agent client hints on web

Client hints include information about the user, network, or device. They're an alternative or supplement to tracking the user agent. They're available in most Chromium-based browsers.

This is useful data to capture as browsers are moving away from high entropy user agent strings. Client hints offer useful information to understand browser usage, without the potential to infringe on a user's privacy as can be the case with the user agent string.

Use the client hints plugin to capture hints information from navigator.userAgentData in an entity.

This entity can be configured in two ways:

1. clientHints: true: captures the "low entropy" client hints isMobile and brands
2. clientHints: { includeHighEntropy: true }: captures the "low entropy" hints as well as the "high entropy" hints architecture, model, platform, platformVersion, and uaFullVersion

High entropy hints can potentially be used to fingerprint users, and so might not be suitable depending on your consent strategy. No additional configuration is needed to capture the high entropy hints here.

For the full schema details see the device and browser tracking overview page.

The Client Hints entity is automatically tracked once configured.

Install plugin

JavaScript (tag)

Tracker Distribution	Included
sp.js	❌
sp.lite.js	❌

Download:

Download from GitHub Releases (Recommended)	Github Releases (plugins.umd.zip)
Available on jsDelivr	jsDelivr (latest)
Available on unpkg	unpkg (latest)

Note: The links to the CDNs above point to the current latest version. You should pin to a specific version when integrating this plugin on your website if you are using a third party CDN in production.

javascript

// Basic
window.snowplow('addPlugin',
  "https://cdn.jsdelivr.net/npm/@snowplow/browser-plugin-client-hints@latest/dist/index.umd.min.js",
  ["snowplowClientHints", "ClientHintsPlugin"]
);

// High Entropy
window.snowplow('addPlugin',
  "https://cdn.jsdelivr.net/npm/@snowplow/browser-plugin-client-hints@latest/dist/index.umd.min.js",
  ["snowplowClientHints", "ClientHintsPlugin"],
  { includeHighEntropy: true }
);

Browser (npm)

• npm install @snowplow/browser-plugin-client-hints
• yarn add @snowplow/browser-plugin-client-hints
• pnpm add @snowplow/browser-plugin-client-hints

javascript

import { newTracker } from '@snowplow/browser-tracker';
import { ClientHintsPlugin } from '@snowplow/browser-plugin-client-hints';

// Basic
newTracker('sp1', '{{collector_url}}', {
   appId: 'my-app-id',
   plugins: [ ClientHintsPlugin() ],
});

// High Entropy
newTracker('sp1', '{{collector_url}}', {
   appId: 'my-app-id',
   plugins: [ ClientHintsPlugin(true) ],
});