WebGL (Web Graphics Library) es una potente tecnología de renderizado de gráficos 3D en navegadores que aprovecha la potencia de la unidad de procesamiento gráfico (GPU). A diferencia de Canvas, WebGL no sólo permite trabajar con gráficos 2D, sino que abre nuevos horizontes de renderizado 3D y cálculo en la GPU para los desarrolladores web. Debido a su capacidad para generar resultados únicos, WebGL ha encontrado su aplicación en los sistemas antifraude, donde sus capacidades ayudan a rastrear e identificar los dispositivos de los usuarios a través de huellas digitales únicas. #### Historia de la creación y propósito de WebGL WebGL se desarrolló como una extensión de Canvas y fue presentado por primera vez por la organización Khronos Group en 2011. Como estándar abierto para el renderizado de gráficos en páginas web, WebGL ha permitido eliminar plugins de terceros como Flash o Java, mejorando enormemente el rendimiento y la seguridad de las aplicaciones web. WebGL ha ampliado las capacidades de HTML5 y JavaScript añadiendo soporte para el renderizado 3D y una mejor interacción con la GPU. Esto lo hace útil no sólo para juegos, visualización e investigación científica, sino también para sistemas antifraude, donde WebGL puede ayudar a identificar de forma única los dispositivos de los usuarios a través de una «huella dactilar gráfica». #### Capacidades tecnológicas de WebGL WebGL ofrece a los desarrolladores una serie de herramientas únicas para crear gráficos complejos: - Trabajo con gráficos 3D. WebGL permite dibujar modelos y texturas 3D complejos utilizando la aceleración por hardware. Esto permite construir objetos visuales realistas que ofrecen un alto rendimiento. - Acceso a shaders. WebGL utiliza shaders (programas ejecutados por la GPU) que permiten el renderizado detallado de objetos, creando efectos de textura complejos y gráficos de mayor calidad. - Animación e interactividad. Las funciones de WebGL permiten crear aplicaciones web dinámicas, visualizar datos científicos y crear modelos complejos como mundos virtuales y simulaciones interactivas. Estas características convierten a WebGL en una herramienta útil en diversos ámbitos, y en una ayuda útil en los sistemas antifraude para proporcionar unicidad y protección contra el fraude. #### WebGL en los sistemas antifraude: protección contra los defraudadores Los sistemas antifraude modernos utilizan la huella gráfica de WebGL para identificar dispositivos. A diferencia de Canvas, la huella digital de WebGL no se basa únicamente en el renderizado de píxeles, sino que también depende de la GPU y de las funciones compatibles con el navegador. Esto ayuda a los sistemas antifraude a crear huellas dactilares únicas para cada dispositivo e identificar actividades sospechosas. ##### ¿Cómo ayuda WebGL a identificar al usuario? Al renderizar objetos en WebGL, los distintos dispositivos pueden producir ligeras diferencias en la imagen debido a las características de hardware de las GPU, los shaders y los controladores. Entre los factores que afectan a los resultados del renderizado se incluyen: - GPU: los distintos modelos de GPU procesan los objetos 3D y las texturas de forma diferente. - Sombreadores y extensiones compatibles: el conjunto de sombreadores compatibles, así como sus especificaciones y precisión, varían en función del dispositivo. ##### Ajustes del navegador y funciones de renderizado. Los sistemas antifraude utilizan estas características para crear una huella digital única mediante la detección de diferencias a nivel gráfico y de características, como el tamaño de las texturas y los valores máximos de las variables uniformes. Estos parámetros se combinan para crear una huella gráfica que, combinada con otros datos, ayuda a identificar al usuario. ##### Métodos para falsificar huellas dactilares **WebGL** Los estafadores utilizan diversos métodos para falsificar las huellas digitales gráficas de WebGL y eludir los sistemas antifraude. Entre ellos se encuentran: - Imitación de shaders y texturas. Los atacantes pueden modificar shaders y texturas con ruido añadido, lo que ayuda a modificar la huella digital de WebGL. - Implementación de huellas dactilares pregrabadas. Algunos programas son capaces de falsificar huellas digitales, produciendo resultados pregrabados de otros dispositivos, lo que dificulta su detección. ##### ¿Qué información puede recuperar un recurso web de un navegador que utilice WebGL? La lista completa de propiedades y valores de WebGL para el navegador puede verse en la página de prueba https://test-webapi.tech/webglfull. Consideraremos en detalle los parámetros más importantes para los sistemas antifraude, pero antes comprobemos cómo funciona la superposición de ruido en WebGL. Hemos contado en detalle cómo se forman los valores al tomar una impresión en el artículo, ahora hagamos una pequeña prueba, veamos la impresión WebGL del navegador Chrome y del antidetect-browser sin ruido y con ruido, abramos la página https://browserleaks.com/webgl en cada uno de ellos. Navegador Chrome: Anotemos estos valores: WebGL Report Hash: af7f2acd5c7ab718eb78ab2d368860bd Hash de imagen WebGL: 3151260603d8157a55323d306cc161fb49 Proveedor desenmascarado: Google Inc. (NVIDIA) Renderizador desenmascarado: ANGLE (NVIDIA, NVIDIA GeForce RTX 3060 (0x00002503) Direct3D11 vs_5_0 ps_5_0, D3D11) Navegador antidetección de ruido: Navegador antidetección con ruido: WebGL Informe Hash: af7f2acd5c7ab718eb78ab2d368860bd Hash de imagen WebGL: 3151260603d8157a55323d306cc161fb49 Proveedor desenmascarado: Google Inc. (NVIDIA) Renderizador desenmascarado: ANGLE (NVIDIA, NVIDIA GeForce RTX 3060 (0x00002503) Direct3D11 vs_5_0 ps_5_0, D3D11) Informe WebGL Hash: 251d629a393c4f10bfffe3b506696fdd Hash de imagen WebGL: 61b18870e8f14f00f0058bc5533468c685c Proveedor desenmascarado: Google Inc. (NVIDIA) Renderizador desenmascarado: ANGLE (NVIDIA, NVIDIA GeForce GTX 1050 Ti (0x00001C8C) Direct3D11 vs_5_0 ps_5_0, D3D11) A partir de los resultados de la prueba, podemos ver que los valores han cambiado cuando se superpone el ruido, y podemos concluir que el navegador antidetección está suplantando con éxito nuestra huella digital WebGL. ##### ¿Cómo detectan los sistemas antifraude la suplantación de huellas WebGL? Los sistemas antifraude utilizan métodos para reconocer la suplantación de la huella WebGL: - Comprobación de desviaciones. El sistema analiza y compara la huella WebGL con parámetros del dispositivo como el número máximo de variables uniformes y las extensiones admitidas. Si los valores no coinciden con las especificaciones reales del dispositivo, puede indicar una falsificación. - Distorsión del renderizado. Los sistemas antifraude pueden obtener imágenes y comprobar cómo los dispositivos renderizan determinados objetos. Por ejemplo, si la renderización de WebGL en un dispositivo no coincide con los parámetros estándar, podría ser señal de manipulación. - Pruebas de estabilidad de parámetros. Puede haber pruebas que comprueben la estabilidad de shaders y texturas en el sistema, ya que cambiarlos puede revelar una GPU manipulada. Los parámetros más importantes para los sistemas antifraude en WebGL son: información del dispositivo (unmaskedVendor, unmaskedRenderer, vendor, renderer, shadingLanguage, version, shadingLanguage2, version2), especificaciones técnicas (maxFragmentUniformVectors, maxTextureSize) y extensiones. Los navegadores antidetección falsifican con éxito la información del dispositivo, veamos cómo los sistemas antifraude pueden comprobar los parámetros técnicos: comprobemos los valores reales de maxFragmentUniformVectors abriendo nuestra página de prueba https://test-webapi.tech/webglmaxfr en el navegador, que comprueba maxFragmentUniformVectors bajo carga. Navegador Chrome en el ordenador: El valor real es el indicado en las propiedades del navegador. Dado que los dispositivos de sobremesa suelen tener un valor de maxFragmentUniformVectors de 1024, vamos a abrir la misma página en un teléfono móvil Android en el navegador Chrome: En el navegador del móvil, los datos obtenidos de las propiedades del navegador son como true. Ahora probemos en el navegador antidetección a sustituir los valores por los del teléfono y repitamos la prueba. Abramos nuestra página de prueba: El navegador antidetect con la sustitución del valor maxFragmentUniformVectors falló la prueba, y es lógico porque lo ejecutamos en nuestro ordenador con el valor maxFragmentUniformVectors:1024 Realicemos una prueba similar para maxTextureSize abriendo nuestra página de prueba https://test-webapi.tech/webglmaxt en un navegador, que comprueba el tamaño máximo de textura bajo carga en el contexto de Webgl. Navegador Chrome en un ordenador: El valor real es el indicado en las propiedades del navegador. Dado que los dispositivos de sobremesa suelen tener maxTextureSize establecido en 16384, abramos la misma página en un teléfono móvil Android en el navegador Chrome: En el navegador del móvil, los datos obtenidos de las propiedades del navegador también son los mismos que en la realidad. Ahora probemos en el navegador antidetección a sustituir los valores por los del teléfono y repitamos la prueba Comprobemos el valor en el sitio browserleaks.com Abramos nuestra página de prueba Anti-detect-browser con la sustitución del valor maxTextureSize falló la prueba, nuestra prueba encontró que el tamaño de la textura 4097 es soportado por nuestro navegador, y es lógico, porque lo ejecutamos en nuestro ordenador con el valor maxTextureSize:16384. ##### **Extensiones** **WebGL** Veamos cómo los sistemas antifraude pueden utilizar la información sobre las extensiones WebGL para identificar a los usuarios. La lista de extensiones difiere según el tipo de dispositivo y el fabricante. Para identificar a los usuarios, los sistemas antifraude pueden utilizar los sistemas antifraude para comprobar si cada una de las extensiones conocidas es compatible con el navegador del usuario. Veamos un ejemplo sencillo de cómo podría ser esto: En el ejemplo, para simplificar, hay dos números frente a cada extensión WebGL, el primer valor indica si la extensión está declarada o no en las propiedades del navegador, el segundo número indica si la extensión es compatible o no después de la verificación mediante pruebas. Este gran número de valores puede resultar en un hash bastante único para cada usuario. #### **Pruebas de rendimiento** **WebGL** En la página de pruebas, vamos a crear un programa que probará el rendimiento del dispositivo y calculará el tiempo en el que se ejecutará nuestro programa. Resultados para dispositivos de sobremesa: NVIDIA GeForce RTX 3060: 2023,6ms AMD Radeon RX580: 1132,0ms AMD Radeon™: 1611,2 ms Intel UHD 620: 2576,1 ms Vulkan 1.3.0: 1364,2 ms Resultados para dispositivos móviles: Mali-G77: 3369,3 ms Mali-G76: 5111,1 ms Adreno™ 642L: 4534,0 ms Adreno™ 642: 5763,3 ms Adreno™ 618: 9821,0 ms Según los resultados de las pruebas se nota que los dispositivos móviles tardan mucho más en hacer frente a la tarea de renderizado WebGL, pero solo se puede obtener una diferencia significativa en el tiempo de ejecución en las pruebas con tareas complejas, que difícilmente se pueden aplicar en sistemas antifraude, en las pruebas con tareas sencillas es bastante problemático sacar conclusiones sobre el rendimiento de los dispositivos estimando el tiempo empleado en las tareas de renderizado de gráficos WebGL. ##### **WebGL** **Amazon** **y** **Facebook** como ejemplo Tomemos el ejemplo de dos sitios y veamos qué datos obtienen sobre el usuario utilizando la tecnología WebGL. Abramos la página de inicio de Amazon, y usando las herramientas de desarrollador, busquemos en los archivos java script funciones que contengan «renderer», «canvas», «webgl», «vendor», e investiguemos qué datos obtiene el sitio de estas funciones. Como resultado, veremos que el sitio de la página principal de Amazon recoge información sobre las propiedades Vendor, Renderer y Extensions. Repitamos la prueba en el sitio de Facebook. El sitio de Facebook en la página de inicio de sesión de la cuenta recoge información de Vendor, Renderer del navegador del usuario. Podemos concluir que al crear nuevas cuentas en estos sitios, es deseable que las propiedades WebGL que se comprueban difieran entre cuentas, y que al reutilizar/conectarse, las propiedades no cambien dentro del mismo perfil. ##### **Frames Por Segundo (FPS)** Este parámetro mide la frecuencia con la que se actualiza la imagen. WebGL, permite a los desarrolladores obtener datos de FPS directamente en el navegador, lo que se utiliza a menudo en sistemas antifraude. Para el usuario medio, en la gran mayoría de los casos, el valor de FPS es de 60 o más, mientras que los programas suelen reducir este valor a 30, con el fin de reducir la carga del hardware durante el funcionamiento. Esta variación a la baja de los FPS para los sistemas antifraude es un indicador importante del uso de la automatización de los navegadores. #### Conclusión Muchos sistemas antifraude en recursos populares utilizan la tecnología WebGL y no sólo identifican los dispositivos de los usuarios mediante huellas gráficas únicas, sino que también proporcionan herramientas para la detección y prevención del fraude. El uso de la suplantación de identidad, el análisis de la estabilidad de los parámetros y la comparación con las características reales de los dispositivos mejoran significativamente la eficacia de los sistemas antifraude. La sustitución de valores y el uso de ruido por parte de los navegadores antidetección en WebGL no es una forma mágica de eludir la protección de los sitios populares. En la conclusión del artículo, presentamos un posible método para detectar el ruido de WebGL: La modificación de los resultados de renderizado en WebGL mediante la superposición de ruido se basa en la sustitución de los valores de color de los píxeles, concretamente el color de los píxeles semitransparentes. El enfoque presentado está en fase de pruebas y no cubre todas las posibles opciones de sustitución. Procedamos a las pruebas: Abramos la página https://test-webapi.tech/webgltamper en un navegador Chrome normal: Repitámoslo en un navegador antidetección sin utilizar ruido: Ahora hagamos la prueba en un navegador antidetección con superposición de ruido WebGL: Veamos cómo se calcula la superposición de ruido en este enfoque. Primero obtenemos el hex del buffer webgl, y decodificamos el hex en orden inverso de codificación, como resultado obtenemos un valor de color para cada pixel de la imagen, la secuencia de estas acciones es exactamente la misma que en los sistemas antifraude. En el siguiente paso comparamos el color del píxel de la parte principal de la figura dibujada con WebGL (rojo) y el color del píxel semitransparente que está en el borde del fondo blanco y el triángulo, en nuestro caso comparamos los valores del tono rojo R y la transparencia A, como resultado obtenemos la diferencia de valores en porcentaje. En dispositivos normales, la diferencia entre el tono rojo y la transparencia de dos píxeles de este tipo debería ser la misma (en teoría, el color de nuestro píxel debería cambiar en el mismo valor en el que cambia su valor de transparencia), pero al imponer ruido intercambiando los colores de los píxeles semitransparentes, la diferencia de tono rojo y transparencia entre los dos píxeles cambia. En las capturas de pantalla de la prueba vemos que la diferencia entre los tonos rojos sin superposición de ruido tiene un valor de R: 50,20% y la diferencia en la transparencia de los mismos píxeles A: 50,20%, cuando se superpone ruido en el navegador antidetección obtenemos los siguientes valores R: 48,63% y A: 50,59%. En este artículo hemos analizado cómo los sistemas antifraude pueden utilizar la tecnología WebGL para identificar a los usuarios, detectar a los usuarios que utilizan la suplantación de huellas dactilares. La tecnología WebGL permite recopilar una gran cantidad de información para la identificación de usuarios, por este motivo se utiliza a menudo en los sistemas antifraude. Al mismo tiempo, cambiar la información sobre una tarjeta de vídeo (unmaskedVendor, unmaskedRenderer, vendor, renderer, shadingLanguage, version, shadingLanguage2, version2) dentro de la misma línea del fabricante de la tarjeta de vídeo permite cambiar la huella digital y no despertar sospechas de los sistemas antifraude. En el próximo artículo continuaremos el análisis de las tecnologías de navegación utilizadas en los sistemas antifraude. _Bannykh M.V._
