How do I debug canvas cross-domain issues in Chrome?

Question

I am getting cross-domain request errors in chrome, when I try to perform a hit test with EaselJS (which uses getImageData() ).

Unable to get image data from canvas because the canvas has been 
tainted by cross-origin data.

The weird thing is that I'm running a local server and all images are served from this localhost:3000 and render nicely.

How do I use Chrome's Dev Tools to figure out the issue? All my images, html and JS are grouped under :3000/ in the Resources tab. What's the next thing you would check?

Answer 1

There might be something else in your code setting it off. Pour over everything for other examples.

Alternatively, install Firefox and put on Strict errors/warnings. I use Chrome as my main browser but sometimes FF has much more verbose errors/warnings that can make debugging a complex issue easier.

Also for the record, if you launch Chrome with the flag --allow-file-access-from-files it won't throw any of these exceptions.