Contao 4 - X-FRAME-OPTION Probleme

'Mathias Arzberger'
Mathias Arzberger

Du erhältst Contao 4 in deinem Browser die Fehlermeldung "origin ... has been blocked by CORS policy"? Hier erfährst du wie du das Problem lösen selbst kannst!

Contao 4 - X-FRAME-OPTION Probleme

Fehler: blockiert durch x-frame-options-richtlinie

Warum erhalte ich diese Fehlermeldung?

Ein Sicherheitsfeature der Browser verhindert, dass deine Webseite oder einzelne Unterseiten in einem Frame (HTML Tag "iframe") auf fremden Domains oder Subdomains dargestellt werden kann. Dazu prüft der Browser, ob auf der eingebundenen Seite der HTTP-Header X-Frame-Options existiert und auf welche Wert dieser gesetzt ist.

Dieses Feature verhindert Clickjacking, bei dem ein Hacker die Darstellung einer Internetseite überlagert und versucht Nutzer dazu zu veranlassen, scheinbar harmlose Mausklicks oder andere potentiell schädliche Aktionen durchzuführen.

Die Grundeinstellung für Contao ist zum Beispiel:

Header set X-FRAME-OPTIONS: SAMEORIGIN

Diese Einstellung bewirkt das nur von deiner Domain und deren Subdomains das Einbinden via Frame möglich ist. Es ist ein Aufruf per http:// und https:// möglich. Versucht nun eine Fremde Domain die Inhalte deiner eigenen Webseite einzubinden, blockiert der Browser das anzeigen diese Inhalte zum Beispiel mit dieser Fehlermeldung:

Invalid 'X-Frame-Options' header encountered when loading 'https://example.org/': 'ALLOW-FROM http://example.com' is not a recognized directive. The header will be ignored.

Fehlermeldung 

Access to XMLHttpRequest at 'http://example.org/api/' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Lösung #1 / BestPractice 

# app/config/config.yml

# einzelne Domain erlauben
nelmio_security:
    clickjacking:
        paths:
            '^/.*': 'ALLOW-FROM http://example.org'

ODER

# alles erlauben (nicht empfohlen)
nelmio_security:
    clickjacking:
        paths:
            '^/.*': ALLOW

Lösung #2 

# in der .htaccess

# einzelne Domain erlauben
<IfModule mod_headers.c>
    Header set X-Frame-Options "ALLOW-FROM http://example.org"
</IfModule>

ODER

# alles erlauben (nicht empfohlen)
<IfModule mod_headers.c>
    Header set X-Frame-Options GOFORIT
</IfModule>

Update vom 13.12.2019

Firefox hat die Allow-From Direktive entfernt und andere Browser werden wahrscheinlich nachziehen
Mehr bei Firefox Site Compatibility.

Update 04.02.2020: Auch für Contao 4.8 ist die 2. Variante notwendig.

Die Lösung könnte nun wie folgt aussehen.

# in der app/config/config.yml

# einzelne Domain erlauben
# https://github.com/nelmio/NelmioSecurityBundle#content-security-policy
# (bisher ungetestet, laut Doku)
nelmio_security:
    csp:
        enforce:
            frame-ancestors:
                - 'self'
                - example.org

ODER

# in der .htaccess

<IfModule mod_headers.c>
    Header always append Content-Security-Policy "frame-ancestors 'self' *.example.org *.another-domain.com"
</IfModule>

Mehr Infos

Mehr Informationen zum NelmioSecurityBundle findest du unter https://github.com/nelmio/NelmioSecurityBundle

Zurück

pdir+ webtools für Freelancer & Agenturen
Instagram
Facebook
Twitter
LinkedIn