谷歌VR视图 - 托管代码无法工作

Question

也许这个问题比我想象的要简单，但我对HTML / JS还比较陌生，这似乎是这段代码的一个具体问题。我正在使用Google VR Viewer将360元素嵌入到我的网页中。

他们的文档在这里很简单，如果我也使用托管在Google域上的媒体，那么按照他们网站上的设置进行设置就可以正常工作。这是我正在使用的代码，它工作得非常好：

<script src="https://storage.googleapis.com/vrview/2.0/build/vrview.min.js"></script>
<script>
  window.addEventListener('load', onVrViewLoad);
  function onVrViewLoad() {
    vrView = new VRView.Player('#vrview', {
    width: '100%',
    height: 480,
    image: 'https://storage.googleapis.com/vrview/examples/coral.jpg',
    is_stereo: true,
    is_autopan_off: true
    });
  }
</script>

然而，我需要将.js文件托管在自己的服务器上，而不仅是链接到Google。所以我尝试下载脚本并使用以下代码，但无法使其工作。有人能发现问题吗？

<script src="build/vrview.min.js"></script>
<script>
  window.addEventListener('load', onVrViewLoad);
  function onVrViewLoad() {
    vrView = new VRView.Player('#vrview', {
    width: '100%',
    height: 480,
    image: '360/coral.jpg',
    is_stereo: true,
    is_autopan_off: true
    });
  }
</script>

作为参考，我得到的错误是

Cannot GET /index.html?image=http://127.0.0.1:61060/360/coral.jpg&is_stereo=true&is_autopan_off=true&

感谢您！希望这不是一个太愚蠢的问题。

- geoff

---

2018年，我也是一样的 :/ - Eduardo A. Fernández Díaz

Answer 1

在（已存档的）Google VRView 上确实缺乏文档信息。

您需要从此分支的VRView存储库中下载所有文件。您可以安全地删除examples文件夹，但要保留其他所有内容。将所有这些文件和文件夹放在站点的子文件夹中。

例如，文件夹结构可以是：

yoursite/index.html <-- Your website
yoursite/ <-- Anything else you want, img/, css/, other root .html files
yoursite/googlevr/ <-- all the files from VRView repo

这将使您具有yoursite/googlevr/build、yoursite/googlevr/images等文件夹，以及googlevr/根目录下的index.html和style.css文件。

完成后，您可以通过您自己的index.html（或该文件夹中的任何其他.html文件）使用.js文件。

<script src="/googlevr/build/vrview.min.js"></script>

请注意，Google VRView现在已存档于Github，他们似乎已停止对此提供任何支持。另外，请注意，由于隐私设置中默认禁用设备方向，因此默认情况下，VR视图在iOS 12.1及以上的设备上无法工作。您的用户需要在其设备设置中手动打开方向传感器。

- zilp

Answer 2

我认为它正在本地主机上寻找图像（在http://127.0.0.1处）。您是否已将其上传到您的网站或者您正在尝试在本地进行操作？如果您是在本地进行操作，那么您必须运行本地服务器。

如果您已将其上传到您的网站，则请尝试使用绝对路径而不是相对路径。

例如：

image: '360/coral.jpg'

尝试：

image: '/360/coral.jpg'

假设文件夹“360”确实位于您网站的根目录中。（同样，如果无法加载播放器，则可以使用绝对路径而不是相对路径来指向vrview.min.js。）

- ledisnomad

---

这是 @caio-brighenti 的回答吗？ - Eduardo A. Fernández Díaz