Skip to main content
DeviceAtlas DeviceAtlas
  • Login
  • Get started
  • Products
    • Web
      DeviceAtlas for Web

      Build enterprise grade device awareness

      into your products and services

    • Apps
      DeviceAtlas for Apps

      Device intelligence, targeting and reporting

      in the native apps environment

    • Operators
      Device Map

      Fine grained device intelligence

      indexed by TAC/IMEI

    • DeviceAssure
      DeviceAssure

      Verify the authenticity of devices

      accessing your content and services

    • DeviceAtlas Discover
      DeviceAtlas Discover

      Rich insights about your web traffic that

      analytics platforms don’t tell you about

    DEVICE INTELLIGENCE

    Learn more with our
    intro video

    Deliver an amazing customer
    experience across devices.

    TECHNOLOGY OVERVIEW

    Get an overview of our technology.

  • Use Cases
    • Ad-Tech
      AdTech

      Enable granular device targeting of your campaigns.

      Maximize revenue from impressions and reduce discrepancies

    • Optimization
      Web Optimization

      Ensure content is delivered in a form that’s

      optimized for the end user’s device

    • Analytics
      Analytics

      Understand customer engagement at

      device level

    • Internet of Things
      Internet of Things

      Measure IoT activity on your network

    • OTT Streaming
      Online Streaming Services

      Identity OTT traffic from STBs, Smart

      TVs, and Games Consoles

    • eCommerce
      eCommerce

      Identify factors affecting cart abandonment rates, and ensure optimal user experiences for mobile devices.

    • Gaming
      Gaming

      Enhance knowledge of gaming devices for better analytics and reporting, real-time QoS/QoE monitoring, and more relevant targeting opportunities.

    • Reverse Logistics
      Reverse Logistics

      -

    • Device Insurance
      Device Insurance

      -

    CASE STUDIES

    Learn how market
    leaders are using us
    to outperform their
    competition

    Adoppler and our partners have experienced significant improvements since implementing DeviceAtlas.

    Anton Tkachuk

    Product Manager, Adoppler

    View all case studies

  • Pricing
  • Developers
    • Technology Overview

      Get an overview of our technology

    • Getting Started

      Step by step guide to get up and running fast

    • APIs

      Downloads and information on all APIs

    • About the data

      Device data and available properties

    • Docs & Support

      FAQ's documentation and support

    • Knowledge Base

      Explore our expansive library of free

      whitepapers, eBooks and how-to guide

  • Data & Insights
    • Blog

      Stay informed with our articles on device

      research, data and insights

    • Case Studies

      See why market leaders choose DeviceAtlas

    • Device Browser

      Device information and properties

    • Data Explorer

      Explore and analyse DeviceAtlas data

    • Properties

      Check out our available device properties

    • HTTP Headers Parser

      Check DeviceAtlas results for HTTP Headers

  • Login
  • Get started
Log inSign up
Forgot Password?

Sign up below to view device data and get your trial account.

Passwords match:

Cancel
  • Products
    • DeviceAtlas for Web
    • DeviceAtlas for Apps
    • Device Map
    • DeviceAssure
    • DeviceAtlas Discover
    • Technology Overview
  • Use Cases
    • AdTech
    • Web Optimization
    • Analytics
    • Internet of Things
    • Online Streaming Services
    • eCommerce
    • Gaming
    • Reverse Logistics
    • Device Insurance
    • Case Studies
  • Pricing
  • Developers
    • Technology Overview
    • Getting Started
    • APIs
    • About the Data
    • Docs & Support
    • Knowledge Base
  • Data & Insights
    • Blog
    • Case Studies
    • Device Browser
    • Data Explorer
    • Properties
    • HTTP Headers Parser
  • Login
  • Get started
  • Search

Getting Started

  • Enterprise
    • DeviceAtlas for Web
    • DeviceAtlas for Apps
  • Cloud
  • DeviceAssure
    • DeviceAssure for Web
    • DeviceAssure for Apps
  • Discover

APIs

  • Enterprise APIs
    • Download API
    • Documentation
    • API examples
    • Performance
  • Cloud Service
    • Download API
    • Documentation
    • Cloud Service End-Points
    • Google Sheets Integration
  • DeviceAssure APIs
    • Download API
    • Documentation
  • Client-side Component
    • iOS H/W Identification
    • Usage
    • Download
  • REST API
  • User-Agent Client Hints
    • Developer considerations
    • Web server configuration
    • OpenRTB and UA-CH
    • Capturing in JavaScript
    • Header precedence logic

Data

  • Data Downloads
    • Carrier Data
    • Device Data (JSON)
    • Device Map (TAC)
  • Data File Configuration
  • Contributing
  • About Our Data
  • Dynamic Data
  • Becoming a Data Partner

Properties

  • Available Properties
  • Client-side Properties

FAQ

  • Support
  • General
  • Licensing

More

  • Side-loaded Browsers
  • Whitepapers
  • Case Studies

Capturing User-Agent Client-Hint data from the browser with JavaScript

As defined in the WICG User-Agent Client-Hints specification, User-Agent Client Hints (UA-CH) are available on the server side in the form of additional HTTP request headers and the client side via a JavaScript API. Confusingly, there are some slight differences in naming between the two different sources so some of our customers have asked us for guidance on obtaining UA-CH from the browser, but in a header-like format that can then be sent to a server as part of an existing payload for analysis by DeviceAtlas.

This code may be useful for customers with integrations with publishers, to share with their publisher partners to facilitate capture of client hints, or for publishers for their own use.

