When I load a hosted image in html5 canvas, an error is shown in canvas (though only in Chome, not Firefox), the image is from the Amazon S3 server:
Image from origin 'https://xxx.s3.amazonaws.com' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Origin 'http://localhost:9015' is therefore not allowed access.
And when I try to save the canvas as an image,
Uncaught SecurityError: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.
Well yes, I have set the CORS config,
<?xml version="1.0" encoding="UTF-8"?> <CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/"> <CORSRule> <AllowedOrigin>*</AllowedOrigin> <AllowedMethod>GET</AllowedMethod> <AllowedHeader>*</AllowedHeader> </CORSRule> </CORSConfiguration>
And
img.crossOrigin = 'something'