CORS-Policies anwenden
Browser blockieren standardmäßig Anfragen von einer Website (https://app.example.com) an eine fremde Origin wie https://Bucketname.s3.internet1.de. Mit einer CORS-Konfiguration am Bucket erlauben Sie solche Cross-Origin-Zugriffe gezielt – etwa für Direkt-Uploads aus dem Browser oder das Laden von Fonts und Medien per JavaScript.
Wann brauche ich CORS?
fetch()/XMLHttpRequestaus dem Browser auf Objekte (auch mit Presigned URLs)- Browser-Uploads direkt in den Bucket (Presigned PUT/POST)
- Webfonts, WebGL-Texturen,
<canvas>-Verarbeitung von Bildern aus dem Bucket
Nicht nötig ist CORS für serverseitige Zugriffe (CLI, SDKs im Backend) oder einfaches Einbinden per <img src=…>.
CORS-Regeln setzen
cors.json:
{
"CORSRules": [
{
"AllowedOrigins": ["https://app.example.com"],
"AllowedMethods": ["GET", "HEAD", "PUT"],
"AllowedHeaders": ["*"],
"ExposeHeaders": ["ETag"],
"MaxAgeSeconds": 3600
}
]
}
aws s3api put-bucket-cors --bucket mein-bucket \
--cors-configuration file://cors.json \
--endpoint-url https://s3.internet1.de
Felder im Überblick
| Feld | Bedeutung |
|---|---|
AllowedOrigins | Erlaubte Origins (Schema + Host + Port). * erlaubt alle – nur für öffentliche, unkritische Inhalte verwenden. |
AllowedMethods | GET, HEAD, PUT, POST, DELETE |
AllowedHeaders | Header, die der Browser senden darf (z. B. Content-Type, x-amz-*); * für alle |
ExposeHeaders | Antwort-Header, die JavaScript lesen darf – für Multipart-Uploads im Browser ist ETag nötig |
MaxAgeSeconds | Cache-Dauer der Preflight-Antwort im Browser |
Mehrere Regeln sind möglich; die erste passende gewinnt.
Konfiguration prüfen und entfernen
aws s3api get-bucket-cors --bucket mein-bucket --endpoint-url https://s3.internet1.de
aws s3api delete-bucket-cors --bucket mein-bucket --endpoint-url https://s3.internet1.de
CORS testen
Preflight-Anfrage simulieren:
curl -i -X OPTIONS "https://mein-bucket.s3.internet1.de/test.txt" \
-H "Origin: https://app.example.com" \
-H "Access-Control-Request-Method: PUT"
Bei passender Regel enthält die Antwort u. a. Access-Control-Allow-Origin: https://app.example.com.
Typische Fehler
| Symptom | Ursache | Lösung |
|---|---|---|
| Konsole meldet blocked by CORS policy | Origin nicht in AllowedOrigins | exakte Origin (inkl. https://, ohne Pfad, ggf. Port) eintragen |
| PUT-Upload scheitert, GET geht | PUT fehlt in AllowedMethods oder Content-Type nicht in AllowedHeaders | Methode/Header ergänzen |
| Multipart-Upload im Browser hängt nach Teilen | ETag nicht in ExposeHeaders | "ExposeHeaders": ["ETag"] setzen |
| Änderung wirkt nicht sofort | Preflight im Browser gecacht | MaxAgeSeconds abwarten oder Hard-Reload/Inkognito testen |
CORS ist keine Zugriffskontrolle, sondern nur eine Browser-Freigabe. Private Objekte bleiben durch ACLs/Signaturen geschützt – umgekehrt schützt eine restriktive CORS-Regel keine öffentlichen Objekte vor Downloads außerhalb des Browsers.