在工作网站后端托管时，全景图不会加载到 AFrame 360 Image 脚本中
Posted
技术标签:
【中文标题】在工作网站后端托管时，全景图不会加载到 AFrame 360 Image 脚本中【英文标题】：Panorama won't load in AFrame 360 Image script when hosted on work website backend 【发布时间】：2019-01-14 20:52:39 【问题描述】：我正在为工作托管一个 360 全景图，当文件托管在 Imgur 上时，我已经使用 AFrame 360 Image 让它工作，但我需要尝试让它在我的作品网站上托管，以支持更大的文件大小和易于访问。目前脚本加载但没有图像出现，这发生在网站上托管的任何图像。为什么会这样？
我尝试了所有不同大小和扩展名的文件，尽管可以通过直接链接访问，但它们都没有加载到脚本中。
<!DOCTYPE html>
<html>
<head>
<script src="https://aframe.io/releases/0.8.0/aframe.min.js"></script>
</head>
<body>
<a-scene>
<a-sky src="https://mapping.hdc.govt.nz/photos/LowStitch.jpg" rotation="0 0 0"></a-sky>
</a-scene>
</body>
</html>
我希望它与使用 Imgur 托管的图像时一样工作，但我得到的只是右下角带有 VR 徽标的白屏。
【问题讨论】：
【参考方案1】：查看控制台日志 -
访问“https://mapping.hdc.govt.nz/photos/LowStitch.jpg”处的图像 ... 已被 CORS 策略阻止：请求的资源上不存在“Access-Control-Allow-> Origin”标头。
它显示了一个 CORS（Cross-origin Resource Sharing）错误。这意味着服务器没有提供带有aframe.io 的 CORS 标头的文件 - 因此拒绝该资源。尝试将网站放在与照片相同的目录中。或者就header联系服务器管理员。
有关 CORS 的详细信息 - here 是 H.Pauwelyn 在框架中对 CORS 的明确回答。
【讨论】：
【参考方案2】：资产需要 CORS 标头才能从您的网络主机跨域加载：https://aframe.io/docs/0.8.0/introduction/faq.html#why-does-my-asset-e-g-image-video-model-not-load
【讨论】：
以上是关于在工作网站后端托管时，全景图不会加载到 AFrame 360 Image 脚本中的主要内容，如果未能解决你的问题，请参考以下文章
云原生全景图之六 | 托管 Kubernetes 和 PaaS 解决什么问题