用AR.js显示PNG图像文件（增强现实）

  • Z时代
  • 2024-01-10
  • 分类：问答

我只想用Hiro标记在我的网页浏览器上显示AR.js（增强现实）的PNG文件！但结果是一个黑盒子，我不明白这个问题。用AR.js显示PNG图像文件（增强现实）

谢谢你的帮助 伯努瓦

<!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="/wp-content/uploads/new2022/20220327voicc/214154355.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>

回答：

如果图像是不是你的服务器上，你可能会得到一个错误CORS，这意味着你的网站是不是能得到回应（或者被拒绝）试图使用XHR来获取图像。您可以在框架FAQ以及资​​产管理subpage中阅读更多信息。 TLDR - three.js/aframe不会让您从不安全的主机加载图像。

确保图像在您的服务器上，或在安全的网站上找到图像（这是一个很大的简化，但大多数https://*为我工作）。

A-框架建议使用github作为部署平台，您还可以使用glitch.me

Here是我的小提琴，在那里你可以看到它的不相关的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错误。

以上是 用AR.js显示PNG图像文件（增强现实） 的全部内容， 来源链接： utcz.com/qa/257332.html

回到顶部