Impostazione di Access-Control-Allow-Origin su Cloudfront

Sto riscontrando problemi con la fornitura di risorse statiche a Firefox utilizzando AWS Cloudfront.

Chrome funziona perfettamente, ma Firefox sta restituendo un errore CORS.

Se eseguo l'arricciatura, ottengo:

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: ...

Che penso abbia bisogno dell'intestazione:

Access-Control-Allow-Origin: *

Qualcuno può aiutarmi? Perché è un problema su Firefox e non su Chrome? Come posso risolverlo?

Per prima cosa, devi assicurarti di inserire nella whitelist l'intestazione di origine:

Se desideri che CloudFront rispetti le impostazioni di condivisione delle risorse tra le origini, configura CloudFront per inoltrare l'intestazione Origin verso l'origine.

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

Vedi anche: http://aws.amazon.com/blogs/aws/enhanced-cloudfront-customization/

A proposito, ci sono molte domande simili su serverfault / stackoverflow e molte risposte.

Questo è un po 'più complicato di quanto indichi la risposta accettata.

Il supporto CORS quando si utilizza Cloudfront + S3 è effettivamente implementato in S3 e funziona così secondo Amazon:

L'intestazione Origin della richiesta deve corrispondere a un elemento AllowOrigin.

Il metodo di richiesta (ad esempio, GET o PUT) o l'intestazione del metodo di richiesta di controllo di accesso nel caso in cui una richiesta OPTIONS di verifica preliminare debba essere uno degli elementi consentiti.

Ogni intestazione elencata nell'intestazione Access-Control-Request-Headers della richiesta nella richiesta di verifica preliminare deve corrispondere a un elemento AllowHeader.

Ciò ha senso, ciò che potrebbe non essere chiaro è che se nessuna intestazione Origin viene inviata dal client, questa elaborazione non viene eseguita affatto. E stiamo usando Cloudfront di fronte che, se stai solo ospitando risorse statiche, probabilmente lo hai impostato per ignorare tutte le intestazioni durante la memorizzazione nella cache. Pertanto, se la prima richiesta a ciascun file da un nodo perimetrale specifico non include l'intestazione Origin, memorizzerà nella cache la risposta senza l'intestazione Access-Control-Allow-Origin.

Il risultato è che la prima richiesta in arrivo determinerà quali intestazioni vengono restituite per tutte le richieste fino alla scadenza della cache.

Esistono diversi modi per risolvere questo problema.

• Installa cloudfront per eseguire la memorizzazione nella cache condizionale in base all'intestazione "Origine".

Funziona bene se ti aspetti solo poche o una singola origine, ma in caso contrario il rapporto di memorizzazione nella cache potrebbe peggiorare.

• Usa Lambda @ edge per impostare forzatamente le intestazioni, questo può essere fatto solo una volta per ogni richiesta di origine (S3).

Completamente flessibile, ma aggiunge costi generali e costi.

• Rendi cloudfront sovrascrive l'intestazione "Origin" su un valore fittizio per ogni richiesta.

Questo è davvero utile solo nel caso "Access-Control-Allow-Origin: *" ed è un po 'un trucco, ma è probabilmente la migliore soluzione attuale quando si ospitano risorse statiche su cloudfront + S3.