User-Agent Client Hints es una nueva expansión de la API de Client Hints, que posibilita a los desarrolladores ingresar a información sobre el navegador de un usuario de una manera ergonómica y que preserva la privacidad.
Actualizado
Seguro y a salvo
Las sugerencias de cliente posibilitan a los desarrolladores solicitar activamente información sobre el dispositivo o las condiciones del usuario, en lugar de tener que analizarla fuera de la cadena de usuario-agente (UA). Proporcionar esta ruta alternativa es el primer paso para disminuir eventualmente la granularidad de las cadenas de usuario-agente.
Aprenda a actualizar su funcionalidad existente que se basa en analizar la cadena de usuario-agente para hacer uso de las sugerencias de cliente de usuario-agente.
Antecedentes
Cuando los navegadores web realizan solicitudes, incluyen información sobre el navegador y su entorno para que los servidores puedan habilitar el análisis y personalizar la respuesta. Esto se definió en 1996 (RFC 1945 para HTTP / 1.0), donde puede hallar el definición original de la cadena Usuario-Agente, que incluye un ejemplo:
User-Agent: CERN-LineMode/2.15 libwww/2.17b3
Este encabezado estaba destinado a especificar, en orden de relevancia, el producto (a modo de ejemplo, navegador o biblioteca) y un comentario (a modo de ejemplo, versión).
El estado de la cadena de usuario-agente
Sobre la intervención décadas, esta cadena ha acumulado una gama de detalles adicionales sobre el cliente que realiza la solicitud (así como cruft, debido a la compatibilidad con versiones anteriores). Podemos ver eso cuando miramos la cadena actual de User-Agent de Chrome:
Mozilla/5.0 (Linux; Android 10; Pixel 3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4076.0 Mobile Safari/537.36
La cadena anterior contiene información sobre el sistema operativo y la versión del usuario, el modelo del dispositivo, la marca del navegador y la versión completa, pistas suficientes para inferir que es un navegador teléfono celular y sin mencionar una serie de referencias a otros navegadores por razones históricas.
La combinación de estos parámetros con la gran diversidad de valores posibles significa que la cadena Usuario-Agente podría contener suficiente información para permitir que los usuarios individuales sean identificados de forma única. Si prueba su propio navegador en
AmIUnique, puedes ver cuán cerca tu
La cadena de usuario-agente identifica tú. Cuanto menor sea el «índice de similitud» resultante, más exclusivas serán sus solicitudes, más fácil será para los servidores rastrearlo de forma encubierta.
La cadena de usuario-agente habilita muchos casos de usoy tiene un propósito importante para los desarrolladores y propietarios de sitios. A pesar de todo, además es fundamental que la privacidad de los usuarios esté protegida contra métodos de seguimiento encubiertos, y el envío de información de UA de forma predeterminada va en contra de ese objetivo.
Además existe la necesidad de mejorar la compatibilidad web cuando se trata de la cadena Usuario-Agente. No está estructurado, por lo que analizarlo genera una complejidad innecesaria, que usualmente es la causa de errores y problemas de compatibilidad del sitio que perjudican a los usuarios. Estos problemas además perjudican de forma desproporcionada a los usuarios de navegadores menos habituales, puesto que es factible que los sitios no hayan podido probar su configuración.
Presentación de las nuevas sugerencias de cliente de agente de usuario
Sugerencias de cliente de agente de usuario
permitir el acceso a la misma información pero de una manera más preservada de la privacidad, lo que a su vez posibilita que los navegadores reduzcan eventualmente el valor predeterminado de la cadena Usuario-Agente de transmitir todo. Sugerencias para el cliente Aplicar un modelo en el que el servidor debe solicitar al navegador un recopilatorio de datos sobre el cliente (las sugerencias) y el navegador aplica sus propias políticas o configuración de usuario para establecer qué datos se devuelven. Esto significa que en lugar de exponer todas
La información de Usuario-Agente de forma predeterminada, el acceso ahora se gestiona de forma explícita y auditable. Los desarrolladores además se benefician de una API más simple: ¡no más expresiones regulares!
El conjunto actual de Sugerencias para el cliente describe principalmente las capacidades de conexión y visualización del navegador. Puede explorar los detalles en Automatización de la selección de recursos con sugerencias para el cliente, pero aquí hay un repaso rápido sobre el procedimiento.
El servidor solicita sugerencias de cliente específicas a través de un encabezado:
⬇️ Respuesta del servidor
Accept-CH: Viewport-Width, Width
O una metaetiqueta:
<meta http-equiv="Accept-CH" content="Viewport-Width, Width" />
Después, el navegador puede elegir por enviar los siguientes encabezados en solicitudes posteriores:
⬆️ Solicitud posterior
Viewport-Width: 460
Width: 230
El servidor puede elegir por variar sus respuestas, a modo de ejemplo, ofreciendo imágenes con una resolución adecuada.
Hay discusiones en curso sobre la habilitación de las sugerencias del cliente en una solicitud inicial, pero debe considerar un diseño receptivo o una mejora progresiva antes de seguir esta ruta.
Las sugerencias de cliente de agente de usuario amplían la gama de propiedades que se pueden especificar a través de el Accept-CH
encabezado de respuesta del servidor. Cuando el navegador devuelve información, utilizará el Sec-CH-UA
prefijo. Para todos los detalles, comience con el explicador y posteriormente sumergirse en el iniciativa completa.
El nuevo conjunto de sugerencias se encuentra disponible en Chromium 84, por lo tanto exploremos cómo funciona todo.
Sugerencias de cliente de agente de usuario en Chromium 84
Las sugerencias de cliente de agente de usuario solo se habilitarán gradualmente en Chrome estable como
preocupaciones de compatibilidad se resuelven. Para forzar la funcionalidad de prueba, asegúrese de:
- están en Chrome 84 beta o idéntico
- habilitar el
chrome://flags/#enable-experimental-web-platform-features
bandera
De manera predeterminada, el navegador devuelve la marca del navegador, la versión significativa / principal y un indicador si el cliente es un dispositivo teléfono celular:
⬆️ Todas las solicitudes
Sec-CH-UA: "Chromium";v="84", "Google Chrome";v="84"
Sec-CH-UA-Mobile: ?0
Precaución:
Estas propiedades son más complejas que un solo valor, por lo que Encabezados estructurados
se usan para representar listas y valores booleanos.
Respuestas de agente de usuario y encabezados de solicitud
⬇️ RespuestaAccept-CH |
⬆️ Solicitar encabezamiento |
⬆️ Solicitar Valor de ejemplo |
Descripción |
---|---|---|---|
UA |
Sec-CH-UA |
"Chromium";v="84", "Google Chrome";v="84" |
Lista de marcas de navegadores y su versión significativa. |
UA-Mobile |
Sec-CH-UA-Mobile |
?1 |
Booleano que indica si el navegador está en un dispositivo teléfono celular (?1 de verdad) o no (?0 por falso). |
UA-Full-Version |
Sec-CH-UA-Full-Version |
"84.0.4143.2" |
La versión completa para el navegador. |
UA-Platform |
Sec-CH-UA-Platform |
"Android" |
La plataforma del dispositivo, de forma general el sistema operativo (SO). |
UA-Platform-Version |
Sec-CH-UA-Platform-Version |
"10" |
La versión para la plataforma o el sistema operativo. |
UA-Arch |
Sec-CH-UA-Arch |
"ARM64" |
La arquitectura subyacente del dispositivo. Aunque esto puede no ser relevante para mostrar la página, es factible que el sitio desee ofrecer una descarga con el formato correcto de forma predeterminada. |
UA-Model |
Sec-CH-UA-Model |
"Pixel 3" |
El modelo de dispositivo. |
Las consideraciones de privacidad y compatibilidad significan que el valor puede estar en blanco, no devuelto o poblado con un valor variable. Esto se conoce como
GRASA.
Intercambio de ejemplo
Un intercambio de ejemplo se vería así:
⬆️ Solicitud inicial del navegador
El navegador solicita el /downloads
página del sitio y envía su User-Agent básico predeterminado.
GET /downloads HTTP/1.1
Host: example.siteSec-CH-UA: "Chromium";v="84", "Google Chrome";v="84"
Sec-CH-UA-Mobile: ?0
⬇️ Respuesta del servidor
El servidor devuelve la página y, al mismo tiempo, solicita la versión completa del navegador y la plataforma.
HTTP/1.1 200 OK
Accept-CH: UA-Full-Version, UA-Platform
⬆️ Solicitudes posteriores
El navegador otorga al servidor acceso a la información adicional y envía las sugerencias adicionales en todas las respuestas posteriores.
GET /downloads/app1 HTTP/1.1
Host: example.siteSec-CH-UA: "Chromium";v="84", "Google Chrome";v="84"
Sec-CH-UA-Mobile: ?0
Sec-CH-UA-Full-Version: "84.0.4143.2"
Sec-CH-UA-Platform: "Android"
API de JavaScript
Al mismo tiempo de los encabezados, además se puede ingresar al User-Agent en JavaScript a través de
navigator.userAgentData
. El valor por defecto Sec-CH-UA
y Sec-CH-UA-Mobile
se puede ingresar a la información del encabezado a través del brands
y mobile
propiedades, respectivamente:
console.log(navigator.userAgentData.brands);
[
{
brand: 'Chromium',
version: '84',
},
{
brand: 'Google Chrome',
version: '84',
},
];
console.log(navigator.userAgentData.mobile);
false;
Se accede a los valores adicionales a través del getHighEntropyValues()
llamada. El término «alta entropía» es una referencia a entropía de información, dicho de otra forma, la cantidad de información que estos valores revelan sobre el navegador del usuario. Del mismo modo que con la solicitud de encabezados adicionales, depende del navegador qué valores, si corresponde, se devuelven.
navigator
.userAgentData.getHighEntropyValues(
["architecture", "model", "platform", "platformVersion",
"uaFullVersion"])
.then(ua => { console.log(ua) });
{
"architecture": "x86",
"model": "",
"platform": "Linux",
"platformVersion": "",
"uaFullVersion": "84.0.4143.2"
}
Manifestación
Puede probar tanto los encabezados como la API de JavaScript en su propio dispositivo en
user-agent-client-hints.glitch.me.
Asegúrese de que está usando Chrome 84 Beta o idéntico con
chrome://flags/#enable-experimental-web-platform-features
habilitado.
Sugerencia de por vida y restablecimiento
Sugerencias especificadas a través de el Accept-CH
El encabezado se enviará durante la sesión del navegador o hasta que se especifique un recopilatorio distinto de sugerencias.
Eso significa que si el servidor envía:
⬇️ Respuesta
Accept-CH: UA-Full-Version
Entonces el navegador enviará el Sec-CH-UA-Full-Version
encabezado en todas las solicitudes de ese sitio hasta que se cierre el navegador.
⬆️ Solicitudes posteriores
Sec-CH-UA-Full-Version: "84.0.4143.2"
A pesar de todo, si otro Accept-CH
se recibe el encabezado, entonces eso reemplazar absolutamente las sugerencias actuales que envía el navegador.
⬇️ Respuesta
Accept-CH: UA-Platform
⬆️ Solicitudes posteriores
Sec-CH-UA-Platform: "Android"
El anteriormente solicitado Sec-CH-UA-Full-Version
no será enviado.
Es mejor pensar en el Accept-CH
encabezado que especifica el conjunto completo de sugerencias deseadas para esa página, lo que significa que el navegador envía las sugerencias especificadas para todos los subrecursos en esa página. Aunque las sugerencias persistirán hasta la siguiente navegación, el sitio no debe confiar ni hacerse cargo que se entregarán.
Éxito:
Asegúrese siempre de poder ofrecer una experiencia significativa sin esta información. Esto es para impulsar la experiencia del usuario, no para definirla. ¡Es por esto que se llaman «pistas» y no «respuestas» o «requerimientos»!
Además puede utilizar esto para eliminar de manera efectiva todas las sugerencias enviadas por el navegador enviando un espacio en blanco Accept-CH
en la respuesta. Considere agregar esto en cualquier lugar donde el usuario esté restableciendo preferencias o cerrando sesión en su sitio.
Este patrón además coincide con el funcionamiento de las sugerencias a través del
<meta http-equiv="Accept-CH" …>
etiqueta. Las sugerencias solicitadas solo se enviarán en solicitudes iniciadas por la página y no en ninguna navegación posterior.
Ámbito de sugerencia y solicitudes de origen cruzado
De manera predeterminada, las sugerencias del cliente solo se enviarán en solicitudes del mismo origen. Eso significa que si pide sugerencias específicas sobre https://example.com
, pero los recursos que desea aprovechar al máximo están en https://downloads.example.com
ellos no lo haré
recibir sugerencias.
Para permitir sugerencias en solicitudes de origen cruzado, cada sugerencia y origen deben especificarse a través de un Feature-Policy
encabezamiento. Esto especifica cada sugerencia (con el prefijo ch-
) y la lista permitida de orígenes que deberían recibir la sugerencia. A modo de ejemplo:
⬇️ Respuesta de example.com
Accept-CH: UA-Platform, DPR
Feature-Policy: ch-UA-Platform downloads.example.com;
ch-DPR cdn.provider img.example.com
⬆️ Solicitud de downloads.example.com
Sec-CH-UA-Platform: "Android"
⬆️ Solicitudes para cdn.provider
o img.example.com
DPR: 2
¿Dónde usar las sugerencias de cliente de agente de usuario?
La solución rápida es que debe refactorizar cualquier instancia en la que esté analizando el encabezado User-Agent o haciendo uso de cualquiera de las llamadas de JavaScript que acceden a la misma información (dicho de otra forma, navigator.userAgent
, navigator.appVersion
o navigator.platform
) para hacer uso de las sugerencias de cliente de agente de usuario en su lugar.
Llevando esto un paso más adelante, debe volver a evaluar el uso que hace de la información del agente de usuario y reemplazarla por otros métodos siempre y cuando sea factible. Habitualmente, puede alcanzar el mismo objetivo haciendo uso de la mejora progresiva, la detección de funciones o el diseño receptivo. El problema básico de confiar en los datos de usuario-agente es que siempre mantiene un mapeo entre la propiedad que está inspeccionando y el comportamiento que habilita. Es una sobrecarga de mantenimiento para asegurar que su detección sea completa y esté actualizada.
Con estas advertencias en mente, el El repositorio User-Agent Client Hints enumera algunos casos de uso válidos para sitios.
¿Qué sucede con la cadena de usuario-agente?
El plan es minimizar la capacidad de rastreo encubierto en la web reduciendo la cantidad de información de identificación expuesta por la cadena de Usuario-Agente existente sin causar interrupciones indebidas en los sitios existentes. La introducción de sugerencias de cliente de agente de usuario ahora le brinda la posibilidad de entender y experimentar con la nueva capacidad, antes de que se realicen cambios en las cadenas de agente de usuario.
Por último, la información en la cadena Usuario-Agente se reducirá para que mantenga el formato heredado y, a la vez, solo proporcione el mismo navegador de alto nivel y la información de versión significativa según las sugerencias predeterminadas. En Chromium, este cambio se ha pospuesto hasta al menos 2021 para proporcionar tiempo adicional para que el ecosistema evalúe las nuevas capacidades de User Agent Client Hints.
Puede probar una versión de esto habilitando el
chrome://flags/#freeze-user-agent
flag de Chrome 84. Esto devolverá una cadena con las entradas históricas por razones de compatibilidad, pero con detalles específicos. A modo de ejemplo, algo como:
Mozilla/5.0 (Linux; Android 9; Unspecified Device) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/85.0.0.0 Mobile Safari/537.36
Foto por Sergey Zolkin
en
Unsplash