使用chrome中的three.js拒绝跨源图像加载 [英] Cross-origin image load denied with three.js in chrome

问题描述

尝试在 THREE.js 中添加材料

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

它在Chrome，IE，FF中工作正常，直到3天前Chrome已更新到最新开发版本17。

It works fine in Chrome, IE, FF, until 3 days ago, after Chrome updated itself to the latest dev version 17.

Chrome 17只是不加载图片并抱怨以下

Chrome 17 just doesn't load the image and complains the following

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

由于图像明显属于同一个域，因为这是一个chrome或THREE的问题，这是疯了.js或其他什么？

That's insane since the image is clearly in the same domain, so is this an issue of chrome or THREE.js or something else?

推荐答案

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屋！