All textures are coming from an Adobe Scene7 server. The tool I'm making is based on the original tool from Quick-Step. You can view it here: http://www.quick-step.co.uk/en-gb/find-your-floor (click on 'start roomviewer'). It also uses ThreeJS from what I can see.
An example texture being loaded into that tool is: http://quickstep.scene7.com/is/image/QuickstepRender/?src=flr_400383-n-v
This image has no Access-Control-Allow-Origin header present. Still, these texture are loading into their tool just fine.
The Problem
If in my application I use one of the textures which is being loaded from a different Scene7 server onto my ThreeJS plane I get the following error
XMLHttpRequest cannot load http://s7g4.scene7.com/is/image/UnilinROWRender/qs-flr_400000020-e-h. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin *** is therefore not allowed access.
According to this link from helpx.adobe.com I have to put a AccessControlAllowOrigin.xml file somewhere on te Scene7 server. This, however does not give me the headers I need on the image (see link to image in quote). But the original tool from QS doesn't have these headers either, and it still works. So I don't know for sure if the problems lies with my ThreeJS code or with Scene7.
Here is the code I'm using to load the image:
var loader = new THREE.TextureLoader();
loader.crossOrigin = 'anonymous';
loader.load('http://s7g4.scene7.com/is/image/UnilinROWRender/qs-flr_400000020-e-h',
// Function when resource is loaded
function (text) {
geometry = new THREE.PlaneGeometry(20, 20);
material = new THREE.MeshBasicMaterial({ map: text, side: THREE.DoubleSide });
plane = new THREE.Mesh(geometry, material);
anchor.add(plane);
},
// Function called when download progresses
function (xhr) {
console.log((xhr.loaded / xhr.total * 100) + '% texture loaded');
},
// Function called when download errors
function (xhr) {
console.log('An error happened while loading texture: ', xhr);
}
);
What exactly am I not seeing here that prevents me from using that texture?
