Я пытаюсь создать приложение дополненной реальности прямо в веб-браузере.Существует очень простое решение с AR.js в 10 строках HTML (https://medium.com/arjs/augmented-reality-in-10-lines-of-html-4e193ea9fdbf).
. Но у меня возникает проблема при попытке импортировать модель Gltf. Она отлично работает на локальном сервере, но когда я загружаюмои файлы на ftp, модель gltf не отображается, вместо этого у меня есть эта ошибка в консоли: browser.js:111 components:gltf-model:warn THREE.GLTFLoader: Unable to parse model.
browser.js:111 components:gltf-model:warn THREE.GLTFLoader: Unable to parse model.
Я очень новичок в веб-разработке и JavaScript, я понятия не имею, гдеэта ошибка и как ее исправить.
Вот ссылка на страницу: https://lesfillesdu9novembre.com/ARWeb/Html/Page.html
А вот и мой код:
<html> <head> <script src="https://aframe.io/releases/0.7.1/aframe.min.js"></script> <script src="https://rawgit.com/jeromeetienne/ar.js/master/aframe/build/aframe-ar.js"></script> <script>THREEx.ArToolkitContext.baseURL = 'https://rawgit.com/jeromeetienne/ar.js/master/three.js/'</script> </head> <body style='margin: 0px; overflow: hidden;'> <a-scene embeded arjs='trackingMethod: best; debugUIEnabled: false;'> <a-assets> <a-asset-item id="car" src="/GLTF/Exterior/Gltf/Exterior_006.gltf"></a-asset-item> </a-assets> <a-gltf-model src="#car" scale="0.01 0.01 0.01" rotation="0 0 0" position="-2.5 0 0" ></a-gltf-model> <a-box position='0 0.5 0' material='opacity: 0.5;'></a-box> <a-marker-camera preset='hiro'></a-marker-camera> </a-scene> </body> </html>
URL вашего ресурса кажется неправильным: https://lesfillesdu9novembre.com/GLTF/Exterior/Gltf/Exterior_006.gltf не возвращает модель gltf, а обычный серый веб-сайт.