Is It Possible To Avoid "the Operation Is Insecure" When Using Canvas?

I have a HTML canvas (using KineticJS, however canvas aficionados should still chime in) that loads an image from another domain, places it onto the canvas and overlays some other

Solution 1:

If the images are coming from a domain you don't control, then you're stuck with CORS limitations.

If you have access to configuring your own server, you can enable cross-origin sharing by setting this heading (read more about server security when doing this):

Access-Control-Allow-Origin: <origin> | *

Alternatively, if you host your images on a CORS enabled site like www.dropbox.com you can fetch images without the security errors like this:

var image1=newImage();
image1.onload=function(){
    context.drawImage(image1,0,0);
}
image1.crossOrigin="anonymous";
image1.src="https://dl.dropboxusercontent.com/u/99999999/yourCORSenabledPic.jpg";