相同来源图像texImage2D的SecurityError

Question

我目前正在学习WebGL。 在对纹理完成加载时调用的texImage2D的调用中，我得到以下SecurityError ：

Uncaught SecurityError: Failed to execute 'texImage2D' on 'WebGLRenderingContext': The cross-origin image at /path/to/texure.png may not be loaded.

但是，该文件位于同一个域中，实际上它与请求它的html文件位于同一目录中。

这是文件布局：

> js
|-> script.js
|-> glUtils.js
|-> sylvester.js
> texture.png
> index.html

当我查看F12控制台的资源列表时，图像texture.png就在那里，完全加载，它是256 x 256.为什么它认为我从另一个域请求？

Answer 1

解决方案是您必须在本地Web服务器上，因为不会授予file：///域请求。 （Pointy提供的信息：

如果您从本地网络服务器提供这些内容，它将起作用，因为浏览器会将这些内容视为来自同一个域。 Chrome曾经有一个命令行选项允许它： - allow-file-access-from-files但我不知道它是否仍然有效

Answer 2

您可能会收到错误，因为您使用的是基于file://的URL。

解决方案是使用简单的Web服务器。 打开终端并输入

python -m SimpleHTTPServer

然后转到http://localhost:8000 （如果你在Windows上安装python）或使用node.js或者甚至可能更好地使用devd

不要使用--allow-file-access-from-files 。 这会打开您的计算机以通过浏览器进行攻击。 这就像关闭防火墙或病毒扫描程序。