Contao 4 - Access-Control-Allow-Origin
Contao 4 - Warum erhalte ich diese Fehlermeldung? Access-Control-Allow-Origin
Contao 4 - Access-Control-Allow-Origin
Warum erhalte ich diese Fehlermeldung?
Wenn Seite A versucht, Inhalt von Seite B abzurufen, kann Site B einen Antwort-Header für die Zugriffssteuerung mit Informationen zur Herkunft senden, um dem Browser mitzuteilen, dass der Inhalt dieser Seite bestimmten Quellen zugänglich ist. (Beispiel: Anfrage von https://localhost:3000 -> Schema, Domain und Portnummer.) Standardmäßig sind die Seiten von Seite B für keinen anderen Ursprung zugänglich. Durch die Verwendung des Headers "Access-Control-Allow-Origin" wird der Zugriff auf eine bestimmte Anfragende Domain geöffnet.
Für jede Ressource / Seite, die Seite B für Seite A zugänglich machen soll, muss in Seite B ein entsprechender Antwortheader definiert werden:
Access-Control-Allow-Origin: http://localhost:3000
Dies kann zum Beispiel im Fall von Contao per .htaccess oder PHP erfolgen.
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
# .env im Root Verzeichnis
CORS_ALLOW_ORIGIN='localhost:[0-9]|example.org'
# app/config/config.yml
nelmio_cors:
defaults:
origin_regex: true
allow_origin: ['%env(CORS_ALLOW_ORIGIN)%']
allow_methods: ['GET', 'OPTIONS', 'POST', 'PUT', 'PATCH', 'DELETE']
allow_headers: ['Content-Type', 'Authorization']
expose_headers: ['Link']
max_age: 3600
paths:
'^/api/':
allow_origin: ['*']
allow_headers: ['X-Custom-Auth']
allow_methods: ['POST', 'PUT', 'GET', 'DELETE']
max_age: 3600
'^/':
origin_regex: true
allow_origin: ['^http://localhost:[0-9]+']
allow_headers: ['X-Custom-Auth']
allow_methods: ['POST', 'PUT', 'GET', 'DELETE']
max_age: 3600
hosts: ['^rest\.']Lösung #2
# in der .htaccess
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "localhost:3000"
</IfModule>Mehr Infos
Mehr Informationen zum NelmioCorsBundle findest du unter https://github.com/nelmio/NelmioCorsBundle
