什么是 CSS 注入

大家对 XSS 攻击都非常熟悉了，可能很少关注到 CSS 注入攻击，以下行为有可能受到 CSS 注入攻击：

• 从用户提供的 URL 中引入 CSS 文件
• CSS 代码中采用了用户的输入数据

可以看下以下两个例子
https://www.owasp.org/index.p…
http://www.thespanner.co.uk/2…

原理

CSS 属性选择器让开发者可以根据属性标签的值匹配子字符串来选择元素。这些属性值选择器可以做以下操作：
1. 如果字符串以子字符串开头，则匹配；
2. 如果字符串以子字符串结尾，则匹配；
3. 如果字符串在任何地方包含子字符串，则匹配；
4. 属性选择器能让开发人员查询单个属性的页面 HTML 标记，并且匹配它们的值。

而在实际环境中，如果一些敏感信息会被存放在 HTML 标签内，如 CSRF token 存储在隐藏表单的属性值中，这使得我们可以将 CSS 选择器与表单中的属性进行匹配，并根据表单是否与起始字符串匹配，加载一个外部资源，例如背景图片，来尝试猜测属性的起始字母。通过这种方式，攻击者可以进行逐字猜解并最终获取到完整的敏感数值。

防御策略

想要解决这个问题受害者可以在其服务器实施内容安全策略（CSP），防止攻击者从外部加载 CSS 代码。

总结

作为前端开发者，我们与用户最近，也是网络安全防护的第一道线，要时刻关注来自各方面的网络攻击，保障用户信息的安全。

参考文献

https://portswigger.net/kb/is…
https://www.freebuf.com/artic…
https://24ways.org/2018/secur…