Mejora la privacidad del usuario y la experiencia del desarrollador con Client Hints de usuario-agente

User-Agent Client Hints es una nueva expansión de la API de Client Hints que permite que los desarrolladores accedan a la información del navegador de un usuario de una forma ergonómica y que preserva la privacidad.

Client Hints permite que los desarrolladores soliciten activamente información sobre las dispositivo o condiciones, en lugar de tener que analizarlo fuera del usuario-agente (UA) una cadena vacía. Proporcionar esta vía alternativa es el primer paso reducir el nivel de detalle de la cadena de usuario-agente.

Aprende a actualizar la funcionalidad existente que se basa en el análisis de la Es una cadena de usuario-agente para usar Client Hints de usuario-agente en su lugar.

Información general

Cuando los navegadores web realizan solicitudes, incluyen información sobre el navegador y su entorno para que los servidores puedan habilitar las estadísticas y personalizar la respuesta. Esto se definió en 1996 (RFC 1945 para HTTP/1.0), donde puedes busque la definición original del string usuario-agente, que incluye un ejemplo:

User-Agent: CERN-LineMode/2.15 libwww/2.17b3

El objetivo de este encabezado era especificar, en orden de importancia, el producto (p.ej., navegador o biblioteca) y un comentario (p.ej., la versión).

El estado de la cadena usuario-agente

A lo largo de las décadas correspondientes, esta cadena acumuló una variedad de detalles sobre el cliente que realiza la solicitud (así como no versión, debido a la compatibilidad). Podemos ver que cuando vemos el usuario-agente actual de Chrome cadena:

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 del usuario y versión, el modelo del dispositivo, la marca del navegador y la versión completa, suficientes pistas inferir que es un navegador para dispositivos móviles, y sin mencionar algunas referencias a otras 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 identificar de manera inequívoca a los usuarios.

La cadena usuario-agente habilita muchos casos de uso legítimos y cumple un propósito importante para los desarrolladores y propietarios de sitios. Sin embargo, es también es fundamental que las actualizaciones la privacidad está protegida contra métodos de seguimiento encubiertos, y enviar información de UA de forma predeterminada va en contra de ese objetivo.

También es necesario mejorar la compatibilidad web cuando se trata del usuario-agente una cadena vacía. No es estructurado, por lo que analizarlo da como resultado una complejidad innecesaria que suelen ser la causa de errores y problemas de compatibilidad de sitios que perjudican a los usuarios. Estos problemas también afectan de manera desproporcionada a los usuarios de navegadores menos comunes, ya que sitios no pudieron probar su configuración.

Presentación de los nuevos User-Agent Client Hints

User-Agent Client Hints permitir el acceso a la misma información, pero de una manera que preserve más la privacidad, en convertir en permitir que los navegadores reduzcan con el tiempo el valor predeterminado de la cadena de usuario-agente lo que transmite todo. Client Hints aplica una modelo en el que el servidor debe solicitar al navegador un conjunto de datos sobre el cliente (las sugerencias) y el navegador aplica sus propias políticas o configuración de usuario a determinar qué datos se devuelven. Esto significa que, en lugar de exponer todos la información de usuario-agente de forma predeterminada, el acceso ahora se administra de manera auditable. Los desarrolladores también se benefician de una API más simple, ya que no es más con expresiones regulares.

El conjunto actual de Client Hints describe principalmente la pantalla del navegador y y capacidades de conexión de red. Puedes explorar los detalles en Automatiza la selección de recursos con sugerencias de clientes. pero aquí hay un repaso rápido del proceso.

El servidor solicita Client Hints 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" />

El navegador entonces puede optar por enviar los siguientes encabezados de vuelta en subsiguientes solicitudes:

🕜️ Solicitud posterior

Viewport-Width: 460
Width: 230

El servidor puede optar por variar sus respuestas, por ejemplo, entregando imágenes en un resolución adecuada.

User-Agent Client Hints amplía el rango de propiedades con el Sec-CH-UA que se puede especificar mediante el encabezado de respuesta del servidor Accept-CH. Para todas las partes involucradas los detalles, comienza con la explicación y y, luego, analizar la propuesta completa.

Client Hints de Usuario-Agente de Chromium 89

Las Sugerencias de clientes de usuario-agente están habilitadas de forma predeterminada en Chrome desde la versión 89.

De forma predeterminada, el navegador muestra la marca del navegador, la versión importante / principal. y un indicador de si el cliente es un dispositivo móvil:

⬆️ Todas las solicitudes

Sec-CH-UA: "Chromium";v="93", "Google Chrome";v="93", " Not;A Brand";v="99"
Sec-CH-UA-Mobile: ?0
Sec-CH-UA-Platform: "macOS"

Encabezados de respuesta y solicitud del usuario-agente

