Webinar HTML5 Security

Werbung
HTML5
Seifenblasen - aber Bulletproof
Ein Webinar von Mario Heiderich
antwerpes ag
Köln, 18-01-2011
Bitte wer und was?


Mario Heiderich

Forscher für Ruhr-Universität Bochum

Microsoft IE Security Team in Redmond
HTML5 - was ist das eigentlich?


Wo kommt es her – und wer hat's gemacht?
HTML5 und Security

Warum ist das überhaupt ein
Thema?

Vielleicht sogar aktuell das Thema für Webdevs?
Daher...
Ein kurzer Blick auf das Kommende
Heute wird’s was geben

HTML Geschichtsunterricht

Was ist anders an HTML5?

Neuartige Angriffe

Adäquate Verteidigung
Blick über den Tellerrand



HTML5 und SVG

CSS und Parser-Fehler
Fazit und Blick in die Zukunft
All die Jahre...
● 1990 – 1995 :: erste SGML basierte HTML Versionen von CERN/IETF
● 1995 :: W3C veröffentlicht HTML3.0
● 1997 :: HTML3.2 – viel Neues, Java, Frames, Bilder und mehr...
● 1998 :: HTML4 – nach wie vor im Gebrauch – so wie DOM Level 1
● 2000 :: DOM Level 2 Core
● 2003 :: DOM Level 2 HTML, XForms
● 2004 :: HTML5 – eine Idee and XHTML 2.0 vorbei, WHATWG wird gegründet
● 2006 - 2007 :: W3C hat sich's anders überlegt
● 2007 - jetzt :: WHATWG und W3C gemeinsam im HTML5 Boot
HTML5 Heute

HTML5 ist weder fertig...

Noch ansatzweise flächendeckend implementiert

Zwei mal HTML5?

Dennoch existent

Die User wollen's

Die Browser können's (ein bisschen)

Ein halbfertiger Standard der halbwegs unterstützt wird

Hier ein bisschen – dort ein bisschen

What could go wrong!?
Freude machen
Nicht wenig Dinge an HTML5 machen durchaus Sinn.
Und tun nicht weh!
Struktur
<header>, <section>,
<article>, <menu>
Optik
Runde Ecken - oh yes!
Neue Formularele-
Hübsche Validierung im
Browser
mente
Video, Audio, Inline SVG
Gezähmte IFrames
Mehr und mehr CSS
SVG und Canvas
Mehr Awesome

Animationen und Transformationen

WebGL und 3D Beschleunigung

Video und Audio Support – mal so mal so

Schriftarten in Hülle und Fülle

Geolocation

Weniger Flash und Silverlight – mehr „Offenheit“

Barrierefreiheit und Semantik
Aber...
wollten wir nicht eigentlich über unangenehme Dinge sprechen?
Ärger machen
HTML5 als Troublemaker. Aber so richtig.
Formulare
Weiteres
autofocus
History Spoofing
formaction
LocalStorage und
IndexedDB
Safari 5 form data
stealing
Regex DoS
XSS via SVGs
CSS Fehler
Beispielszenario
Frames – Quell des Glücks seit späten 90ern
Frames können überlagert werden
Formulare können autofocus nutzen
–
Frame 1 kann dank CSS Frame 2 überlappen
•
Frame 2 kann mit autofocus Fokus stehlen
–
Frame 1 wird beschrieben – Frame 2 empfängt den Input
–
–
„We should never have added autofocus to HTML5“
–
Srsly?
•
http://www.w3.org/Bugs/Public/show_bug.cgi?id=9602
Mehr Autofocs
<input onfocus=write(1) autofocus>
<input onblur=write(1) autofocus><input autofocus>
<body oninput=alert(1)><input autofocus>
<body
onscroll=alert(1)><br><br><br><br><br><br>...<br><br>
<br><br><input autofocus>
Und viele weitere...
Action!
<form id="test"> ... </form>
<div>Lorem ipsum dolor...</div>
<button form="test" formaction="javascript:alert(1)">X
Was könnte dieser Vektor anrichten?

Formulare von außen beeinflussen?

Submit auf javascript: URI umlenken

Phishing und Form Hijacking

Ohne jeden Event Handler?

HTML5 Rocks!
Gegenwehr
Framebuster, die funktionieren
X-FRAME Header setzen!
Keine Blacklists!
<video poster=javascript:alert(1)>
Keine IDs für <form> Elemente
Und Obacht for Backticks...
Backticks?
`` ← Backticks of Evil!

Warum genau?

Probleme im Internet Explorer 8

Später mehr dazu!
Bleiben noch
Mindestens 5 Angriffstechniken von 500
Formulare
Weiteres
autofocus
History Spoofing
formaction
LocalStorage und
IndexedDB
Safari 5 form data
stealing
Regex DoS
XSS via SVGs
CSS Fehler
Heia Safari!
Alles im Client
<input pattern=^((a+.)a)+$
value=aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa!>

Validierung im Browser

Regulärer Ausdruck im Attribut

Denial Of Service vorprogrammiert
history.pushState(null, null, '/unschuldig/')

Angriffe verstecken

Sichtbarer reflektiver XSS – das war einmal!

