Cross-origin image load denied with three.js in chrome

Question

Trying to add material in THREE.js like this

var materialWall = new materialClass( { color: 0xffffff, map: THREE.ImageUtils.loadTexture( \'image         


        

Answer 1

If you:

• don't want to set up your own server, and
• don't want to downgrade your browser's security

then I worked out a way around this which involves only a little bit of effort:

1. Convert the image into Base64 text
2. Store it in an external Javascript file
3. Link it to your project page
4. Load it into your texture

Full details can be found at http://tp69.wordpress.com/2013/06/17/cors-bypass/ for those that are interested.