title: CORS settings for images in canvas
body: <p>I am attempted to use Caman.js and load images from Amazon S3. Caman.js is a JS library for producing image effects and it works by creating a copy of the image to a canvas object and doing various pixel manipulations to the data. It looks like canvas has some security details in place to limit the ability of javascript to access the pixel data when that data is coming from a foreign server unless that server passes along some security credentials in the request, or Cross-Origin Resource Sharing (CORS).</p>
  
  <p>I've never encountered CORS before, am trying to learn about it, but I can't seem to get this working. From what I can understand, in order to avoid this error which appears in Chrome:</p>
  
  <pre><code>Unable to get image data from canvas because the canvas has been tainted by cross-origin data.
  Uncaught Error: SECURITY_ERR: DOM Exception 18 
  </code></pre>
  
  <p>You need to set a CORS file on your Amazon bucket. Here's the CORS file I'm using:</p>
  
  <pre><code>&lt;?xml version="1.0" encoding="UTF-8"?&gt;
  &lt;CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/"&gt;
      &lt;CORSRule&gt;
          &lt;AllowedOrigin&gt;*&lt;/AllowedOrigin&gt;
          &lt;AllowedMethod&gt;PUT&lt;/AllowedMethod&gt;
          &lt;AllowedMethod&gt;POST&lt;/AllowedMethod&gt;
          &lt;AllowedMethod&gt;GET&lt;/AllowedMethod&gt;
          &lt;AllowedMethod&gt;HEAD&lt;/AllowedMethod&gt;
          &lt;MaxAgeSeconds&gt;3000&lt;/MaxAgeSeconds&gt;
          &lt;AllowedHeader&gt;*&lt;/AllowedHeader&gt;
      &lt;/CORSRule&gt;
  &lt;/CORSConfiguration&gt;
  </code></pre>
  
  <p>This does not seem to have any effect. Are these CORS files cached by Amazon or should I expect it to take effect immediately? -- update: I tried 8 hours later and it still is not working so I assume caching is not the issue.</p>
  
  <p>It seems like the CORS file specified above should allow everything through, no? I've looked through the Chrome documentation on CORS and Google but I can't seem to find any good answers. Has anyone dealt with this issue before?</p>
  
  <p>Thanks!
  Kevin</p>
  
  <p>Update: Here's the Response Headers I get from the image request to Amazon:</p>
  
  <pre><code>Date:Thu, 18 Oct 2012 04:52:40 GMT
  ETag:"9848ce610c994521295d8aa38b47bab9"
  Last-Modified:Thu, 18 Oct 2012 04:19:45 GMT
  Server:AmazonS3
  x-amz-id-2:Govue0tJg5MLYedr/l7T2RU5RApXLZBwJ8p507hS+sLGqxYojRnVKqj4jRHRZsZ6
  x-amz-request-id:F4FF5B669C3156D2
  </code></pre>