HTTP CSP child-src Directive

Die Content-Security-Policy child-src Direktive definiert erlaubte Quellen für Web Workers und nested browsing contexts (Frames, iframes). Sie kontrolliert die Erstellung von Worker-Threads und eingebetteten Dokumenten zur Verhinderung unerwünschter Code-Ausführung in untergeordneten Kontexten.

Typ

CSP Fetch-Direktive

Syntax

Die Direktive akzeptiert eine Whitelist vertrauenswürdiger Quellen für Workers und Frames.

http 
Content-Security-Policy: child-src 'self'
Content-Security-Policy: child-src 'self' https://trusted.example.com

Direktiven

Die child-src Direktive verwendet Standard-CSP-Quellausdrücke zur Kontrolle untergeordneter Browsing-Kontexte.

'none'
Verbietet alle Web Workers und Frames. Höchste Sicherheitsstufe für Anwendungen ohne Worker- oder Frame-Nutzung.
'self'
Erlaubt Workers und Frames nur vom gleichen Origin. Standard-Einstellung für die meisten Single-Origin-Anwendungen.
https://trusted.example.com
Whitelisting spezifischer Domains. Erlaubt Workers und Frames von explizit vertrauenswürdigen Hosts.
blob:
Erlaubt Workers aus Blob-URLs. Notwendig für dynamisch erstellte Worker-Scripts aus Strings.
data:
Erlaubt Workers aus Data-URLs. Sicherheitsrisiko, sollte vermieden werden außer für spezifische Legacy-Szenarien.

Beispiele

Nachfolgend finden Sie praktische Anwendungsbeispiele für die child-src Direktive.

Beispiel 1 API mit Web Workers

http 
HTTP/1.1 200 OK
Content-Security-Policy: child-src 'self' blob:; script-src 'self'

<!DOCTYPE html>
<html>
<script>
  const worker = new Worker('/api/workers/data-processor.js');
  // Erlaubt: same-origin worker

  const code = 'self.onmessage = e => postMessage(e.data * 2)';
  const blob = new Blob([code], {type: 'application/javascript'});
  const blobWorker = new Worker(URL.createObjectURL(blob));
  // Erlaubt: blob: Worker

  const externalWorker = new Worker('https://evil.com/worker.js');
  // Blockiert: nicht in Whitelist
</script>
</html>

Beispiel 2 Dashboard mit eingebetteten Widgets

http 
Content-Security-Policy: child-src 'self' https://widgets.example.com; frame-src 'self' https://widgets.example.com

<iframe src="https://widgets.example.com/analytics"></iframe>
<!-- Erlaubt durch child-src -->

<iframe src="https://untrusted.com/ad"></iframe>
<!-- Blockiert -->

Beispiel 3 Strikte Worker-Isolation

http 
Content-Security-Policy: child-src 'none'; worker-src 'self'; frame-src 'none'

<script>
  const worker = new Worker('/workers/calculator.js');
  // Erlaubt durch spezifischere worker-src Direktive
</script>

Die spezifischeren Direktiven worker-src und frame-src überschreiben child-src wenn gesetzt.

Worker Security Architecture Flow

CSP child-src kontrolliert Web Worker Erstellung

Vorteile für die Systemarchitektur

  • Worker-Isolation: Verhindert Erstellung bösartiger Web Workers die Credentials stehlen oder Schadcode im Hintergrund ausführen könnten
  • Frame-Injection-Schutz: Kontrolliert eingebettete Frames zur Verhinderung von Clickjacking und Content-Injection-Angriffen
  • Granulare Context-Kontrolle: Ermöglicht separate Policies für Workers und Frames durch spezifischere worker-src und frame-src Direktiven

Spezifikation

Content Security Policy Level 3 – W3C Working Draft https://www.w3.org/TR/CSP3/#directive-child-src

Weitere Spezifikationen

CSP frame-src Directive, CSP worker-src