This library emits a JSON object containing the full set of HTTP headers to enable a DeviceAtlas API to resolve them into device properties. If the browser supports UA-CH then the the appropriate headers are included, if not only the User-Agent string is captured.

Usage

// Import module 
import { clientHintHeaders } from "./clientHintHeaders.js";

// Wait for client hints promise to resolve and log the header name and value to the console
clientHintHeaders.then(res => {
    for (const [header, value] of Object.entries(res)) {
        console.log(`${header}: ${value}`);
    }
});

Output

Chrome emulating a Pixel 5

User-Agent: Mozilla/5.0 (Linux; Android 11; Pixel 5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/90.0.4430.91 Mobile Safari/537.36
Sec-Ch-Ua: "Not?A_Brand";v="8", "Chromium";v="108", "Google Chrome";v="108"
Sec-Ch-Ua-Arch: ""
Sec-Ch-Ua-Mobile: ?1
Sec-Ch-Ua-Model: "Pixel 5"
Sec-Ch-Ua-Platform: "Android"
Sec-Ch-Ua-Platform-Version: "11"
Sec-Ch-Ua-Full-Version-List: "Not?A_Brand";v="8.0.0.0", "Chromium";v="108.0.5359.124", "Google Chrome";v="108.0.5359.124"
Sec-Ch-Ua-Bitness: "64"
Sec-Ch-Ua-Wow64: ?0

Safari on macOS Big Sur

User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.4 Safari/605.1.15

Firefox on macOS Big Sur

User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:108.0) Gecko/20100101 Firefox/108.0

Code

clientHintHeaders.js

const getBrandsConcatenated = (brands) => {
    return brands.map(value => {
        let brandEscaped = escapeDoubleQuoteAndBackslash(value.brand);
        return `"${brandEscaped}";v="${value.version}"`;
    }).join(", ");
}

const doubleQuoteEscape = (value) => {
    return value.replace(/"/g, '\\"');
}

const backslashEscape = (value) => {
    return value.replace(/\\/, "\\\\");
}

const escapeDoubleQuoteAndBackslash = (value) => {
    if (typeof value === 'string' && value){
        value = backslashEscape(value);
        value = doubleQuoteEscape(value);
    }

    return value;
}

const isValidArray = (fullVersionList) => {
    return typeof fullVersionList !== 'undefined' && Array.isArray(fullVersionList);
}

const getBrowserList = (fullVersionList, brands) => {
    if (isValidArray(fullVersionList) ){
        return getBrandsConcatenated(fullVersionList);
    } else if (isValidArray(brands) ){
        return getBrandsConcatenated(brands);
    }
}

const getHintsValues = () => {
    return [
        'brands',
        'mobile',
        'platform',
        'architecture',
        'bitness',
        'fullVersionList',
        'model',
        'platformVersion',
        'wow64',
    ];
}

function getPropertyQuoted(property) {
    if (property !== undefined){
        let valueEscaped = escapeDoubleQuoteAndBackslash(property);
        return `"${valueEscaped}"`;
    }

    return property;
}

export const clientHintHeaders = (new Promise(resolve => {
    const navUAData = navigator && navigator.userAgentData
    if (navUAData) {
        navUAData.getHighEntropyValues(getHintsValues()).then(ua => {
            const headers = {
                'User-Agent': navigator.userAgent,
                'Sec-CH-UA': getBrowserList(ua.brands),
                'Sec-CH-UA-Arch': getPropertyQuoted(ua.architecture),
                'Sec-CH-UA-Mobile': '?' + (ua.mobile ? '1' : '0'),
                'Sec-CH-UA-Model': getPropertyQuoted(ua.model),
                'Sec-CH-UA-Platform': getPropertyQuoted(ua.platform),
                'Sec-CH-UA-Platform-Version': getPropertyQuoted(ua.platformVersion),
                'Sec-CH-UA-Full-Version-List': getBrowserList(ua.fullVersionList, ua.brands),
                'Sec-CH-UA-Bitness': getPropertyQuoted(ua.bitness),
                'Sec-CH-UA-Wow64': '?' + (ua.wow64 ? '1' : '0')
            };

            resolve(headers);
        })
    } else if (navigator) {
        resolve({
            'User-Agent': navigator.userAgent,
        });
    } else {
        resolve({});
    }
}));

DeviceAtlas identifies and verifies connected devices in real-time for rich, actionable intelligence across every customer touchpoint

DeviceAtlas LinkedIn DeviceAtlas X DeviceAtlas YouTube

Our Products

DeviceAtlas for Web

The full picture on web traffic with detailed metadata on all visiting devices

DeviceAtlas for Apps

Device intelligence, targeting and reporting in the native apps environment

DeviceAssure

Real-time identification of fraudulent and misrepresented traffic

Device Map

TAC-based device insights for the mobile ecosystem, in partnership with the GSMA

Industries

AdTech Optimization Analytics Internet of Things OTT / Streaming eCommerce Gaming Reverse Logistics Device Insurance

Quick links

Pricing About us Events Blog Device Intelligence Device Detection Technology Partners Case Studies Data & Insights Developers Contact us

Copyright © DeviceAtlas Limited 2025. All Rights Reserved. Terms & Conditions | Privacy Policy

This is a website of DeviceAtlas Limited, a private company limited by shares, incorporated and registered in the Republic of Ireland with registered number 398040 and registered office at 6th Floor, 2 Grand Canal Square, Dublin 2, Ireland

Industry Affiliations