-1

这让我发疯了。我正在尝试让天空盒与我从互联网上获得的图像一起使用。我的代码:

作为全局变量:

var path = "file:///C:/Users/Tyler/Desktop/ComS_336_workspace/";
    var imageNames = [
                      path + "meadow_bk.jpg",
                      path + "meadow_ft.jpg",
                      path + "meadow_up.jpg",
                      path + "meadow_dn.jpg",
                      path + "meadow_rt.jpg",
                      path + "meadow_lf.jpg"
                      ];

在主函数中:

   // load the six images
      //THREE.ImageUtils.crossOrigin = "Anonymous";
      var ourCubeMap = THREE.ImageUtils.loadTextureCube(imageNames);

但是得到这个错误:

DOMException: Failed to execute 'texImage2D' on 'WebGLRenderingContext': The cross-origin image at file:///C:/Users/Tyler/Desktop/ComS_336_workspace/meadow_ft.jpg may not be loaded.

当我添加 THREE.ImageUtils.crossOrigin = "Anonymous"; 我收到此错误:

Image from origin 'file://' has been blocked from loading by Cross-Origin Resource Sharing policy: Invalid response. Origin 'null' is therefore not allowed access.

我看到一些帖子说要使用 --allow-files-access-from-files 或其他方式运行 chrome,但不想冒任何安全问题的风险。然后我看到别人说把图片放在网络服务器上?我完全不知道该怎么做,为什么要这么复杂?

我的 html 和 js 文件与我的图像在同一个文件夹 (ComS_336_workspace) 中。

我真的需要帮助来做什么,如果我必须做一个网络服务器,我该如何把我的图像放在它们上面并设置我的图像的路径?我不明白。

4

2 回答 2

0

To solve this problem you need either save remote files to your site or use some proxy script from your site (PHP in example) to get images through your site.

Anyway you need a fully qualified domain name to get rid of CORS-compliant errors. Loading webgl and images from file:/// will not work.

于 2015-11-13T10:37:19.120 回答
0

你用什么来编辑你的代码?如果您尝试从桌面运行该页面以进行测试,那么我建议您使用brackets.io

它很棒,免费,并且可以在您构建代码时帮助您解决 CORS 问题。

于 2015-11-15T01:52:15.810 回答