Сергей Коба

Сергей Коба

Веб, блокчейн, мобильная разработка и интернет вещей

Веб тимлид в MobiDev. Цель: изучать и учить чему-то новому без остановки. Основные языки: PHP и Ruby. Также интересно: блокчейн, мобильная разработка, IoT и DevOps. Жизненное кредо: я жив, пока я учу что-то новое.

Строим WiFi робота c камерой (Часть 4 - Камера)

15 июля 2017 20:00

Заканчиваю серию статей о разработке WiFi робота Pluto рассказом о том, как подключить к нему камеру и настроить реалтайм видео поток в браузер.

Как ни странно эта задача оказалась одной из наиболее легких в процессе разработки Pluto. Для ее реализации я использовал стандартную Raspberry Pi Camera Module V2, подключить ее к Raspberry Pi очень просто, главное воткнуть шлейф камеры правильной стороной

Также не забудьте включить поддержку камеры в настройках Вашего Raspberry Pi, подключившись по VNC

Затем я попробовал несколько хороших скриптов для работы с камерой на python, в частности такой скрипт из официального туториала, который позволяeт получить снимок с камеры и сохранить его на рабочий стол

from picamera import PiCamera
from time import sleep
camera.start_preview()
sleep(5)
camera.capture('/home/pi/Desktop/image.jpg')
camera.stop_preview()

Стало сразу ясно, что организовать видео трансляцию "своими руками" будет не простой задачей. Но к счастью я быстро наткнулся на готовое решение в виде библиотеки RPi-Cam-Web-Interface

Следуйте подсказкам по установке библиотеки (запускайте все указанные команды на Вашем Raspberry Pi).  В процессе установки необходимо задать несколько параметров

Важно указать папку camera и порт 80, так как оба этих параметра влияют на итоговый адрес, по которому будет доступна камера.

После успешной установки можно открыть http://YOUR_RASPBERRY_PI_IP/camera и понаслаждаться открывающимся видом из камеры Вашего робота :) Далее необходимо добавить окно с трансляцией на панель управления роботом. Наиболее простым решением является добавить указанную страницу как фрейм на нашу панель управления роботом. Добавьте следующий код в файл templates/index.html

<iframe src="" style="width:100%; height:800px;" frameBorder="0" id="camera-iframe" />
<script>
$(function () {
 $('#camera-iframe').attr('src', 'http://' + window.location.hostname + '/camera/');
});
</script>

Я использую javascript для инициализации источника iframe, чтобы динамически подхватывать адрес сервера, если изменится ip-адрес (также это можно сделать из python при генерации страницы). Заходим в панель управления: http://YOUR_RASPBERRY_PI_IP:5000

С гордостью сообщаю вам, что Pluto готов. Он успешно может съездить за кофе или развеселить ваших друзей и клиентов виртуальным туром по офису... На ваше усмотрение!

Чтобы сделать робота доступным извне (из любой точки с интернетом) необходимо обладать навыками системного администрирования и иметь статический ip адрес. Однако это отдельная статья.

А пока подсоединяйте аккамуляторы, заходите на страницу управления и ПОЕХАЛИ!


Полный рабочий код Вы можете найти здесь.

Все статьи о Плуто доступны по следующим ссылкам:

Строим WiFi робота c камерой (Часть 1 - Ходовая)

Строим WiFi робота c камерой (Часть 2 - Первая поездка)

Строим WiFi робота c камерой (Часть 3 - Веб сервер)

Строим WiFi робота c камерой (Часть 4 - Камера)

Назад