4.8. Security

Images are often security risks; for example, you may want to restrict access to pictures you post to a social network, or a corporation may wish to keep product prototype pictures under wraps. Or you may be a politician.

So, because of security concerns, the HTML5 Canvas specification lets you draw images that are not your own (meaning images from other domains), but you cannot save or manipulate cross-domain images with the Canvas API.

Here’s how Canvas image security works:

Every canvas has a flag called origin-clean whose value is originally true. If you use drawImage() to draw a cross-domain image, the origin-clean flag is set to false. Likewise, if you use drawImage() to draw another canvas whose origin-clean flag is set to false, then the canvas that you are drawing into will also have its origin-clean flag set to false.