Entwicklung & Design

HTML5: Sandbox-Modus für IFrames

Inhalte anderer Websites in die eigene einzubinden, geht nicht einfacher als mit IFrames. Doch der Einsatz von IFrames birgt auch Risiken. Denn bislang ließen sich die Rechte der eingebundenen Seiten – zum Beispiel das Ausführen von Scripten – in einem IFrame nicht einschränken. Mit HTML5 gibt es nun die Möglichkeit, über IFrames eingebundene Websites in seinem Sandbox-Modus auszuführen.

HTML5-IFrames und die Risiken

Standardmäßig hat eine Website, die über einen IFrame eingebunden wird, dieselben Rechte wie jede andere Seite auch. Das heißt, es können Formulare versendet und JavaScript ausgeführt werden. Über das „target“-Attribut lassen Links auch jenseits des IFrames öffnen.

Je nachdem wie vertrauenswürdig die eingebundene Website ist, möchte man ihr vielleicht nicht alles erlauben. HTML5 bietet für IFrames einen Sandbox-Modus, über den sich die Rechte von IFrames-Inhalten einschränken lassen:

<iframe src="http://www.example.com/" sandbox></iframe>

Mit dem bloßen Setzen des Attributes „sandbox“ wird der IFrame im Sandbox-Modus aufgerufen. Das heißt, folgende Restriktionen beim Aufruf der eingebundenen Website werden gemacht:

  • kein Ausführen von Scripten und Plugins möglich
  • kein Versenden von Formularen möglich
  • keine Navigation außerhalb des IFrames möglich

Konkret heißt das, dass zum Beispiel JavaScript und Plugins wie Flash nicht ausgeführt werden. Formulardaten werden nicht übertragen und Links, die über das „target“-Attribut versuchen, aus dem Frame auszubrechen, werden immer innerhalb des IFrames aufgerufen.

Anpassung des Sandbox-Modus

Über das „sandbox“-Attribut lassen sich einzelne Rechte auch wieder freischalten. Wird über einen IFrame ein Formular eingebunden, ist es sinnvoll, dass das Formular auch übertragen werden kann:

<iframe src="http://www.example.com/" sandbox="allow-forms"></iframe>

Mit „allow forms“ wird das Versenden von Formularen explizit erlaubt, während alle anderen Einschränkungen erhalten bleiben. Auch das Ausführen von Scripten lässt sich explizit freischalten:

<iframe src="http://www.example.com/" sandbox="allow-scripts"></iframe>

Auch lässt sich die Einschränkung aufheben, die verhindert, dass die über den IFrame eingebundene Website Links jenseits des Frames öffnet:

<iframe src="http://www.example.com/" sandbox="allow-top-navigation"></iframe>

Zu guter Letzt gibt es noch die Möglichkeit, den Inhalt des IFrames so zu behandeln, als käme er von derselben Domain wie die einbindende Seite:

<iframe src="http://www.example.com/" sandbox="allow-same-origin"></iframe>

Das hat zur Folge, dass die eingebundene Seite im DOM der einbindenfen Seite berücksichtigt wird. Das heißt, die Same-Origin-Policy wird aufgehoben. Die Same-Origin-Policy sorgt normalerweise dafür, dass Seiten anderer Domains keinen Zugriff auf Objekte der einbindenden Seite haben und diese auch nicht manipulieren können.

Werden IFrames im Sandbox-Modus ausgeführt, die denselben Ursprung haben wie die einbindende Seite, so werden diese zunächst einmal so behandelt, als kämen sie von einer fremden Domain. Man muss die Sandbox also explizit auf „allow-same-origin“ setzen, um sie wie von derselben Domain stammend zu behandeln.

Vorsicht beim Kombinieren

Einzelne Rechte lassen sich miteinander kombinieren. Allerdings birgt eine bestimmte Kombination ein Sicherheitsrisiko:

<iframe src="http://www.example.com/" sandbox="allow-same-origin allow-scripts"></iframe>

Werden die Rechte „allow-same-origin“ und „allow-scripts“ zusammen gesetzt, gibt es der eingebundenen Seite die Möglichkeit, den Sandbox-Modus gänzlich auszuschalten. Denn über „allow-same-origin“ hat die eingebundene Seite Zugriff auf den DOM und über „allow-scripts“ lassen sich Scripte ausführen. So lässt sich per JavaScript auf das DOM der einbindenen Seite zugreifen.