⬇️ Respuesta Accept-CH
⬆️ Encabezado de la solicitud
⬆️ Solicitud
Valor de ejemplo
Descripción
Sec-CH-UA "Chromium";v="84",
"Google Chrome";v="84"
Lista de marcas de navegadores y sus versiones importantes
Sec-CH-UA-Mobile ?1 Es un valor booleano que indica si el navegador está en un dispositivo móvil (?1 para verdadero) o no (?0 para falso).
Sec-CH-UA-Full-Version "84.0.4143.2" [Obsoleto]La versión completa del navegador.
Sec-CH-UA-Full-Version-List "Chromium";v="84.0.4143.2",
"Google Chrome";v="84.0.4143.2"
Lista de marcas de navegadores y su versión completa.
Sec-CH-UA-Platform "Android" Es la plataforma del dispositivo, generalmente el sistema operativo (SO).
Sec-CH-UA-Platform-Version "10" Indica la versión de la plataforma o del SO.
Sec-CH-UA-Arch "arm" Arquitectura subyacente del dispositivo. Si bien esto puede no ser relevante para mostrar la página, es posible que el sitio quiera ofrecer una descarga con el formato correcto de forma predeterminada.
Sec-CH-UA-Model "Pixel 3" El modelo del dispositivo
Sec-CH-UA-Bitness "64" El valor de bits de la arquitectura subyacente (es decir, el tamaño en bits de un número entero o una dirección de memoria)

Ejemplo de intercambio

Un ejemplo de intercambio se vería de la siguiente manera:

⬆️ Solicitud inicial del navegador
El navegador solicita /downloads del sitio y envía su usuario-agente básico predeterminado.

GET /downloads HTTP/1.1
Host: example.site

Sec-CH-UA: "Chromium";v="93", "Google Chrome";v="93", " Not;A Brand";v="99"
Sec-CH-UA-Mobile: ?1
Sec-CH-UA-Platform: "Android"

⬇️ Respuesta del servidor
El servidor devuelve la página y, además, solicita la versión completa del navegador y la plataforma.

HTTP/1.1 200 OK
Accept-CH: Sec-CH-UA-Full-Version-List

⬆️ Solicitudes posteriores
El navegador le otorga al servidor acceso al información adicional y devuelve las sugerencias en todos los eventos solicitudes.

GET /downloads/app1 HTTP/1.1
Host: example.site

Sec-CH-UA: " Not A;Brand";v="99", "Chromium";v="98", "Google Chrome";v="98"
Sec-CH-UA-Mobile: ?1
Sec-CH-UA-Full-Version-List: " Not A;Brand";v="99.0.0.0", "Chromium";v="98.0.4738.0", "Google Chrome";v="98.0.4738.0"
Sec-CH-UA-Platform: "Android"

API de JavaScript

Además de los encabezados, también se puede acceder al usuario-agente en JavaScript mediante navigator.userAgentData Los valores predeterminados de Sec-CH-UA, Sec-CH-UA-Mobile y Se puede acceder a la información del encabezado Sec-CH-UA-Platform a través del brands y mobile, respectivamente:

// Log the brand data
console.log(navigator.userAgentData.brands);

// output
[
  {
    brand: 'Chromium',
    version: '93',
  },
  {
    brand: 'Google Chrome',
    version: '93',
  },
  {
    brand: ' Not;A Brand',
    version: '99',
  },
];

// Log the mobile indicator
console.log(navigator.userAgentData.mobile);

// output
false;

// Log the platform value
console.log(navigator.userAgentData.platform);

// output
"macOS";

Se puede acceder a los valores adicionales a través de la llamada a getHighEntropyValues(). El "entropía alta" es una referencia a la entropía de la información, en otras palabras: la cantidad de información que estos valores revelan sobre los datos del usuario navegador. Al igual que con la solicitud de encabezados adicionales, depende del navegador. qué valores se devuelven, si los hay.

// Log the full user-agent data
navigator
  .userAgentData.getHighEntropyValues(
    ["architecture", "model", "bitness", "platformVersion",
     "fullVersionList"])
  .then(ua => { console.log(ua) });

// output
{
   "architecture":"x86",
   "bitness":"64",
   "brands":[
      {
         "brand":" Not A;Brand",
         "version":"99"
      },
      {
         "brand":"Chromium",
         "version":"98"
      },
      {
         "brand":"Google Chrome",
         "version":"98"
      }
   ],
   "fullVersionList":[
      {
         "brand":" Not A;Brand",
         "version":"99.0.0.0"
      },
      {
         "brand":"Chromium",
         "version":"98.0.4738.0"
      },
      {
         "brand":"Google Chrome",
         "version":"98.0.4738.0"
      }
   ],
   "mobile":false,
   "model":"",
   "platformVersion":"12.0.1"
}

Demostración

Puedes probar los encabezados y la API de JavaScript en tu propio dispositivo en user-agent-client-hints.glitch.me.

Duración y restablecimiento de la pista

Las sugerencias especificadas a través del encabezado Accept-CH se enviarán durante el período de sesión del navegador o hasta que se especifique un conjunto diferente de sugerencias.

Esto significa que, si el servidor envía lo siguiente:

▢️ Respuesta

Accept-CH: Sec-CH-UA-Full-Version-List

