Easeljs Sprite On("click) Returns Cors Error

First off, I am working on a local EaselJS/CreateJS project, only to test some sprite and mouse interaction. I have added a simple sprite image to the stage, and I called it 'enemy

Solution 1:

Canvas is perfectly happy to allow you to add cross origin data to it, but doing so (without CORS) will taint the canvas.

You get the error when you try to read data from the canvas while it is tainted.

Presumably the library you are using is trying to read the data as part of its code for determining what you clicked on.

Solution 2:

I ran into a similar issue when trying to use images hosted on the web. Here is the function I wrote based on that answer as a work around:

functionloadImg(uri) {
  var image = document.createElement("img")
  image.crossOrigin = "Anonymous"
  image.src = uri 
  return image
}

Then do:

var enemy1 = new createjs.Bitmap(loadImg("http://example.com/enemy_sprite.png"))