Derzeit unterstützen nur Chrome und Safari den Sandbox-Modus, andere Browser noch nicht.

Was haltet ihr vom Konzept der Sandbox für IFrames? Welche Anwendungsfälle dafür könnt ihr euch vorstellen?

Weitere Artikel auf t3n.de zum Thema HTML5:

Bitte beachte unsere Community-Richtlinien

Wir freuen uns über kontroverse Diskussionen, die gerne auch mal hitzig geführt werden dürfen. Beleidigende, grob anstößige, rassistische und strafrechtlich relevante Äußerungen und Beiträge tolerieren wir nicht. Bitte achte darauf, dass du keine Texte veröffentlichst, für die du keine ausdrückliche Erlaubnis des Urhebers hast. Ebenfalls nicht erlaubt ist der Missbrauch der Webangebote unter t3n.de als Werbeplattform. Die Nennung von Produktnamen, Herstellern, Dienstleistern und Websites ist nur dann zulässig, wenn damit nicht vorrangig der Zweck der Werbung verfolgt wird. Wir behalten uns vor, Beiträge, die diese Regeln verletzen, zu löschen und Accounts zeitweilig oder auf Dauer zu sperren.

Trotz all dieser notwendigen Regeln: Diskutiere kontrovers, sage anderen deine Meinung, trage mit weiterführenden Informationen zum Wissensaustausch bei, aber bleibe dabei fair und respektiere die Meinung anderer. Wir wünschen Dir viel Spaß mit den Webangeboten von t3n und freuen uns auf spannende Beiträge.

Dein t3n-Team

10 Kommentare
Serkan
Serkan

Hallo Denis,

es sollte doch „Mit HTML5 gibt es nun die Möglichkeit“ statt „Mit HTML ….“ sein !

Antworten
Denis Potschien

@Serkan: Ja, das stimmt und ist korrigiert. Danke für den Hinweis!

Antworten
Timeeeee
Timeeeee

Prinzipiell nett, aber nur „sandbox“ beschneidet zu viele Freiheiten für die eingebundene Seite. Die Meisten wollen bestimmt etwas mehr Freiheiten für das IFrame haben (allow-scripts allow-plugins per default an). Und für Wissenderen gibt es dann speziell „sandbox=“strict““ oder so ähnlich. HTML ist ja eigentlich als einfach zu erlernende Markup-Sprache gedacht. Deshalb sollte es einfach gehalten werden und komplizierter für uns „Wissenderen“ (wodurch wir anderen damn doch zeigen können, dass wir richtig HTML können, und wir weiterhin gebraucht werden (weil wer HTML kann, hat oft nur das Einfache gelernt).

Antworten
Michelle Skodowski
Michelle Skodowski

Hallo,

ich weiß, dass der Artikel schon sehr alt ist, dennoch habe ich eine brennende Frage zum Thema links im iframe mit sandbox attribut. Und zwar möchte ich die Links außerhalb des iframes öffnen, d.h Laden einer neuen Seite bzw. neuer Tab. Ich habe das target attribut ausprobiert und es über allow-top-navigation versucht. BEIDES FUNKTIONIERT NICHT.
Gerne würde ich erfahren, warum das nicht funktioniert und was man denn jetzt genau tun könnte, um die Links außerhalb des iframes zuzulassen.

Liebe Grüße,
Michelle

Antworten

Melde dich mit deinem t3n Account an oder fülle die unteren Felder aus.

Bitte schalte deinen Adblocker für t3n.de aus!

Hey du! Schön, dass du hier bist. 😊

Bitte schalte deinen Adblocker für t3n.de aus, um diesen Artikel zu lesen.

Wir sind ein unabhängiger Publisher mit einem Team bestehend aus 65 fantastischen Menschen, aber ohne riesigen Konzern im Rücken. Banner und ähnliche Werbemittel sind für unsere Finanzierung sehr wichtig.

Danke für deine Unterstützung.

Digitales High Five,
Stephan Dörner (Chefredakteur t3n.de) & das gesamte t3n-Team

Anleitung zur Deaktivierung