Clickjacking mit frame-ancestors blockieren

Was diese Prüfung macht

Untersucht die Response-Header auf eine der beiden Varianten:

• X-Frame-Options: DENY oder X-Frame-Options: SAMEORIGIN
• Content-Security-Policy: frame-ancestors 'none' oder frame-ancestors 'self'

Die Prüfung fällt durch, wenn keines vorhanden ist und ein Angreifer deine Seite in ein verstecktes iframe auf einer bösartigen Site einbetten könnte.

Warum es wichtig ist

Clickjacking ist ein UI-Redress-Angriff: Der Angreifer lädt deine Site in ein transparentes iframe, das über einem harmlos wirkenden Button liegt („Gratis-iPad! Hier klicken”). Der Klick des Nutzers landet tatsächlich auf einem echten Button in deinem iframe — und löst eine Zahlung aus, ändert ein Passwort, überweist Geld.

• Der Angriff funktioniert gegen jede eingeloggte Session. Wenn ein Nutzer in einem anderen Tab in deiner Site eingeloggt ist, übernimmt das iframe die Session-Cookies, und der Klick wird als dieser Nutzer ausgeführt.
• Er wurde in der Praxis gegen Bankseiten, soziale Netzwerke und Admin-Dashboards eingesetzt. OAuth-Flows und 2FA-Enrollment-Seiten waren betroffen.
• Die Lösung ist ein Header. Browser weigern sich, deine Seite in einem iframe zu rendern, wenn der Header gesetzt ist — der Angriff ist nicht mehr möglich.

Frame-Schutz ist die günstigste Maßnahme in der Web-Sicherheit: ein Response-Header pro Seite, keine Code-Änderung, keine Performance-Kosten.

Wie du es behebst

Wähle einen der beiden Mechanismen. Moderne Browser bevorzugen CSP frame-ancestors; X-Frame-Options ist der Legacy-Header, der auch in älteren Browsern funktioniert. Sende beide für maximale Abdeckung — sie kollidieren nicht.

Alle Einbettungen verbieten (empfohlen für Seiten, die nicht eingebettet werden sollen):

Content-Security-Policy: frame-ancestors 'none'
X-Frame-Options: DENY

Einbettung nur vom eigenen Origin erlauben:

Content-Security-Policy: frame-ancestors 'self'
X-Frame-Options: SAMEORIGIN

Einbettung von bestimmten vertrauenswürdigen Origins erlauben (nur CSP unterstützt das — X-Frame-Options kann mehrere Domains nicht auflisten):

Content-Security-Policy: frame-ancestors 'self' https://partner.example.com

nginx:

add_header Content-Security-Policy "frame-ancestors 'none'" always;
add_header X-Frame-Options "DENY" always;

Das always-Flag ist entscheidend — ohne es überspringt nginx den Header bei Fehler-Antworten.

Apache:

Header always set Content-Security-Policy "frame-ancestors 'none'"
Header always set X-Frame-Options "DENY"

Caddy:

header {
  Content-Security-Policy "frame-ancestors 'none'"
  X-Frame-Options "DENY"
}

Cloudflare — Rules → Transform Rules → Modify Response Header, beide Header global hinzufügen. Oder Page Shield nutzen, wenn du WAF-Level-Kontrolle willst.

Next.js (next.config.js):

module.exports = {
  async headers() {
    return [
      {
        source: "/(.*)",
        headers: [
          { key: "Content-Security-Policy", value: "frame-ancestors 'none'" },
          { key: "X-Frame-Options", value: "DENY" },
        ],
      },
    ];
  },
};

Express:

import helmet from "helmet";
app.use(helmet.frameguard({ action: "deny" }));
app.use(
  helmet.contentSecurityPolicy({
    directives: { frameAncestors: ["'none'"] },
  })
);

Testen:

curl -sI https://yourdomain.com/ | grep -iE 'frame'

Erwarte beide Header oder zumindest frame-ancestors. Anschließend lokal in einem iframe einbetten und bestätigen, dass der Browser das verweigert.

Häufig gestellte Fragen

Soll ich alle Einbettungen verbieten oder nur Same-Origin?

Voreinstellung frame-ancestors 'none' und nur lockern, wenn du Seiten aktiv einbetten musst. Die meisten Marketing-Sites, Admin-Dashboards und Apps sollten nie eingebettet werden — und die OAuth-Anbieter (Google, Apple, Stripe), die wirklich Einbettung brauchen, haben definierte Embed-Flows, die deine CSP nicht aufweichen müssen.

Was ist mit X-Frame-Options: ALLOW-FROM?

Veraltet und in Chrome und Firefox nicht unterstützt. Stattdessen Content-Security-Policy: frame-ancestors nutzen — es akzeptiert mehrere Origins und funktioniert in jedem modernen Browser.

Macht das Googles PageSpeed Insights oder andere Tools kaputt?

Nein. Diese Tools rufen die Seite direkt ab, nicht in einem iframe. Der Header wirkt nur auf iframe-Einbettung.