Política de CORS sobre la image en caching

En cromo 22 y safari 6.

Carga de imágenes desde s3 para su uso en un canvas (con extracción como una intención principal) utilizando un cucharón S3 habilitado para CORS, con el siguiente código:

<!-- In the html --> <img src="http://s3....../bob.jpg" /> // In the javascript, executed after the dom is rendenetworking this.img = new Image(); this.img.crossOrigin = 'anonymous'; this.img.src = "http://s3....../bob.jpg"; 

He observado lo siguiente:

  1. Inhabilitar cachings
  2. Todo funciona bien, ambas imágenes cargan

Luego intentándolo con cachings habilitados:

  1. Habilitar cachings
  2. Carga de imágenes DOM, la image de canvas crea una exception de security dom

Si modifico la parte javascript del código para anexar una cadena de consulta, haga lo siguiente:

 this.img = new Image(); this.img.crossOrigin = 'anonymous'; this.img.src = "http://s3....../bob.jpg?_"; 

Todo funciona, incluso con el almacenamiento en caching habilitado por completo. Llegué al caching como un problema al usar un proxy http y observar que en el caso de falla, la image no se está solicitando realmente desde el server.

La conclusión que me veo obligado a extraer es que la memory caching de imágenes está guardando los encabezados de request originales, que luego se utilizan para la siguiente request CORS habilitada, y la exception de security se genera debido a la violación de la misma política de origen.

¿Es este comportamiento intencionado?

Editar: Funciona en Firefox.

Edit2: política de Cors en el cubo s3

 <?xml version="1.0" encoding="UTF-8"?> <CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/"> <CORSRule> <AllowedOrigin>*</AllowedOrigin> <AllowedMethod>GET</AllowedMethod> </CORSRule> </CORSConfiguration> 

Estoy usando de par en par porque estoy probando desde mi caja local en este momento. Esto aún no está en producción.

Edit3: política actualizada de cors para especificar un origen

 <?xml version="1.0" encoding="UTF-8"?> <CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/"> <CORSRule> <AllowedOrigin>http://localhost:5000</AllowedOrigin> <AllowedMethod>GET</AllowedMethod> </CORSRule> </CORSConfiguration> 

Cabeceras salientes verificadas:

 Origin http://localhost:5000 Accept */* Referer http://localhost:5000/builder Accept-Encoding gzip,deflate,sdch Accept-Language en-US,en;q=0.8 Accept-Charset ISO-8859-1,utf-8;q=0.7,*;q=0.3 

Encabezados entrantes:

 Access-Control-Allow-Origin http://localhost:5000 Access-Control-Allow-Methods GET Access-Control-Allow-Cnetworkingentials true 

Todavía falla en Chrome si no reventar el caching al cargar en el canvas.

Editar 4:

Solo noté esto en el caso de falla.

Encabezados salientes:

 GET /373c88b12c7ba7c513081c333d914e8cbd2cf318b713d5fb993ec1e7 HTTP/1.1 Host amir.s3.amazonaws.com User-Agent Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_2) AppleWebKit/537.4 (KHTML, like Gecko) Chrome/22.0.1229.91 Safari/537.4 Accept */* Referer http://localhost:5000/builder Accept-Encoding gzip,deflate,sdch Accept-Language en-US,en;q=0.8 Accept-Charset ISO-8859-1,utf-8;q=0.7,*;q=0.3 If-None-Match "99c958e2196c60aa8db385b4be562a92" If-Modified-Since Sat, 29 Sep 2012 13:53:34 GMT 

Encabezados entrantes:

 HTTP/1.1 304 Not Modified x-amz-id-2 3bzllzox/vZPGSn45Y21/vh1Gm/GiCEoIWdDxbhlfXAD7kWIhMKqiSEVG/Q5HqQi x-amz-request-id 48DBC4559B5B840D Date Sat, 29 Sep 2012 13:55:21 GMT Last-Modified Sat, 29 Sep 2012 13:53:34 GMT ETag "99c958e2196c60aa8db385b4be562a92" Server AmazonS3 

Creo que esta es la primera request, desencadenada por el dom. No obstante, no sé si no es la request de JavaScript.

El problema es que la image se almacena en caching a partir de una request anterior, sin los encabezados CORS necesarios. Por lo tanto, cuando lo solicita de nuevo, para el canvas, con el 'crossorigin' especificado, el browser utiliza la versión almacenada en caching, no ve los encabezados necesarios, y provoca un error CORS. Cuando agrega el '? _' A la url, el browser ignora la caching, ya que esta es otra URL. Eche un vistazo a este hilo: https://bugs.chromium.org/p/chromium/issues/detail?id=409090

Firefox y otros browseres no tienen ese problema.

¿Qué configuration de CORS está aplicando? Esta publicación sugiere que los comodines en AllowedOrigin se AllowedOrigin (en lugar de enviarse literalmente, parece ser un comportamiento no documentado); y el valor del encabezado Access-Control-Allow-Origin se guarda en caching para requestes posteriores, lo que causa problemas similares a lo que informa.