HTML5 Rocks!
Gegenwehr
Als User im Safari Form Autocompletion abstellen
Unsaubere reguläre Ausdrücke vermeiden!
Kein Vertrauen in das location Objekt
Auch und insbesondere im Internet Explorer
<form id=location href=foo>
<script>alert(location.href)</script>
Bleiben noch
Mindestens 5 Angriffstechniken von 500
Formulare
Weiteres
autofocus
History Spoofing
formaction
LocalStorage und
IndexedDB
Safari 5 form data
stealing
Regex DoS
XSS via SVGs
CSS Fehler
SQL Injection im Browser

HTML5 fordert diverse Client-seitige Datenbanken

sessionStorage, localStorage,
createDatabase(), IndexedDB

Einige nutzen SQLite als Grundlage

Tatsächliche SQL Queries im DOM

Vom XSS zur ClientSQLI

Browser als autarker Attack Server

History auslesen (CSS)

Mails verschicken (Java)

Keylogging (JavaScript)

Webcam und Mikro steuern (Flash)
Scalable Vector Madness
Schön, informativ und barrierefrei
Skalierbar und Interaktiv
Aber alles andere als ein Bild
SVG == Vollständige HTML Applikation

Neuerdings gibt’s Inline SVG

SVG via <img>

Uploads

Embeds und Schriftarten
– http://html5sec.org/?svg
Und schlimmer noch
http://heideri.ch/opera
Und es geht noch schlimmer... /opera/pdf - <img> ruft per Skype an
Rich Text is Rich

Moderne Seiten benötigen Rich Text

User wollen Farben und

Und warum auch nicht...

Rich Text Editoren (RTEs) helfen. Wie es scheint.

Aber RTEs sind böse. Richtig böse.

Sprechen wir über Superwaffen
Styles!
RTE Security
Validierung und Filterung im Client
Sicherheitslücken im Backend
Komplexe DOM Operationen
HTML Tidy oder schlimmer
Viel DOMXSS
<script>
if(link.match(/https?:/)) {
location.replace(link)
}
</script>
Stylebombs
<style>@import "data:,*%7bx:expression(write(1))%7D
";</style>
<div style="font-family:'foo
;color:red;';">XXX
<div
style="background:url(/f#oo/;color:red/*/foo.jp
g);">X
<x style="background:url('x;color:red;/*')">XXX</x>
Gegenwehr
Niemals im Browser validieren
Niemals dem RTE vertrauen
Keine hausgemachten Filter. Niemals. Garniemals.
HTMLPurifier rockt – so halbwegs...
HTML4 ist unfassbar komplex
Von HTML5 ganz zu schweigen
Obacht!
Browser 0-Days
Da hilft auch kein HTMLPurifier
Im Gegenteil!
<a style="background:url('/\'\,!@x:expression\(write\
(1\)\)//\)!\'');"></a>
All done
Zeit für ein Fazit?
Formulare
Weiteres
autofocus
History Spoofing
formaction
LocalStorage und
IndexedDB
Safari 5 form data
stealing
Regex DoS
XSS via SVGs
CSS Fehler
Call to Action

Wir brauchen einen HTML5 Purifier

Am besten auch gleich einen SVG Purifier

Wir brauchen bessere Dokumentation

Einheitlichere Specs und Implementierungen

Bessere Security Bulletins

Mehr tatsächlich relevante Info!

Make HTML5 Rock!
Document!
Links
● http://simon.html5.org/html5-elements Überblick über HTML Tags und Elemente
● http://www.w3.org/TR/html5/ Der HTML 5 W3C Spec Draft
● http://www.whatwg.org/specs/web-apps/current-work/multipage/ Der HTML5 WHATWG Spec Draft
● http://html5sec.org/ Der HTML5 Security Cheatsheet – alle erwähnten Angriffsbeispiele und mehr
● http://www.w3.org/TR/html5-diff/ W3C „Differences between HTML4 and HTML5“
● http://en.wikipedia.org/wiki/HTML5 Wikipedia über HTML5
● http://jeremiahgrossman.blogspot.com/2010/08/breaking-browsers-hacking-auto-complete.html
„Attacks against autocomplete and specific input field types“
● http://seclab.stanford.edu/websec/framebusting/
„Busting frame busting“ – Paper über Framebusting und Clickjacking
● http://code.google.com/p/html5security/w/list Artikel über HTML5 Security im Allgemeinen
● http://lists.w3.org/Archives/Public/public-web-security/ W3C HTML Security Mailing List
● HTML5 Testcases
http://slides.html5rocks.com/
http://samples.msdn.microsoft.com/ietestcenter/
Das war's
Vielen Dank für Ihre Aufmerksam...
MO-MENT!
Da war doch noch was!
Die Backticks des Grauens!
Hausaufgabe!
<div id="test">
<img src=x alt="``onerror=alert(1)">
</div>
<script>
alert(document.getElementById("test").innerHTML)
</script>

Bitte mal auf dem Internet Explorer testen

Danach... Happy Fixing :-)

Mehr dazu vielleicht im nächsten Webinar?
Over and Out
Vielen Dank für Ihre Aufmerksamkeit
Fragen willkommen!
Herunterladen