天空的 A-Frame 360​​ 图像

A-Frame 360 image for sky

我正在尝试使用 URL 拍摄一张以 Theta S 为天空的 360 度全景照片。我已经能够对本地文件执行此操作,但是当我尝试将其作为 URL 引用时,它不起作用。代码看起来很简单,所以我不确定为什么它不起作用。我已经 运行 在多个浏览器上尝试过它,包括 Nightly。

   <!DOCTYPE html>
<html>
    <head>
        <script src="https://aframe.io/releases/0.3.2/aframe.min.js"></script>
    </head>
    <body>
        <a-scene>
            <a-assets>
                <img id="mall" src="http://www.mycode.zone/res/dc-mall.JPG">
            </a-assets>
            <a-sky src="#mall"></a-sky>
            <a-entity position="0 0 1.5">
                <a-camera></a-camera>
            </a-entity>
    </a-scene>
    </body>
</html>

由于服务器的 CORS 策略,图像的托管方式不允许其他站点使用文档中的图像。如果我使用来自 Mozilla 的示例天空盒图像,您的代码有效:

<img id="mall" src="https://aframe.io/aframe/examples/showcase/composite/lake.jpg">

在您的开发者控制台中查看您的原始代码,您会看到如下内容:

Access to Image at 'http://www.mycode.zone/res/dc-mall.JPG' from origin 'http://s.codepen.io' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://s.codepen.io' is therefore not allowed access.

这是工作代码笔:http://codepen.io/anon/pen/dOdmNo