Question

所有纹理都来自 Adobe Scene7 服务器。我正在制作的工具基于Quick-Step的原始工具。你可以在这里查看：http://www.quick-step.co.uk/en-gb/find-your-floor（点击'开始房间查看器'）。它也使用了我所看到的ThreeJS。

加载到该工具中的示例纹理是：http://quickstep.scene7.com/is/image/QuickstepRender/?src=flr_400383-n-v

此图片没有Access-Control-Allow-Origin标题。不过，这些纹理正好加载到他们的工具中。

问题

如果在我的应用程序中我使用从不同的Scene7服务器加载到我的ThreeJS平面上的纹理之一，我会收到以下错误

XMLHttpRequest无法加载 http://s7g4.scene7.com/is/image/UnilinROWRender/qs-flr_400000020-e-h。请求中不存在“Access-Control-Allow-Origin”标头资源。因此不允许来源*** 访问。

根据this link from helpx.adobe.com，我必须在Scene7服务器上的某处放置一个 AccessControlAllowOrigin.xml 文件。但是，这并没有给我在图像上需要的标题（请参阅引用中的图像链接）。但QS的原始工具也没有这些标题，它仍然有效。所以我不确定问题是我的ThreeJS代码还是Scene7。

以下是我用来加载图片的代码：

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);
    }
);

我在这里看不到什么阻止我使用这种纹理？

Answer 1

你的纹理加载功能是好的我认为问题是网站的标题的一面，你尝试从你的应用程序获取图像没有允许请求或你的应用程序不接受从这个网站获取图像

最好的选择是下载图片并在您的项目中放置本地网址

如果你不能尝试推荐

https://developer.chrome.com/extensions/xhr

ThreeJS：XMLHttpRequest错误 - 无法从Adobe Scene7服务器加载图像

问题

1 个答案: