HTTP CSP sandbox

Die sandbox Direktive der Content Security Policy isoliert Webinhalte in einer eingeschränkten Umgebung mit granularen Permission-Restriktionen.

Typ

CSP-Direktive zur Isolation von Webinhalten mit reduzierten Berechtigungen, verhindert potentiell schädliche Operationen bei der Darstellung von User-Generated Content in API-Applikationen.

Syntax

Ohne Flags aktiviert die Direktive maximale Restriktionen. Optionale Allow-Flags erlauben spezifische Operationen.

http
Content-Security-Policy: sandbox <allow-flags>

Direktiven

Die sandbox Direktive unterstützt granulare Allow-Flags zur selektiven Aktivierung von Berechtigungen in isolierten Kontexten.

allow-forms
Erlaubt das Absenden von Formularen. Ohne dieses Flag werden alle Form-Submissions blockiert.
allow-modals
Ermöglicht window.alert(), window.confirm(), und window.print() Aufrufe.
allow-orientation-lock
Erlaubt das Sperren der Bildschirmorientierung via Screen Orientation API.
allow-pointer-lock
Ermöglicht die Pointer Lock API für immersive Experiences.
allow-popups
Erlaubt window.open() und ähnliche Popup-Mechanismen.
allow-popups-to-escape-sandbox
Neue Fenster erben die Sandbox-Restriktionen nicht.
allow-presentation
Ermöglicht die Presentation API für externe Displays.
allow-same-origin
Behandelt den Content als same-origin. VORSICHT: Kombiniert mit allow-scripts unsicher!
allow-scripts
Erlaubt JavaScript-Ausführung. Ohne dieses Flag sind alle Scripts blockiert.
allow-top-navigation
Erlaubt Navigation des Top-Level Browsing Context.
allow-top-navigation-by-user-activation
Erlaubt Top-Navigation nur bei User-Interaktion (sicherer als allow-top-navigation).

Beispiele

Praktische Szenarien für sandbox in SaaS-Plattformen Widget-APIs und E-Mail-Services mit User-Generated Content.

API-Previewer für User-Generated HTML

SaaS-Plattformen zeigen User-Content sicher in Sandbox-Iframes:

http
HTTP/2 200 OK
Content-Type: text/html
Content-Security-Policy: sandbox allow-scripts

<!DOCTYPE html>
<html>
<body>
  <h1>Newsletter Preview</h1>
  <iframe src="/api/preview/newsletter/12345" sandbox="allow-scripts"></iframe>
</body>
</html>

User-HTML kann Scripts ausführen, aber keine Formulare absenden oder Popups öffnen. Same-Origin-Zugriff ist blockiert.

Microservice für Widget-Embedding

Widget-APIs liefern Sandbox-Policy für sichere Cross-Origin-Einbettung:

http
HTTP/2 200 OK
Content-Type: text/html
Content-Security-Policy: sandbox allow-scripts allow-same-origin allow-popups-to-escape-sandbox
Access-Control-Allow-Origin: *

<!DOCTYPE html>
<html>
<script>
  // Widget-Code mit begrenzten Permissions
  window.addEventListener('message', (event) => {
    if (event.data.action === 'openCheckout') {
      window.open(event.data.checkoutUrl, '_blank'); // Popup ohne Sandbox
    }
  });
</script>
</html>

Scripts können ausführen, Same-Origin-APIs nutzen, und Popups öffnen die nicht gesandboxt sind (für Payment-Flows).

E-Mail-Vorschau mit maximaler Isolation

E-Mail-Services rendern HTML-Mails in strikt isolierter Umgebung:

http
HTTP/2 200 OK
Content-Type: text/html
Content-Security-Policy: sandbox
X-Content-Type-Options: nosniff

<!DOCTYPE html>
<html>
<body>
  <!-- User-generierter E-Mail-Content -->
  <h2>Your Invoice</h2>
  <p>Click here: <a href="https://phishing.example.com">Download</a></p>
  <script>alert('XSS')</script> <!-- Blockiert -->
  <form action="https://attacker.com"> <!-- Blockiert -->
</body>
</html>

Keinerlei Flags gesetzt: Scripts, Forms, Popups, Navigation - alles blockiert. Nur statisches HTML-Rendering.

Sandbox-Isolation-Flow

Visualisierung der Permission-Enforcement in sandboxed Contexts mit Allow-Flag-Validierung und Operation-Blocking.

plantuml
@startuml
actor User
participant "Parent Page" as Parent
participant "API Gateway" as API
participant "Sandboxed Iframe" as Sandbox
participant "External Site" as External

User -> Parent: Load dashboard
Parent -> API: GET /api/user-widgets/widget-123
API -> Parent: HTML + CSP: sandbox allow-scripts allow-modals

Parent -> Sandbox: Create <iframe sandbox="allow-scripts allow-modals">
Sandbox -> Sandbox: Load widget content
note right: Sandbox-Restriktionen aktiv:\n- allow-scripts: ja\n- allow-forms: nein\n- allow-popups: nein\n- allow-same-origin: nein

User -> Sandbox: Click button
Sandbox -> Sandbox: Execute allowed script
Sandbox -> Sandbox: Show alert() (allow-modals)

alt Blocked: Form submission
    Sandbox -> Sandbox: Attempt form.submit()
    Sandbox -> Sandbox: Blocked by sandbox
    note right: CSP violation:\nForms nicht erlaubt
end

alt Blocked: Popup
    Sandbox -> Sandbox: window.open(url)
    Sandbox -> Sandbox: Blocked by sandbox
    note right: Popups nicht erlaubt
end

alt Blocked: Same-origin access
    Sandbox -> Parent: Attempt parent.document.cookie
    Parent -> Sandbox: SecurityError
    note right: Same-origin nicht erlaubt
end

Sandbox -> User: Render safe content only
@enduml

Vorteile für die Systemarchitektur

Sandbox-Isolation bietet Defense-in-Depth für User-Generated Content durch granulare Permission-Kontrolle in API-getriebenen Applikationen.

  • Defense-in-Depth für UGC: Schützt vor XSS Clickjacking und anderen Angriffen in User-Generated Content durch mehrschichtige Permission-Restriktionen
  • Granulare Permission-Kontrolle: Erlaubt präzise Konfiguration welche Operationen erlaubt sind von vollständiger Isolation bis zu kontrollierten Script-Executions
  • API-Widget-Security: Ideal für embeddable Widgets und Microservice-Frontends die in fremden Kontexten laufen müssen

Spezifikation

Die sandbox Direktive nutzt das HTML Sandbox-Modell:

Wichtig: sandbox in CSP gilt für das gesamte Dokument, nicht nur einzelne Elemente. Für granulare Kontrolle Iframe-basierte Isolation nutzen.

Weitere Spezifikationen

Content-Security-Policy Header, Permissions-Policy Header