Reputation: 104
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.
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?
Upvotes: 1
Views: 567
Reputation: 333
hi your texture load function is good I think the probleme is side of headers the web site where you try to get image no allow request from your app or your app no accept to get image from this site
the best option is to download image and put local url in your project
if you cant try to refer
https://developer.chrome.com/extensions/xhr
Upvotes: 0