Я уже некоторое время следил за React VR, и после недавнего объявления о его готовности к использованию я вскочил на него, радуясь возможности запачкать руки. Хотя настроить его на моем компьютере было довольно просто, я столкнулся с множеством сложных проблем с его запуском на моем устройстве Android с гарнитурой VR в стиле Google Cardboard. Я задокументировал здесь свое решение с надеждой, что другим удастся избежать полуденной борьбы. Я могу подтвердить это только для Windows + Подсистемы Windows для Linux, но методы должны быть подходящими для любой ОС. Я предполагаю, что на вашем устройстве установлен Cardboard.

Если вы еще этого не сделали, прочтите Руководство по началу работы. В результате в вашем браузере будет запущена забавная небольшая комната с шахматной доской для раннего использования. Теперь погрузимся в воду.

Для начала вам нужно открыть нужный порт, чтобы телефон мог подключиться к компьютеру. Вам нужно будет найти методы, как это сделать для вашей ОС. Разрешите трафик на порт 8000 (при необходимости вы можете изменить это, но вам потребуется изменить код позже). Почему 8000, если упаковщик работает на 8081? Вы скоро это узнаете.

Затем установите Chrome Canary на свое устройство Android. Нам это нужно, потому что текущая версия Chrome (57 на момент написания) имеет проблемы с поддержкой WebVR (ужасный черный экран). Однако WebVR не включен по умолчанию, поэтому вам нужно будет включить его с помощью флагов.

Перейдите к chrome://flags на своем устройстве, найдите WebVR и нажмите "Включить".

Chrome попросит перезапустить. Сделай так. Теперь ваше устройство поддерживает WebVR!

Если бы у вас был открыт порт 8081, как я первоначально сделал, открыли новую демонстрацию VR и попытались переключиться в режим VR, вы бы обнаружили большую проблему: WebVR не будет работать на небезопасном источнике! Так и работает упаковщик React VR. Ой ой. Возможно, я не знаю, как запустить упаковщик в безопасном режиме. Так что вместо этого давайте проксируем его, чтобы мы могли.

Я использовал http-proxy, библиотеку узлов, чтобы создать прокси с поддержкой https. Итак, начните с установки через:

npm install -g http-proxy

Затем вам нужно создать несколько сертификатов, чтобы он мог обслуживать их по https. Это будет зависеть от вашей ОС. Следующая команда должна работать с Windows (через WSL), Mac и Linux, хотя я не могу подтвердить для Mac.

openssl req -x509 -newkey rsa:4096 -keyout key.pem -out cert.pem

Запомните установленную вами кодовую фразу, она вам скоро понадобится. Затем создайте файл proxy.js и добавьте этот код, обязательно обновив кодовую фразу тем, что вы установили выше. Запускаем через node proxy.js.

Теперь на вашем телефоне в Chrome Canary перейдите на https://<YOUR MACHINE IP HERE>/vr:8000. Поскольку созданный нами сертификат является самоподписанным, вы увидите экран «Небезопасное соединение». Нажмите Advanced и добавьте исключение.

В идеале на вашем телефоне должна быть такая же демонстрация виртуальной реальности. Нажмите кнопку Просмотр в VR в нижнем левом углу. Если у вас его нет, проверьте еще раз, чтобы убедиться, что WebVR включен, и что вы случайно не переключились на нормальный Chrome (такое бывает).

На этом этапе Chrome может попросить вас установить службы Google VR. Если да, установите его и перезапустите Chrome. Снова попробуйте кнопку «Просмотр в VR».

Если повезет, режим VR включится, и вы сможете начать тестирование в реальной среде VR! Удачного взлома!

Хакерский полдень - это то, с чего хакеры начинают свои дни. Мы часть семьи @AMI. Сейчас мы принимаем заявки и рады обсудить рекламные и спонсорские возможности.

Если вам понравился этот рассказ, мы рекомендуем прочитать наши Последние технические истории и Современные технические истории. До следующего раза не воспринимайте реалии мира как должное!