Einrichten von Access-Control-Allow-Origin in der Cloud

Ich habe Probleme, Firefox mit AWS Cloudfront statische Ressourcen bereitzustellen.

Chrome funktioniert einwandfrei, aber Firefox gibt einen CORS-Fehler zurück.

Wenn ich curl ausführe, bekomme ich:

HTTP/1.1 200 OK
Content-Type: application/x-font-opentype
Content-Length: 39420
Connection: keep-alive
Date: Mon, 11 Aug 2014 21:53:50 GMT
Cache-Control: public, max-age=31557600
Expires: Sun, 09 Aug 2015 01:28:02 GMT
Last-Modified: Fri, 08 Aug 2014 19:28:05 GMT
ETag: "9df744bdf9372cf4cff87bb3e2d68fc8"
Accept-Ranges: bytes
Server: AmazonS3
Age: 2743
X-Cache: Hit from cloudfront
Via: 1.1 c445b20dfbf3128d810e975e5d84e2cd.cloudfront.net (CloudFront)
X-Amz-Cf-Id: ...

Was meiner Meinung nach den Header braucht:

Access-Control-Allow-Origin: *

Kann mir jemand helfen? Warum ist es ein Problem in Firefox und nicht in Chrome? Wie kann ich das lösen?

Als erstes müssen Sie sicherstellen, dass Sie den Ursprungsheader der Whitelist setzen:

Wenn Sie möchten, dass CloudFront die Einstellungen für die gemeinsame Nutzung von ursprungsübergreifenden Ressourcen berücksichtigt, konfigurieren Sie CloudFront so, dass der Origin-Header an Ihren Ursprung weitergeleitet wird.

http://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/RequestAndResponseBehaviorCustomOrigin.html#request-custom-cors

Siehe auch: http://aws.amazon.com/blogs/aws/enhanced-cloudfront-customization/

Übrigens gibt es mehrere ähnliche Fragen zu Serverfehler / Stackoverflow und viele Antworten.

Dies ist etwas komplizierter als die akzeptierte Antwort vermuten lässt.

Die CORS-Unterstützung bei Verwendung von Cloudfront + S3 ist tatsächlich in S3 implementiert und funktioniert laut Amazon folgendermaßen:

Der Origin-Header der Anforderung muss mit einem AllowedOrigin-Element übereinstimmen.

Die Anforderungsmethode (z. B. GET oder PUT) oder der Header "Access-Control Request-Method" (Zugriffssteuerungsanforderungsmethode), falls die einer Preflight-OPTIONS-Anforderung eines der AllowedMethod-Elemente sein muss.

Jeder im Header "Access-Control-Request-Headers" der Anforderung in der Preflight-Anforderung aufgeführte Header muss mit einem AllowedHeader-Element übereinstimmen.

Dies ist sinnvoll. Unklar ist möglicherweise, dass diese Verarbeitung überhaupt nicht ausgeführt wird, wenn vom Client kein Origin-Header gesendet wird. Und wir verwenden Cloudfront im Vordergrund. Wenn Sie nur statische Assets hosten, haben Sie es wahrscheinlich so eingerichtet, dass beim Caching alle Header ignoriert werden. Wenn die erste Anforderung an jede Datei von einem bestimmten Randknoten nicht den Origin-Header enthält, wird die Antwort ohne den Access-Control-Allow-Origin-Header zwischengespeichert.

Das Ergebnis ist, dass die erste eingehende Anforderung bestimmt, welche Header für alle Anforderungen zurückgegeben werden, bis der Cache abläuft.

Es gibt verschiedene Möglichkeiten, dies zu beheben / zu umgehen.

• Richten Sie Cloudfront für das bedingte Caching basierend auf dem "Origin" -Header ein.

Dies funktioniert gut, wenn Sie nur ein paar oder einen einzelnen Ursprung erwarten, aber ansonsten könnte Ihr Caching-Verhältnis wirklich schlecht werden.

• Verwenden Sie Lambda @ edge, um die Header zwangsweise zu setzen. Dies kann nur einmal für jede Ursprungsanforderung (S3) erfolgen.

Vollständig flexibel, erhöht jedoch den Aufwand und die Kosten.

• Stellen Sie sicher, dass Cloudfront den "Origin" -Header für jede Anforderung auf einen Dummy-Wert überschreibt.

Dies ist nur im Fall "Access-Control-Allow-Origin: *" wirklich nützlich und ein bisschen hackig, aber es ist wahrscheinlich die beste aktuelle Lösung, wenn Sie statische Assets auf Cloudfront + S3 hosten.