Luego, el navegador enviará el encabezado Sec-CH-UA-Full-Version-List en todas las solicitudes. para ese sitio hasta que se cierre el navegador.

⬆️ Solicitudes posteriores

Sec-CH-UA-Full-Version-List: " Not A;Brand";v="99.0.0.0", "Chromium";v="98.0.4738.0", "Google Chrome";v="98.0.4738.0"

Sin embargo, si se recibe otro encabezado Accept-CH, entonces completamente reemplaza las sugerencias actuales que envía el navegador.

▢️ Respuesta

Accept-CH: Sec-CH-UA-Bitness

⬆️ Solicitudes posteriores

Sec-CH-UA-Platform: "64"

No se enviará el Sec-CH-UA-Full-Version-List solicitado anteriormente.

Lo mejor es pensar en el encabezado Accept-CH como que especifica el conjunto completo de las sugerencias deseadas para esa página, lo que significa que el navegador envía las sugerencias especificadas para todos los subrecursos de esa página. Si bien las sugerencias seguirán en la siguiente la navegación, el sitio no debe confiar en que se entregará.

También puedes usar esta opción para borrar de forma eficaz todas las sugerencias que envía el navegador. Para ello, envía un Accept-CH en blanco en la respuesta. Considera agregarla en cualquier lugar que el usuario restablezca las preferencias o salga de tu sitio.

Este patrón también coincide con el funcionamiento de las sugerencias a través del <meta http-equiv="Accept-CH" …>. Las sugerencias solicitadas solo se enviarán el de solicitudes iniciadas por la página y no en ninguna navegación posterior.

Sugerencias de permisos y solicitudes de origen cruzado

Según la configuración predeterminada, las Client Hints solo se enviarán en las solicitudes del mismo origen. Eso significa si solicitas sugerencias específicas sobre https://example.com, pero los recursos que optimizar están en https://downloads.example.com que no para recibir pistas.

Para permitir sugerencias en las solicitudes de origen cruzado, se debe especificar cada sugerencia y origen por un encabezado Permissions-Policy. Para aplicar esto a una sugerencia de cliente de usuario-agente, debes deberás escribir la sugerencia en minúscula y quitar el prefijo sec-. Por ejemplo:

⬇️ Respuesta de example.com

Accept-CH: Sec-CH-UA-Platform-Version, DPR
Permissions-Policy: ch-ua-platform-version=(self "downloads.example.com"),
                    ch-dpr=(self "cdn.provider" "img.example.com");

📊️ Solicitud para downloads.example.com

Sec-CH-UA-Platform-Version: "10"

⬆️ Solicitudes a cdn.provider o img.example.com

DPR: 2

¿Dónde usar User-Agent Client Hints?

La respuesta rápida es que debes refactorizar cualquier instancia en la que analices el encabezado de usuario-agente o usar cualquiera de las llamadas de JavaScript que acceder a la misma información (es decir, navigator.userAgent, navigator.appVersion, o navigator.platform) para usar Client Hints de Usuario-Agente en su lugar.

Si vamos un paso más allá, deberías volver a examinar tu uso del usuario-agente. y reemplazarla por otros métodos siempre que sea posible. A menudo, puedes lograr el mismo objetivo mediante el uso de la mejora progresiva, incluir de detección de intrusiones o diseño responsivo. El problema de base al confiar en los datos de usuario-agente es que siempre mantener una asignación entre la propiedad que inspeccionas y el comportamiento que permite. Es una sobrecarga de mantenimiento que garantiza que la detección integral y se mantiene actualizado.

Teniendo en cuenta estas advertencias, el repositorio de User-Agent Client Hints muestra algunos casos de uso válidos para los sitios.

¿Qué sucede con la cadena usuario-agente?

El plan es minimizar la posibilidad del seguimiento encubierto en la Web reduciendo La cantidad de información de identificación que expone la cadena de usuario-agente existente sin causar interrupciones indebidos en los sitios existentes. Presentación de User-Agent Client Hints ahora te da la oportunidad de comprender y experimentar con el nuevo antes de que se realicen cambios en las cadenas de usuario-agente.

Con el tiempo, se reducirá la información de la cadena de usuario-agente para que se mantenga en formato heredado y, al mismo tiempo, proporcionar solo el mismo navegador de alto nivel y una la información de la versión según las sugerencias predeterminadas. En Chromium, este cambio se aplicó se pospusieron al menos hasta 2022 para brindar tiempo adicional para que el ecosistema evaluarás las nuevas capacidades de User-Agent Client Hints.

Puedes probar una versión habilitando el about://flags/#reduce-user-agent de Chrome 93 (Nota: Esta marca se nombrada about://flags/#freeze-user-agent en las versiones de Chrome 84 a 92). Si confirmas esta acción, devolver una cadena con las entradas históricas por razones de compatibilidad, pero con información específica desinfectada. Por ejemplo, haz lo siguiente:

Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/93.0.0.0 Mobile Safari/537.36

Miniatura de Sergey Zolkin activado Eliminar salpicadura