Security Error with canvas.toDataURL() and drawImage()

Answer 1

i believe that the error is an extension to the same origin policy, basically it isnt allowing you to manipulate a resource from another server. although insecure you could build into the server a method of retrieving external resources: myserver.com/?external=url/path/to/img... that would work in theory.

Answer 2

You are right, this is a security feature, not a bug.

If reading the Image (for instance with toDataURL or getImageData) would work, you could also read https://mail.google.com/mail/ from the context of your visitor get his emails or whatever.

Therefore, canvas elements have a origin-clean flag, which is set when external images are written to the canvas. In that case, you can no longer read from it.

You can read more about this topic here.

Answer 3

Ya thats a feature. As the image is on another server. Check this

Why does canvas.toDataURL() throw a security exception?

You can catch these exceptions. But this will be headache to do for other browsers too and also not right for security.

So better solution is download that image on local.And give the image src path to that.