Chrome，THREE.js：跨原始图片加载被拒绝 [英] Chrome, THREE.js: Cross-origin image load denied

问题描述

我正在使用THREE.js并添加像这样的材料

I'm using THREE.js and adding an material like this

var materialWall = new materialClass( { color: 0xffffff, map: THREE.ImageUtils.loadTexture( 'images/a.png' ) } );

它可以正常工作在Chrome，IE，FF，直到3天前，最新版本（17）。

It works correctly in Chrome, IE, FF, until 3 days ago, after I update Chrome to the latest dev version (17).

Chrome 17无法正确加载图片：

Chrome 17 just cannot load the image correctly:

Cross-origin image load denied by Cross-Origin Resource Sharing policy.

我想知道为什么，因为图像显然在同一个域， ORIGIN的东西呢？

I'm wondering why, since the image is clearly in the same domain, how come the CROSS-ORIGIN stuff then?

这是Chrome或THREE.js或我的代码的错误吗？

is this a bug of chrome or THREE.js or my code?

推荐答案

https://github.com/mrdoob/three.js / issues / 687 指的是three.js的GitHub上的一个问题，它有很好的解决方法列表，包括指向描述如何在本地运行的wiki页面的链接。在线程中还有一些其他的解决方法，包括添加以下到您的脚本：

https://github.com/mrdoob/three.js/issues/687 refers to an issue on three.js' GitHub, which has good list of workarounds, including a link to a wiki page describing how to run locally. There are also some other workarounds in the thread, including adding the following to your scripts:

THREE.ImageUtils.crossOrigin = "";

或者，添加CORS标题，以便他们被明确允许。

Or, adding CORS headers so that they are specifically allowed.

^{请注意，大多数此类信息是从问题的现有链接添加的，此回答的原作者未包含此链接。}

这篇关于Chrome，THREE.js：跨原始图片加载被拒绝的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！