What is User-Agent Client Hints? | Device Detection on Modern Browsers
#useragent #clienthints #browsers
What is User-Agent Client Hints? | Device Detection on Modern Browsers
User-Agent request header
A User-Agent (UA) is a string that identifies the ‘agent’(browser) or program making a request to a web server for an asset such as a document, image or web page.
It is a standard part of web architecture and is passed by all web requests in the HTTP headers.
Helps make important decisions on how to handle web traffic.
User-Agent: product / product-version comment
User-Agent: Mozilla/version (system-information) platform (platform-details)
extensions
e.g.
user-agent:
Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/89.0.4389.82 Safari/537.36
Mozilla/5.0 (Linux; Android 5.1.1; Nexus 5 Build/LMY48B; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/43.0.2357.65 Mobile Safari/537.36
The user agent string can be accessed with JavaScript on the client side using the
navigator.userAgent property.
User-Agent header - Benefits
A browser's user agent string (UA) parsing helps to identify which browser is being used, what version, and on which operating system.
Identify and handle requests from certain types of traffic - load different CSS, Deliver custom JavaScript, different page layouts, different content
Adapt the web site to the specific capabilities of the device
Diagnose browser or device-specific issues such as slow performance of video rendering
Programmatic advertising
Understanding web traffic to improve experiences - analytics.
Fraud and non-human identification services.
Optimizing images and video
User-Agent Header Concerns
With the increasing demand for new attributes, the header size has increased significantly
It also affected user’s privacy since User-Agent transmit all the data to the server by default
Fingerprint users - to identify & track individual people without using cookies or other restricted tracking mechanisms
User Agent data is not standard across all the browsers
Complex regex to parse user agent data
User-Agent Client Hints
Client hints were introduced by Google for Chrome, and other browsers have adopted (or in the process of adopting) them since the HTTP specification(https://wicg.github.io/ua-client-hints/) was released.
The User-Agent header freezed in favor of User-Agent Client Hints.
Introduced as an alternative for the User-Agent string allowing access to the same data while protecting the users’
privacy.
Unlike the User-Agent string, User-Agent Client Hints do not transmit all the data to the server by default.
Reduce the passive fingerprinting surface by locking the User-Agent header and replacing it with a set of opt-in
Client Hints
Client Hints will not be delivered to non-secure endpoints
Server must ask the browser for a set of data about the client (the hints) and the browser applies its own policies or user configuration to determine what data is returned.
Developers also benefit from a simpler API - no more regular expressions
User-Agent Client Hints Header
Request Headers:
Sec-CH-UA : list of browser brands versions (Eg: “Google Chrome”; v=”84")
Sec-CH-UA-Platform : Platform for the device, usually the operating system. (Eg:"Windows")
Sec-CH-UA-Platform-Version : Version for the platform or OS.
Sec-CH-UA-Arch : Underlying architecture for the device. (Eg: ARM64)
Sec-CH-UA-Model : The device model. (Eg: “OnePlus 6”)
Sec-CH-UA-Mobile : Boolean indicating if the browser is on a mobile device or not. (?1 for true, ?0 for false)
Sec-CH-UA-Full-Version : The complete version for the browser. (Eg: “73.1.2343B.TR”)
Sec-CH-UA-Bitness - bitness of the architecture of the platform on which a given user agent is executing e.g 64
Response Headers:
Accept-CH - The Accept-CH header is set by the server to specify which Client Hints headers a client should include in subsequent requests.
Sec-CH-UA and Sec-CH-UA-Mobile are known as low entropy hints, and these 2 hints will be sent by default with the initial request from the client to the server.
If the server needs to know anything other than browser brand and mobile or not, it will have to request it from the client using the Accept-CH header in the response.
Scope of a Hint
Usually, scope of a User-Agent Client Hint is limited to same origin requests.
But if there is a need, we can configure hints in cross-origin requests by specifying Feature-Policy/Permission-Ploicy header.
For example, if you want to get hints from https://example.com to https://sub.example.com , response from https://example.com should include Feature-Policy header in addition to the usual Accept-CH header.
Accept-CH: Sec-CH-UA-Full-Version
Feature-Policy: ch-ua-full-version https://sub.example.com;
Life Time of a Hint - Hints specified via the Accept-CH header will be sent for the duration of the browser session or until a different set of hints are specified.
Watch video What is User-Agent Client Hints? | Device Detection on Modern Browsers online without registration, duration hours minute second in high quality. This video was added by user Tech Forum 18 April 2021, don't forget to share it with your friends and acquaintances, it has been viewed on our site 4,607 once and liked it 38 people.