用AR.js顯示PNG圖像文件（增強現實）

我只想用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="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>

來源

2017-12-02 Benoît de Mijolla

如果圖像是不是你的服務器上，你可能會得到一個錯誤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錯誤。

來源

2017-12-04 08:21:27

用AR.js顯示PNG圖像文件（增強現實）

回答

相關問題