Задача хоть интересная, но по объему получилась не маленькая. Разбита на 9 частей, 6 из которых уже готовы и упакованы в 3 статьи. В каждой статье будет много принтскринов и кусков кода(все убрано под спойлеры). Если пропущу какие-то детали – заранее извиняюсь, пишите в личку или комментарии, некоторые особенности мог просто опустить как само собой разумеющееся или просто вылетело из головы.
Части и статусы на момент публикации:
Подготовительная (реализована).
Сигнализация Websocket (реализована).
Настройка WebRTC Connection + DataChannel (реализована).
Настройка WebRTC Media streaming (реализована).
Настройка управления камерой (реализована).
Настройка управления манипулятором (реализована).
Перенос на ROS (в процессе).
Работа через Интернет (в процессе).
Настройка передвижения (не взята).
А вот то, что мы получим к концу 6 части:
Disclaimer 1.
Некоторые участки кода и решения в этой серии статей могут вызвать неоднозначные чувства у читателей, прошу отнестись к этим особенностям с пониманием, так как:
1. Основная цель – это демонстрация, реализация Proof of Concept, некоторые элементы заведомо не реализовывались, дабы сократить объем работы и материала для публикации.
2. Unity/C#/Python у меня на начальном уровне, а с некоторыми вещами, как с корутинами в python и c#, вообще столкнулся впервые на этапе приготовления этого блюда.
3. Переключаться между 4-мя ЯП достаточно тяжко для моей скороварки, мне и самому плакать хотелось от того, что я наделал, но с какого-то момента я уже просто не мог остановиться, простите.
Часть 1. Подготовительная
Проведя быстрый аудит компонентов, которые у меня были в наличии, я остановился на решении с роботизированной рукой-манипулятором подключенной к RPI3B+, и решил выстроить весь процесс вокруг идеи управления этим манипулятором из VR-приложения, с возможностью быстро доработать это решение управлением не только из локальной сети, но и через Интернет.
Это можно сделать реализовав клиент-серверную архитектуру для взаимодействия компонентов, но тогда получается минус в использовании сервера как единой точки консолидации трафика и будет дополнительная задержка между VR и Манипулятором, поэтому решено использовать WebRTC в качестве решения для P2P трафика, и Websocket для сигнализации WebRTC, еще один плюс WebRTC – элегантный механизм прохода за NAT с помощью stun/turn-серверов в будущем.
В WebRTC для обмена данными существует DataChannel, который можно использовать для передачи данных управления на сервоприводы и MediaStreams для передачи видео/аудио контента, что мы и будем использовать для трансляции видео из USB-камеры в приложение.
Websocket отлично подходит для реализации сигнализации между WebRTC-пирами, можно, конечно, использовать и REST для обмена сигнализацией, но минус REST – периодичность опроса конечной точки при инициации подключения. Т.е. когда мы захотим инициировать новое подключение к манипулятору, нам потребуется ждать очередного периода опроса для обмена контекстом WebRTC.
Таким образом у нас получается комплект из 3-х основных компонентов – Сервер сигнализации для обмена контекстом WebRTC, Исполнительный компонент (RPI-хост) который будет принимать управляющие сигналы для сервоприводов и транслировать видеопоток, и Управляющий компонент(VR-приложение), в котором мы принимаем видеопоток, и из которого мы будем управлять манипулятором отправляя сообщения на RPI-хост. Так же, мы реализуем дублирующий управляющий компонент с помощью HTML/JS, он нам поможет в поэтапной реализации и отладке.
Сервер сигнализации реализуем с помощью SpringBoot, на стороне исполнительного компонента на RPI будем использовать приложение на Python, управляющий компонент сделаем с помощью Unity XR, так же на стороне сервера сигнализации продублируем управляющий компонент с помощью стандартными средствами веб – html-bootstrap-js-jquery.
Disclaimer 2
Вообще, все что касается робототехники нужно делать с использованием ROS на стороне исполнительного компонента, но мне было интересно посмотреть на альтернативу попроще, а уже потом перенести на ROS. Как говорится – все познается в сравнении.
Используемые компоненты:
VR-гарнитура с контроллерами, я буду использовать Oculus Quest 2.
Кабель USB Type-C 1-2м, который будем использовать для подключения VR-гарнитуры к Unity для тестирования и отладки.
Raspberry Pi 3B+ с БП.
Плата PCA9685, это плата расширения, она соединяется I2C интерфейсом с RPI и позволяет управлять 16-ю ШИМ сервоприводами.
Кронштейн-подвес для SG90 и 2 сервопривода SG90, для вращения подвеса камеры.
USB-веб-камера, будет использоваться для трансляции видео в VR.
Манипулятор(6Dof Arm MG996R/YF-6125MG у меня такой), собственно тот манипулятор, которым мы будем управлять из VR.
Комплект соединительных проводов Мама-Папа(40см.). У моих сервоприводов стоковые кабели коротки и их не дотянуть до платы PCA9685.
Блок питания 220V – 5V. Для запитывания серво.
Основание для фиксации компонентов (манипулятор, RPI, БП, подвес для камеры), у меня это лишняя часть пластикового стеллажа, куда смонтированы все компоненты.
(желательно) Роутер на OWRT, если будете проводить тесты по RTT/Jitter.
(желательно) Более-менее прямые руки, но и с "не очень" получится с нескольких попыток.
Требуемая экспертиза:
Начальные знания по Linux.
Начальные знания по Python.
Начальные знания по Java и SpringBoot.
Начальные знания по Unity и C#.
Начальные знания по HTML/Bootstrap/JS/JQuery.
Начальные знания по Websocket и WebRTC.
Основные операции будут проводиться на рабочей станции под Win10, периодически переключаясь на Ubuntu WSL для работы с RPI. На Win10 установлены:
Eclipse IDE, для SpringBoot.
Unity + MS Visual Studio, для VR части.
Oculus Client, нужен для Oculus Link.(Возможно потребуются драйверы ADB для Oculus, но у меня они уже были установлены ранее).
Исполнительный компонент
Для начала собираем минимальный исполнительный комплект – подвес камеры с SG90 и соединяем его с платой PCA9685(я разобрал свою USB-камеру, т.к. корпус был большой и неудобный).
В плату PCA9685 сервы SG90 устанавливаем в порты 0 и 1. Они будут отвечать за ротацию камеры по осям(поворот головы в VR-гарнитуре). Далее делаем установку камеры на кронштейн на основе за местом, где планируется манипулятор. Кабели от разъемов привода удлиняем с помощью дополнительных кабелей «Папа-Мама».
подвес:
Делаем соединение платы PCA9685 и RPI3B+:
GND - Pin-6
SCL - GPIO-3(Pin5)
SDA - GPIO-2(Pin3)
VCC - Pin1
V+ - Pin4Питание для серво должно идти через отдельную клемму на PCA9685, но до 6 части мы будем использовать только 2 серво SG90 и брать питание с RPI можем напрямую.
Так же рекомендую использовать обычный светодиод подключенный к RPI для проведения маленького наглядного тестирования работы RPI и скриптов (Pin 39-40) (как же можно обойтись без мигания светодиодом).
Далее, подготавливаем RPI, заливаем ОС с помощью RPI Imager(RPI OS Light x64). После успешной заливки делаем стандартные апдейт/апгрейд apt и личные предпочтения по настройке системы(ssh-ключи, samba и т.д.).
Для работы с интерфейсом I2C в RPI нам нужен пакет пакет с i2c-tools:
sudo apt install i2c-tools -y
Заходим в raspi конфиг и включаем поддержку I2C:
sudo raspi-config
Interface Options → <Enable I2C>
reboot
Проверяем I2C:
i2cdetect -y 1
Должны получить такое:
0 1 2 3 4 5 6 7 8 9 a b c d e f
00: -- -- -- -- -- -- -- --
10: -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
20: -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
30: -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
40: 40 -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
50: -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
60: -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
70: 70 -- -- -- -- -- -- –Это значит все норм и плата обнаружена.
Далее, для работы с серво через PCA9685 из Python нам понадобится pip3-пакеты, поэтому ставим pip3:
sudo apt-get install python3-pip
И ставим сами пакеты:
pip3 install adafruit-circuitpython-pca9685
pip3 install adafruit-circuitpython-motorkit
Установка пакетов глобально это конечно плохой тон, но тут мы срежем углы, т. к. все равно все будет на ROS.
Теперь можем проверить работу маленьким скриптом:
nano /home/pi3/shared/testpi3b/part0.py
part0.py
import RPi.GPIO as GPIO
import time
import busio
from board import SCL, SDA
from adafruit_motor import servo
from adafruit_pca9685 import PCA9685
GPIO.setmode(GPIO.BCM)
GPIO.setup(21, GPIO.OUT)
i2c = busio.I2C(SCL, SDA)
pca = PCA9685(i2c)
pca.frequency = 50
servoX = servo.Servo(pca.channels[0], min_pulse=500, max_pulse=2400)
print("Simple testing")
try:
for i in range(3):
print("Blink")
GPIO.output(21,True)
servoX.angle = 0
time.sleep(1)
GPIO.output(21,False)
servoX.angle = 180
time.sleep(1)
except KeyboardInterrupt:
GPIO.cleanup()
print("Test done")
GPIO.cleanup()PS: Работа с серво по ШИМ имеет свои особенности, поэтому рекомендую сначала потратить часик на чтение материала по теме.
Если все сделали правильно - то светодиод моргнет 3 раза и сервомотор в 0-порту PCA9685 3 раза сделает поворот 0-180 градусов. По деталям работы из Python с PCA9685 можно почитать тут, с Rpi.GPIO тут. На этом подготовительная часть с RPI-хостом закончена.
Серверный компонент
Следующим пунктом будет подготовка и установка SSL сертификатов для работы websocket-over-ssl (можно конечно обойтись без SSL, но мне хотелось сразу решить этот вопрос и получить возможность тестировать видео в браузере).
Генерируем новый самоподписанный сертификат(я это делаю из под WSL Ubuntu 20):
sudo openssl req -x509 -nodes -days 1825 -newkey rsa:2048 -keyout ./ssl/ssl-selfsigned.key -out ./ssl/ssl-selfsigned.crt
... отвечаем на все вопросы, указываем IP-хоста на котором будет крутиться сервер. И сразу же переводим его в формат PKS#12:
openssl pkcs12 -export -in ./ssl/ssl-selfsigned.crt -inkey ./ssl/ssl-selfsigned.key -out ./ssl/ssl-selfsigned.p12
Файлы сертификатов копируем на Win10, проводим установку сертификата на Win10.
Теперь сделаем заготовку для сервера сигнализации. Делаем новый SpringBoot проект через Spring Initializr для сервера сигнализации, нам потребуются зависимости:
Зависимости:
implementation 'org.springframework.boot:spring-boot-starter-security'
implementation 'org.springframework.boot:spring-boot-starter-thymeleaf'
implementation 'org.springframework.boot:spring-boot-starter-web'
implementation 'org.springframework.boot:spring-boot-starter-websocket'
implementation 'org.webjars:webjars-locator-core'
implementation 'org.webjars:sockjs-client:1.0.2'
implementation 'org.webjars:bootstrap:3.3.7'
implementation 'org.webjars:jquery:3.1.1-1'
compileOnly 'org.projectlombok:lombok'
developmentOnly 'org.springframework.boot:spring-boot-devtools'
annotationProcessor 'org.projectlombok:lombok'
testImplementation 'org.springframework.boot:spring-boot-starter-test'
testImplementation 'org.springframework.security:spring-security-test'Делаем базовую настройку работы на порту 9000 с нашим сертификатом:
application.yml:
server:
port: 9000
ssl:
key-store: classpath:ssl-selfsigned.p12
key-store-password:
keyStoreType: PKCS12Подавляем идентификацию/аутентификацию с использованием SecurityFilterChain:
SecurityConfiguration.java
@Configuration
public class SecurityConfiguration{
@Bean
SecurityFilterChain securityFilterChain(HttpSecurity http)
throws Exception {
http
.authorizeHttpRequests((requests) -> requests
.requestMatchers("/", "/**", "/main", "/main/**")
.permitAll()
);
return http.build();
}
}Делаем простейший контроллер, страницу для HTML и JS-скрипт:
SimpleController.java
@Controller
public class SimpleController {
@GetMapping("/main")
public String roboPage() {
return "main";
}
}main.html
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Robo WS+RTC:</title>
<!-- Head bootstrap as a fragment -->
<div th:insert="~{fragments :: bootstraphead}"></div>
<script src="/robo.js"></script>
</head>
<body>
<div id="main-content" class="container">
<div class="row-md-6">
<p>Part 0</p>
</div>
</div>
</body>
</html>fragments.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<body>
<!-- Bootstraphead CSS -->
<div th:fragment="bootstraphead">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.4.1/dist/css/bootstrap.min.css"
integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js"
integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"
integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js"
integrity="sha384-oBqDVmMz9ATKxIep9tiCxS/Z9fNfEXiDAYTujMAeBAsjFuCZSmKbSSUnQlmh/jp3" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.min.js"
integrity="sha384-cuYeSxntonz0PPNlHhBs68uyIAVpIIOZZ5JqeqvYYIcEL727kskC66kF92t6Xl2V" crossorigin="anonymous"></script>
</div>
</body>
</html>Файл robo.js - пока оставим пустой, он нам потребуется дальше.
Структура проекта:
Такая настройка позволит работать через HTTPS и не требует ввода логина/пароля при соединении(нам это пока не требуется). Теперь запускаем в BootDashboard и проверяем в браузере(https://<ip>:9000/main), что страница открывается успешно через https.
Управляющий компонент(Unity VR)
И последний подготовительный этап - сделаем базовое VR-приложение. Создаем новый проект Unity. Для начала у нас должен быть установлен Unity Hub, Oculus Client, и IDE для C#. Через Unity Hub устанавливаем Editor (2021.3.19f1). Создаем новый проект (3D Core). После загрузки проекта установим XR Plugin Managment и сделаем стартовые настройки для XR:
настройки(много принтскринов):
Давайте дальше добавим еще один компонент - XR Interaction Toolkit, который отвечает за взаимодействие с элементами сцены с помощью шлема и контроллеров.
XR Interaction Toolkit
После установки импортируем Starter Assets, этот ассет поможет в освоении базового взаимодействия с элементами сцены, там есть хорошие префабы и DemoScene для экспериментов.
Теперь добавим готовые пресеты из XR Interaction Toolkit в наш проект, для этого зайдем в директорию Samples → XR Interaction Toolkit → 2.2.0 → Starter Assets и увидим там 8 файлов пресетов для разного типа взаимодействия Scene, добавим их все.
Пресеты:
Теперь нам нужно сделать минимальную сцену-окружение для дальнейших тестов. Добавляем простой Panel Ground. В него добавляем Teleportation Area, и простой материал с цветом на наш пол.
Окружение:
Создаем 2 Empty объекта контейнера для префабов левого и правого контроллера, которые разворачиваем на 180 по «Y», и в каждый из них добавляем префаб модели контроллера из Samples.
Подключаем Quest2 по USB к рабочей станции и подключаемся к Oculus Link. Теперь если запустить в Unity проект (Play) по идее вы попадаете в нашу дефолтную сцену, можете крутить головой в окулусе, телепортироваться по ground, видеть контроллеры с красными лазерами.
Если что-то не будет получаться с Unity XR, смотрим видео тут(ссылка).
Подготовка закончена, по окончании этого этапа у вас есть:
Собранный стенд с подвесом камеры.
Заготовка сервера сигнализации и управления из веб.
Заготовка для исполнительного компонента (RPI-хоста).
Заготовка для управляющего компонента (VR-приложения).
Часть 2. Сигнализация Websocket
Теперь можем приступить к связыванию компонентов с помощью сервера сигнализации.
Основные сущности для сигнализации:
userId/toUserId – идентификаторы пользователей(RPI-хост, VR-клиент, браузерный клиент).
тип сообщения исходя из описания WebRTC→ OFFER, ANSWER, ICE
наши типы процесса установления соединения → LOGIN, NEWMEMBER
data – доп. поле для служебной информации установления UUID.
payload – собственно сами offer/answer/ice из WebRTC в виде json.
Cервер сигнализации
Для работы по Websocket с WebRTC нам нужно реализовать модель сообщения:
SignalData.java
@Data
public class SignalData {
private String userId;
private SignalType type;
private String data;
private JsonNode payload;
private String toUserId;
}SignalType.java
public enum SignalType {
LOGIN,
USERID,
OFFER,
ANSWER,
ICE,
NEWMEMBER
}сделать хендлер конфигурации:
SignalingConfiguration.java
@Configuration
@EnableWebSocket
public class SignalingConfiguration implements WebSocketConfigurer{
@Override
public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {
registry.addHandler(new SignalingHandler(), "/robopi_webrtc");
}
}и хендлер самих сообщений сигнализации:
SignalingHandler.java
@Slf4j
public class SignalingHandler extends TextWebSocketHandler {
final ObjectMapper mapper = new ObjectMapper();
List<WebSocketSession> sessions = new LinkedList<WebSocketSession>();
ConcurrentHashMap<String,WebSocketSession> sessionMap = new ConcurrentHashMap<String,WebSocketSession>();
@Override
protected void handleTextMessage(WebSocketSession session,
TextMessage message) throws Exception {
mapper.configure(JsonParser.Feature.ALLOW_UNQUOTED_FIELD_NAMES, true);
final String msg = message.getPayload();
SignalData sigData = mapper.readValue(msg, SignalData.class);
if(sigData.getType().equals(SignalType.LOGIN)){
var sigResp = new SignalData();
var userId = UUID.randomUUID().toString();
sigResp.setUserId("SIGNALLING_SERVER");
sigResp.setType(SignalType.USERID);
sigResp.setData(userId);
sessionMap.put(userId, session);
session.sendMessage(new TextMessage(mapper.writeValueAsString(sigResp)));
return ;
}
else if(sigData.getType().equals(SignalType.NEWMEMBER)) {
sessionMap.values().forEach(a -> {
var sigResp =new SignalData();
sigResp.setUserId(sigData.getUserId());
sigResp.setType(SignalType.NEWMEMBER);
try {
if(a.isOpen()) a.sendMessage(
new TextMessage(mapper.writeValueAsString(sigResp))
);
}
catch(Exception e) {
log.info("Error Sending message:", e);
}
});
return ;
}
else if(sigData.getType().equals(SignalType.OFFER)) {
var sigResp = new SignalData();
sigResp.setUserId(sigData.getUserId());
sigResp.setType(SignalType.OFFER);
sigResp.setData(sigData.getData());
sigResp.setPayload(sigData.getPayload());
sigResp.setToUserId(sigData.getToUserId());
sessionMap.get(sigData.getToUserId()).sendMessage(
new TextMessage(mapper.writeValueAsString(sigResp))
);
}
else if(sigData.getType().equals(SignalType.ANSWER)) {
var sigResp = new SignalData();
sigResp.setUserId(sigData.getUserId());
sigResp.setType(SignalType.ANSWER);
sigResp.setData(sigData.getData());
sigResp.setPayload(sigData.getPayload());
sigResp.setToUserId(sigData.getToUserId());
sessionMap.get(sigData.getToUserId()).sendMessage(
new TextMessage(mapper.writeValueAsString(sigResp))
);
}
else if(sigData.getType().equals(SignalType.ICE)) {
var sigResp = new SignalData();
sigResp.setUserId(sigData.getUserId());
sigResp.setType(SignalType.ICE);
sigResp.setData(sigData.getData());
sigResp.setPayload(sigData.getPayload());
sigResp.setToUserId(sigData.getToUserId());
sessionMap.get(sigData.getToUserId()).sendMessage(
new TextMessage(mapper.writeValueAsString(sigResp))
);
}
}
@Override
public void afterConnectionEstablished(WebSocketSession session)
throws Exception {
sessions.add(session);
super.afterConnectionEstablished(session);
}
@Override
public void afterConnectionClosed(WebSocketSession session, CloseStatus closeStatus)
throws Exception {
sessions.remove(session);
super.afterConnectionClosed(session, closeStatus);
}
}PS – в хендлер сообщений сигнализации лучше добавить логирование всех сообщений в websocket, это упростит трейс обмена сообщениями.
Для браузерной части – дополняем наш main.html новыми элементами: соединение с websocket-сервером, отправка запроса на UUID, и NEWMEMBER Info:
main.html
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Robo WS+RTC:</title>
<link rel="icon" href="data:;base64,iVBORw0KGgo=">
<!-- Head bootstrap as a fragment -->
<div th:insert="~{fragments :: bootstraphead}"></div>
<script src="/robo.js"></script>
</head>
<body>
<div id="main-content" class="container">
<div class="row-md-6">
<label for="username">User id:</label>
<span id="username">unknown</span>
</div>
<div class="row-md-6">
<form class="form-inline">
<div class="form-group">
<label for="connect">WebSocket connection:</label>
<button id="connect" class="btn btn-primary" type="submit">Connect</button>
<button id="disconnect" class="btn btn-secondary" type="submit">Connect</button>
</div>
</form>
</div>
<div class="row-md-6">
<form class="form-inline">
<button id="login" class="btn btn-primary" type="submit">Login</button>
</form>
</div>
<div class="row-md-6">
<form class="form-inline">
<button id="newmember" class="btn btn-primary" type="submit">New member info</button>
</form>
</div>
</div>
</body>
</html>Формируем скрипт robo.js для обработки соединения:
robo.js
var connection;
var userId = 'unknown';
function connect(){
connection = new WebSocket('wss://' + window.location.host + '/robopi_webrtc');
console.log("Connsection sucsess");
connection.onmessage = function(msg) {
var resp = JSON.parse(msg.data);
if(resp.type == 'USERID'){
console.log();
userId = resp.data;
document.getElementById("username").textContent = userId;
}
if(resp.type == 'NEWMEMBER'){
if(userId != resp.userId){
console.log(resp);
}
}
if(resp.type == 'OFFER'){
if(userId != resp.userId){
console.log(resp);
}
}
if(resp.type == 'ICE'){
if(userId != resp.userId){
console.log(resp);
}
}
if(resp.type == 'ANSWER'){
if(userId != resp.userId){
console.log(resp);
}
}
}
}
function login() {
connection.send(JSON.stringify({'userId' : '', 'type' : 'LOGIN', 'data' : '' , 'toUserId' : ''}));
}
function newmember() {
connection.send(JSON.stringify({'userId' : userId, 'type' : 'NEWMEMBER', 'data' : '' , 'toUserId' : ''}));
}
$(function () {
$("form").on('submit', function (e) {
e.preventDefault();
});
$( "#connect" ).click(function() { connect(); });
$( "#login" ).click(function() { login(); });
$( "#newmember" ).click(function() { newmember(); });
});В итоге, мы можем зайти на страницу https://<ip>:9000/main c разных браузеров и проверить:
должно получится так:
Исполнительный компонент(Python-скрипт на RPI)
В Python для работы с вебсокетами используем библиотеку websockets,
pip3 install websockets
а так же нам понадобиться asynco, ssl и json для работы с сообщениями:
part1.py
import asyncio
import websockets
import json
import ssl
from websockets import WebSocketClientProtocol
async def wsconsume(wsurl: str) -> None:
ssl_context = ssl.SSLContext()
async with websockets.connect(wsurl, ssl=ssl_context) as websocket:
await websocket.send(json.dumps({"userId": "", "type": "LOGIN", "data": "", "payload": "", "toUserId": ""}))
await wsconsumer_handler(websocket)
async def wsconsumer_handler(websocket: WebSocketClientProtocol) -> None:
local_user_id = ""
async for message in websocket:
msg = json.loads(message)
if msg.get("type") == 'USERID' and local_user_id != msg.get("userId"):
local_user_id = msg.get("data")
print("SET UID: " + local_user_id)
await websocket.send(json.dumps({"userId": local_user_id, "type": "NEWMEMBER", "data": "",
"payload": "", "toUserId": ""}))
if msg.get("type") == 'OFFER' and local_user_id == msg.get("toUserId"):
print("Handling offer: " + str(msg.get("payload")))
if msg.get("type") == 'ICE' and local_user_id == msg.get("toUserId"):
print("ICE INCOMING")
if msg.get("type") == 'ANSWER' and local_user_id == msg.get("toUserId"):
print("ANSWER INCOMING")
async def main():
task = asyncio.create_task(wsconsume('wss://192.168.10.146:9000/robopi_webrtc'))
await task
if __name__ == '__main__':
loop = asyncio.get_event_loop()
try:
loop.run_until_complete(main())
except KeyboardInterrupt:
loop.stop()
passТеперь мы можем попробовать подсоединиться и из браузера и из RPI и оправить NEWMEMBER инфо между браузером и Python, проверяем результат в консоли браузера и логе сервера:
проверяем:
Управляющий компонент(Unity VR)
Для работы с вебсокетом из Unity используем библиотеку WebSocketSharp, для этого сначала поставим NuGetForUnity, а потом оттуда делаем установку WebSocketSharp.
установка:
Далее реализуем небольшой UI: cоздаем Empty Object с названием Connection Panel, становим его параметры Rect Transform и наполняем его компонентами:
параметры Rect Transform и компоненты:
После этого размещаем в Connection Panel несколько элементов:
элементы:
Text → "WS Header"
Text → "UUID" (на элементе указываем тэг - «uuid»)
Button → "Connect WS"
Button → "Disonnect WS"
Button → "Login"
Button → "Newmember"
Так же создаем Empty объект хендлер для скрипта → "Connection handler"
Теперь создаем новый C# скрипт, который будет ядром наших соединений websocket и webrtc:
Connection.cs
using System;
using System.Collections.Concurrent;
using UnityEngine;
using WebSocketSharp;
public class Connection : MonoBehaviour
{
private GameObject uuid;
private WebSocket ws;
private ConcurrentQueue<string> incomingWebsocketMessages;
private string userId = "unknown";
void Start()
{
uuid = GameObject.FindGameObjectWithTag("uuid");
incomingWebsocketMessages = new ConcurrentQueue<string>();
ws = new WebSocket("wss://192.168.10.146:9000/robopi_webrtc");
ws.SslConfiguration.EnabledSslProtocols = System.Security.Authentication.SslProtocols.Tls12;
ws.OnOpen += (sender, e) =>
{
Debug.Log("OPEN WEBSOCKET");
};
ws.OnMessage += (sender, e) =>
{
if (e.IsText)
{
incomingWebsocketMessages.Enqueue(e.Data);
Debug.Log("Incoming websocket message:" + e.Data);
}
};
ws.OnClose += (sender, e) => {
Debug.Log("CLOSE WEBSOCKET:" + e.Reason);
};
}
void Update()
{
if (incomingWebsocketMessages.TryDequeue(out var wsmessage))
{
var answer = JsonUtility.FromJson<WSMessage<string>>(wsmessage);
if (answer.type.Equals("USERID") && !answer.data.Equals(userId))
{
userId = answer.data;
SetUserId(userId);
}
else if (answer.type.Equals("NEWMEMBER") && !answer.userId.Equals(userId))
{
}
else if (answer.type.Equals("OFFER") && !answer.userId.Equals(userId))
{
}
else if (answer.type.Equals("ICE") && !answer.userId.Equals(userId))
{
}
else if (answer.type.Equals("ANSWER") && !answer.userId.Equals(userId))
{
}
}
}
public void ConnectWebsocket()
{
ws.Connect();
}
public void DisconnectWebsocket()
{
ws.Close();
}
public void LoginWebsocket()
{
var hello = new WSMessage<string>
{
userId = "",
type = "LOGIN",
data = "",
payload = "",
toUserId = ""
};
ws.Send(JsonUtility.ToJson(hello));
}
public void SendNewmember()
{
var newmember = new WSMessage<string>
{
userId = userId,
type = "NEWMEMBER",
data = "",
payload = "",
toUserId = ""
};
ws.Send(JsonUtility.ToJson(newmember));
}
void SetUserId(string userId)
{
uuid.GetComponent<UnityEngine.UI.Text>().text = userId;
}
}
[Serializable]
public class WSMessage<T>
{
public string userId;
public string type;
public string data;
public T payload;
public string toUserId;
}Готовый скрипт аттачим на объект Connection handler, а его в свою очередь на каждый Button, и выбираем соответствующий метод для этой кнопки:
так:
По нажатию на кнопку вызывается метод из нашего скрипта, происходит соединение, отправка/прием сообщений(+ смотрим на Debug console в Unity)!
Проверка взаимодействия компонентов
Тестируем Unity сначала с браузером, потом и с Python скриптом.
тесты c браузером:
Видим на всех 3х сторонах, что обмен сообщениями происходит успешно, а значит мы завершили Часть 2.
Продолжение в следующей статье – Управляем роботами из VR. Продолжение 1
