Huellas dactilares basadas en CSS Trucos CSS - Trucos CSS - Aprender Marketing
CSS

Huellas dactilares basadas en CSS Trucos CSS – Trucos CSS

Las huellas dactilares son malas. Este es un término que se refiere a la creación de suficientes metadatos para un usuario, de modo que básicamente pueda comprender quiénes son. JavaScript tiene acceso a una variedad de opciones de huellas dactilares, que en combinación con las direcciones IP a las que puede acceder el servidor, significa que las huellas dactilares son muy comunes.

Sin embargo, normalmente no piensas en CSS como un vector de huellas dactilares, por lo que es «seguro» de esa manera. Pero Oliver Broch idea de grabación Esto permite en cierta medida Huella digital usando solo CSS.

piensa en todo @media Tenemos preguntas Podemos probar tipos de punteros any-pointerImagina que cada valor requiere uno completamente único background-image desde el servidor Si se solicita la imagen, los conocemos. @media La pregunta es real. Podemos empezar a tomar huellas dactilares de la siguiente manera:

.pointer {
  background-image: url('/unique-id/pointer=none')
}

@media (any-pointer: coarse) {
  .pointer {
    background-image: url('/unique-id/pointer=coarse')
  }
}

@media (any-pointer: fine) {
  .pointer {
    background-image: url('/unique-id/pointer=fine')
  }
}

Combinado con el hecho de que podemos probar las preferencias para el modo oscuro prefers-color-scheme, la huella digital se vuelve más clara. De hecho, la mayor preocupación de Oliver es el borrador actual de consultas de medios que prefieren los usuarios de CSS:

El próximo borrador no solo hará que este método sea escalable, sino que también mejorará su precisión. Actualmente es difícil vincular finalmente cada solicitud a un visitante específico a menos que sea de otro modo, ya que la única forma posible de determinar su origen es agrupar las solicitudes por la dirección IP de la conexión. Sin embargo, con el nuevo borrador, al generar una cadena aleatoria e insertarla en la etiqueta de URL de cada visitante, podemos identificar con precisión todas las solicitudes de ese visitante.

Hay muchas más. Podemos hacer consultas de medios. 1px Separa y solicita una imagen de fondo para cada uno, adivinando perfectamente el tamaño de la ventana del visitante. Puede haber una docena o más de consultas de medios exóticos que rara vez se usan, pero específicamente para las huellas dactilares de CSS. @supports Pregunta diferentes cosas para saber lo esencial del navegador correcto. y combinar Usando la técnica clásica de probar instalaciones de fuentes locales específicas, tiene una máquina de huellas dactilares decente.

@font-face {
  font-family: 'some-font';
  src: local(some font), url('/unique-id/some-font');
}

.some-font {
  font-family:'some-font';
}

El CSS generado es enorme (esto es grosero generarlo), pero obviamente dado que podemos usar atributos personalizados en la URL, es mucho menos.

No estoy muy preocupado por esto, principalmente porque no he deshabilitado JavaScript, y JavaScript ahora tiene más opciones de huellas dactilares. Hay otros tipos de agujeros de seguridad en CSS, incluidos enlaces para acceso de lectura (que los navegadores han abordado), grabación de teclado y estilos integrados generados por el usuario, entre otros que la gente ha señalado en otra publicación sobre el tema.

Pero la investigación de huellas dactilares de Oliver es excelente, y vale la pena revisarla por cualquiera que sepa más sobre seguridad cibernética que yo.

Deja una respuesta

Tu dirección de correo electrónico no será publicada.

Botón volver arriba