X-Frame-Options: HTTP-Security-Header zum Schutz vor Clickjacking
Durch Verwendung des HTTP-Security-Headers X-Frame-Options können sogenannte Clickjacking-Angriffe unterbunden werden. Hierfür wird dem Webbrowser mitgeteilt, inwieweit die aufgerufene Webseite in eine andere Webseite - z.B. via Frames - eingebettet werden darf.
Details zum Einsatz von X-Frame-Options erfahrt ihr in diesem Beitrag.
Teil 5 der Beitragsserie: HTTP-Security-Header - Website-Sicherheit erhöhen
X-Frame-Options - Beschreibung & Funktionsweise
Im Normalfall kann eine Webseite ohne Weiteres in eine andere Webseite eingebettet werden. Dies kann über folgende HTML-Elemente erfolgen:
frameiframeobjectembed
Um dem Webbrowser mitzuteilen, wie dieser sich verhalten soll, wenn die eigene Webseite in eine andere Webseite eingebunden werden soll, wird in der HTTP-Antwort der entsprechende HTTP-Header mitgesendet:
HTTP/2 200 OK
date: Sun, 15 Mar 2020 14:30:45 GMT
content-type: text/html; charset=UTF-8
content-length: 2802
x-frame-options: deny Im o.a. Beispiel wird die Einstellung deny gewählt. Hiermit wird der Webbrowser dazu angehalten, die Einbettung der Webseite zu verbieten.
Beispiel - X-Frame-Options in Aktion
Zum Verdeutlichen der Funktionsweise soll ein einfaches Beispiel dienen. Angenommen eine Webseite von Domain A möchte eine Webseite von Domain B einbinden. Der vereinfachte Quellcode für die Webseite von Domain B würde wie folgt aussehen:
<body>
<p>Webseite Domain B</p>
</body>Der Quellcode für die Webseite von Domain A sehe hingegen so aus:
<body>
<p>Webseite Domain A</p>
<iframe src="https://domain-b/webseite.html" />
</body>Ohne weitere Vorkehrungen würde beim Aufruf der Webseite von Domain A die Webseite von Domain B im iframe vom Webbrowser angezeigt werden:
Um nun zu Verhindern, dass der Webbrowser das Einbetten bzw. Einbinden der Webseite von Domain B erlaubt, kann der X-Frame-Options-Header z.B. mit dem Wert deny verwendet werden. Als Ergebnis würde der Webbrowser dieses Mal einen entsprechenden Fehlerhinweis anzeigen:
Header-Einstellungen im Detail
Der X-Frame-Options-Header unterstützt folgende drei Einstellungswerte:
deny
Diese Angabe führt dazu, dass die Webseite generell nicht eingebettet werden kann.
sameorigin
In diesem Fall kann die Webseite nur von anderen Webseiten der gleichen Quelle eingebettet werden.
allow-from uri
Die Einbindung der Webseite ist nur von Webseiten aus der angegebenen Quelle gestattet.
X-Frame-Options vs CSP frame-anchestors
Die Funktionalität der Policy-Direktive frame-anchestors der Content-Security-Policy (CSP) überschneidet sich mit dem X-Frame-Options-Header. Laut der W3C-Spezifikation hat die CSP frame-anchestors-Angabe Vorrang und macht die Angabe des X-Frame-Headers eigentlich obsolet. Letztendlich schadet es aber auch nicht den Header trotz CSP mitzusenden.
Webbrowser-Unterstützung
X-Frame-Options wird von allen gängigen Webbrowsern unterstützt (siehe caniuse.com). Allerdings wird der Einstellungswert allow-from anscheinend von den meisten Webbrowsern nicht unterstützt.
X-Frame-Options-Header übertragen
Damit der Webserver den X-Frame-Options-Header zum Client mitsendet, muss die Konfiguration des Webservers angepasst werden.
Apache:
In der Konfigurationsdatei von Apache oder in der .htaccess ist folgende Anweisung zu hinterlegen:
Header always set X-Frame-Options "deny" nginx:
Analog dazu ist für nginx in der Konfigurationsdatei Folgendes einzufügen:
add_header X-Frame-Options "deny";X-Frame-Options-Einstellung von codingblatt.de
Für meinen Blog verwende ich die Einstellung deny. Ein Einbinden ist also generell nicht erlaubt. Wie oben bereits beschrieben, könnte ich den X-Frame-Options-Header theoretisch aber auch weglassen, da ich auch die Content-Security-Policy und die dazugehörige frame-anchestors-Direktive gesetzt habe.
Fazit
Um eure Website oder Webanwendung vor Clickjacking zu schützen, solltet ihr als weiteren Sicherheitsbaustein den X-Frame-Options-Header verwenden.