文章/答案/技术大牛

发布

社区首页 >问答首页 >用AR.js (增强现实)显示PNG图像文件

问用AR.js (增强现实)显示PNG图像文件
EN

Stack Overflow用户

提问于 2017-12-02 16:42:46

回答 1查看 5.8K关注 0票数 2

我只想用Hiro标记在我的浏览器上显示一个带有AR.js (增强现实)的PNG文件!！但结果是一个黑匣子，我不明白问题所在。

谢谢你帮助Benoit

<!DOCTYPE html>
<html>
<!-- include A-Frame obviously -->
<script src="https://aframe.io/releases/0.6.0/aframe.min.js"></script>
<!-- include ar.js for A-Frame -->
<script src="https://jeromeetienne.github.io/AR.js/aframe/build/aframe-ar.js"></script>
<body style='margin : 0px; overflow: hidden;'>
<a-scene embedded arjs>
    <a-assets>
        <img id="transpImage" src="http://www.icone-png.com/png/13/13081.png">
    </a-assets>
    <a-image width="1" height="1" src="#transpImage"></a-image>
    <a-marker-camera preset='hiro'></a-marker-camera>
</a-scene>
</body>
</html>

augmented-reality

aframe

ar.js

回答 1

Stack Overflow用户

发布于 2017-12-04 08:21:27

TLDR -- three.js/aframe不允许您从不安全的主机加载图像。

如果图像不在您的服务器上，您可能会收到一个CORS错误，这意味着您的网站无法获得响应(或被拒绝)试图使用XHR获取图像。您可以在a帧常见问题和资产管理子页中更多地阅读这方面的内容。

确保图像在您的服务器上，或者在一个安全的网站上找到一个图像(这是一个很大的简化，但大多数https://*对我来说是有用的)。

建议使用github作为部署平台，您也可以使用glitch.me。

这里是我的小提琴，在那里你可以看到它与AR.js无关。

请查看控制台，您应该会看到：

Loading mixed (insecure) display content “http://www.icone-png.com/png/13/13081.png” on a secure page[Learn More]  
three.js:30486:3 components:texture:error `$s` could not be fetched (Error code: undefined; Response: undefined)

确认以上关于CORS错误的所有内容。

票数 2

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/47610133

复制

相似问题

问用AR.js (增强现实)显示PNG图像文件
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问用AR.js (增强现实)显示PNG图像文件EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问用AR.js (增强现实)显示PNG图像文件
EN