THREE.js Collada textures not loading

Question

1) start local web server

C:\Users\Public\Documents\Rick>http-server . -p 8832 --cors
Starting up http-server, serving . on: http://0.0.0.0:8832<br/>
Hit CTRL-C to stop the server<br/><br/>
**partial log** from (node.js) http-server . -p 8832 --cors<br/><br/>
[Mon, 15 Jun 2015 18:14:57 GMT] "GET /2015_03_19_Try6a3D_dae/2015_03_19_Try6a3D/scrn_ground.png" "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML,  like Gecko) Chrome/43.0.2357.124 Safari/537.36"<br/><br/>

2) start html file that loads 2015_03_19_Try6a3D_dae/2015_03_19_Try6a3D.dae

from collada.html (javascript console)<br/><br/>
Uncaught SecurityError: Failed to execute 'texImage2D' on 'WebGLRenderingContext': The cross-origin image at http://localhost:8832/2015_03_19_Try6a3D_dae/2015_03_19_Try6a3D/scrn_ground.png may not be loaded.<br/><br/>

I tried to post the javascript that loads the dae, here, but could not get it to format correctly.

3) There is a brief flash of something before the texture loading errors happen. This dae has been loaded in Sketchup where all the textures appear. Of course, I am confused because cross-origin loading had to be working to load 2015_03_19_Try6a3D.dae in the first place. I will gladly send anyone collada.html, 2015_03_19_Try6a3D.dae, and all related files for them to play with.

Answer 1

I had the same problem. ColladaLoader.js currently does not address CORS out-of-the-box. In order to render your textures, it implements either the Loader class or the ImageLoader class (depending upon the situation). Both need to have the CORS origin assigned to either '' or 'anonymous' if you want to avoid cross-origin errors in all cases for Collada references.

Go to this line in ColladaLoader.js:

texture = loader.load( url );

Add this line right above it:

loader.crossOrigin = '';

Then go to this line in the same script:

loader = new THREE.ImageLoader();

And add this line right below it:

loader.setCrossOrigin( '' );

And voila! My cross-origin errors went away after I made this change.