Сейчас я работаю с Three.js, Aframe и AR.js.
Я следую примеру Джерома:
https://github.com/jeromeetienne/AR.js/blob/master/three.js/examples/multi-markers/examples/player.html
Я включил его библиотеку в пример своего проекта и пытаюсь выяснить, почему это происходит:
Когда я нахожусь на странице player.html, все работает, консоль не отображает никаких ошибок, только предупреждение:
stop profile.trackingBackend() obsolete function. use .trackingMethod instead
(но я не думаю, что это вызывает проблему)
И затем, когда я нажимаю, чтобы сканировать маркеры, кнопка работает, запускается заданная функция, я перенаправляюсь на веб-страницу scholner.html, но все скрипты импорта получают код ошибки 400 и не загружаются на веб-сайт, поэтому ничего не работает .
Что я сделал: я проверил скрипты с помощью онлайн-инструментов, построчно, попробую скопировать и вставить. Они одинаковы, когда я говорю то же самое, я имею в виду, что на странице learnner.html импортировано на 3 скрипта меньше, чем player.html, общий синтаксис сценариев одинаков на обеих страницах.
Что я заметил: если я пытаюсь получить доступ к веб-странице без параметров в URL-адресе, страница прекрасно работает ... ну, страница дает мне некоторую информацию о параметрах пропусков, но сценарии загружены, но мне нужно варианты: (
Проблема с импортом скриптов. Я думаю, что это вызвано тем, что объект включен в веб-страницу URL, странная вещь, потому что в веб-страницу плеера добавлены некоторые другие вещи, и это работает.
Я использую NodeJS v4.2.6 и NPM v3.5.2 и Express v4.16.4
Вот как я обрабатываю запросы на эти 2 страницы в NodeJS:
app.get('/multiMarkers4', function (req, res) {
res.render( pathView + 'player.ejs', { pageName:"player", errorMsg:"" });
});
app.get('/learner', function (req, res) {
res.render( pathView + 'learner.ejs', { pageName:"learner", errorMsg:"" });
});
Да, я изменил файлы с html на ejs и переместил их в / views (только эти 2 learnner.ejs и player.ejs)
Для скриптов я создал несколько конкретных путей в Node:
app.use('/three', express.static(__dirname + '/three.js'));
Веб-страницы scholner.ejs и player.ejs имеют почти тот же код, что и в репозитории Jerome's GitHub, единственная измененная вещь - это скрипты импорта:
Это в player.ejs и работает
<!-- three.js library -->
<script src='/three/examples/vendor/three.js/build/three.js'></script>
<script src='/three/examples/vendor/three.js/examples/js/libs/stats.min.js'></script>
<!-- jsartookit -->
<script src='/three/vendor/jsartoolkit5/build/artoolkit.min.js'></script>
<script src='/three/vendor/jsartoolkit5/js/artoolkit.api.js'></script>
<!-- aruco -->
<script src='/three/vendor/js-aruco/src/svd.js'></script>
<script src='/three/vendor/js-aruco/src/posit1.js'></script>
<script src='/three/vendor/js-aruco/src/cv.js'></script>
<script src='/three/vendor/js-aruco/src/aruco.js'></script>
<script src='/three/src/threex/threex-aruco/threex-arucocontext.js'></script>
<script src='/three/src/threex/threex-aruco/threex-arucodebug.js'></script>
<!-- include threex.artoolkit -->
<script src='/three/src/threex/threex-artoolkitsource.js'></script>
<script src='/three/src/threex/threex-artoolkitcontext.js'></script>
<script src='/three/src/threex/threex-artoolkitprofile.js'></script>
<script src='/three/src/threex/threex-arbasecontrols.js'></script>
<script src='/three/src/threex/threex-armarkercontrols.js'></script>
<script src='/three/src/threex/threex-armarkerhelper.js'></script>
<script src='/three/src/threex/threex-arsmoothedcontrols.js'></script>
<script>THREEx.ArToolkitContext.baseURL = '';</script>
<script src='/three/examples/multi-markers/threex-armultimarkerutils.js'></script>
<script src='/three/examples/multi-markers/threex-armultimarkercontrols.js'></script>
<script src='/three/examples/multi-markers/threex-armultimarkerlearning.js'></script>
<script src='/three/examples/multi-markers/examples/threex-screenasportal/threex-screenasportal.js'></script>
<script>THREEx.ScreenAsPortal.baseURL = 'threex-screenasportal/';</script>
Когда я на странице player.ejs, URL-адрес:
https://x.y.z/multiMarkers4#%7B"trackingBackend"%3A"artoolkit"%7D
Когда я на странице player.ejs, консольный журнал в devTools:
THREE.WebGLRenderer 86
threex-artoolkitprofile.js:145 stop profile.trackingBackend() obsolete function. use .trackingMethod instead
ARjs.Profile.trackingBackend @ threex-artoolkitprofile.js:145(This is that warning,the rest of the output is just simple output)
artoolkit.min.js:1 Allocated videoFrameSize 1228800
artoolkit.min.js:1 Pattern detection mode set to 1.
artoolkit.min.js:1 Pattern ratio size set to 0.500000.
Это в Learner.EJS, и он работает без параметров в URL:
<!-- three.js library -->
<script src='/three/examples/vendor/three.js/build/three.js'></script>
<script src='/three/examples/vendor/three.js/examples/js/libs/stats.min.js'></script>
<!-- jsartookit -->
<script src='/three/vendor/jsartoolkit5/build/artoolkit.min.js'></script>
<script src='/three/vendor/jsartoolkit5/js/artoolkit.api.js'></script>
<!-- aruco -->
<script src='/three/vendor/js-aruco/src/svd.js'></script>
<script src='/three/vendor/js-aruco/src/posit1.js'></script>
<script src='/three/vendor/js-aruco/src/cv.js'></script>
<script src='/three/vendor/js-aruco/src/aruco.js'></script>
<script src='/three/src/threex/threex-aruco/threex-arucocontext.js'></script>
<script src='/three/src/threex/threex-aruco/threex-arucodebug.js'></script>
<!-- include threex.artoolkit -->
<script src='/three/src/threex/threex-artoolkitsource.js'></script>
<script src='/three/src/threex/threex-artoolkitcontext.js'></script>
<script src='/three/src/threex/threex-artoolkitprofile.js'></script>
<script src='/three/src/threex/threex-arbasecontrols.js'></script>
<script src='/three/src/threex/threex-armarkercontrols.js'></script>
<script src='/three/src/threex/threex-armarkerhelper.js'></script>
<script src='/three/src/threex/threex-arsmoothedcontrols.js'></script>
<script>THREEx.ArToolkitContext.baseURL = '';</script>
<script src='/three/examples/multi-markers/threex-armultimarkerutils.js'></script>
<script src='/three/examples/multi-markers/threex-armultimarkercontrols.js'></script>
<script src='/three/examples/multi-markers/threex-armultimarkerlearning.js'></script>
Когда я на странице Learner.ejs, URL-адрес:
https://x.y.z/learner?%7B"backURL"%3A"https%3A%2F%2Fx.y.z%2FmultiMarkers4%23%257B%2522trackingBackend%2522%253A%2522artoolkit%2522%257D"%2C"trackingBackend"%3A"artoolkit"%2C"markersControlsParameters"%3A%5B%7B"type"%3A"pattern"%2C"patternUrl"%3A"https%3A%2F%2Fx.y.z%2FmultiMarkers4patts%2Fhiro.patt"%7D%2C%7B"type"%3A"pattern"%2C"patternUrl"%3A"https%3A%2F%2Fx.y.z%2FmultiMarkers4patts%2Fkanji.patt"%7D%2C%7B"type"%3A"pattern"%2C"patternUrl"%3A"https%3A%2F%2Fx.y.z%2FmultiMarkers4patts%2Fa.patt"%7D%2C%7B"type"%3A"pattern"%2C"patternUrl"%3A"https%3A%2F%2Fx.y.z%2FmultiMarkers4patts%2Fb.patt"%7D%2C%7B"type"%3A"pattern"%2C"patternUrl"%3A"https%3A%2F%2Fx.y.z%2FmultiMarkers4patts%2Fc.patt"%7D%2C%7B"type"%3A"pattern"%2C"patternUrl"%3A"https%3A%2F%2Fx.y.z%2FmultiMarkers4patts%2Ff.patt"%7D%5D%7D
Как я уже сказал, для https://x.y.z/learner включены скрипты, но у меня нет вариантов, и они мне нужны
Когда я на странице Learner.ejs, консольный журнал в devTools имеет ответ 400 от сервера на все сценарии:
Failed to load resource: the server responded with a status of 400 (Bad Request)
Как я могу импортировать эти сценарии и сохранить параметры, чтобы я мог изучить область маркера?