4.8.10.2 Security with canvas elements — HTML5
4.8.10.2 Security with canvas elements — HTML5
Information leakage can occur if scripts from one origin can access information (e.g. read pixels) from images from another origin (one that isn’t the same).
To mitigate this,
canvaselements are defined to have a flag indicating whether they are origin-clean. Allcanvaselements must start with their origin-clean set to true. The flag must be set to false if any of the following actions occur:
- The element’s 2D context’s
drawImage()method is called with anHTMLImageElementor anHTMLVideoElementwhose origin is not the same as that of theDocumentobject that owns thecanvaselement.
…
Whenever the
toDataURL()method of a canvas element whose origin-clean flag is set to false is called, the method must raise aSECURITY_ERRexception.Whenever the
getImageData()method of the 2D context of a canvas element whose origin-clean flag is set to false is called with otherwise correct arguments, the method must raise aSECURITY_ERRexception.
I was pretty jazzed to get Close Pixelate working on all over the web. Dynamically pulling in images from Flickr would have been fun. Turns out the HTML5 Spec explicitly disallows using getImageData or toDataURL() on images not hosted on the same domain of the current page.