Доступ к прямой трансляции с модулем камеры Raspberry Pi в веб-браузере с использованием NodeJS?

Я создаю веб-приложение для покадровой камеры, используя Raspberry Pi и модуль камеры Raspberry Pi. На данный момент я создал веб-приложение (используя NodeJS, Express, AngularJS и BootStrap 3), которое может взаимодействовать с модулем камеры Raspberry с помощью модуля NodeJS с открытым исходным кодом (https://www.npmjs.org/).package/raspicam). Мое веб-приложение может устанавливать параметры интервальной съемки и делать фотографии, нажимая кнопки в веб-интерфейсе. Однако в настоящее время в веб-браузере нет функции прямой трансляции, где пользователи могут удаленно наблюдать за тем, что видит модуль Raspberry Pi Camera. Я хотел бы найти способ отобразить прямую трансляцию модуля камеры в Интернете, просто сделав что-то подобное в html-файле:

<img src="live-stream-raspberry-pi-camera">

person user3314402    schedule 25.04.2014    source источник


Ответы (2)


Вот что я придумал для прямой трансляции с камеры. Это грубо, но работает во всех браузерах.

Я не знаю, как вы получаете доступ к камере Raspberry pi, но в приведенном ниже примере показано, как получить доступ к встроенной веб-камере в Linux:

Закодируйте свою камеру в файл обновляемого изображения с помощью ffmpeg:

ffmpeg -analyzeduration 0 -i /dev/video0 -update 1 -q 1 -r 5 -y /video/feed/1.jpg

Прочитайте файл изображения с помощью php и выведите содержимое при изменении:

<?php
session_start();
session_write_close();
$imgFile = '/video/feed/1.jpg';
$img = (file_get_contents($imgFile));
$lastImgSize = $_SESSION['imageSize'];
while (true) {
    usleep(20000);
    $img = (file_get_contents($imgFile));
    $imgSize = strlen($img);
    if ($lastImgSize != $imgSize) {
        break;
    }
} 
session_start();
header("Content-type: image/jpg");
$_SESSION['imageSize'] = $imgSize;
echo $img;
exit;

Перезагрузите изображение с помощью javascript, php предоставит новое изображение, когда оно будет доступно:

<img id="feed" src>
        <script>
            img = new Image
            function f() {
                img.src = "img.php?rnd=" + Date.now();
                img.onload = function() {
                    feed.src = img.src;
                    setTimeout(function() {
                        f();
                    }, 50);
                };
                img.onerror = function() {
                    setTimeout(function() {
                        f();
                    }, 50);
                };
            }
            f();
        </script>

Если вы ищете что-то более необычное:

Взгляните на flowplayer, который поддерживает прямую трансляцию из источника rtmp/hls. кодируется с помощью ffmpeg.

Или, что еще интереснее, Dashcast служба потоковой передачи Linux/Windows, которая кодирует прямые трансляции в HTML5 < формат href="http://en.wikipedia.org/wiki/Dynamic_Adaptive_Streaming_over_HTTP" rel="nofollow">mpeg-DASH, в настоящее время поддерживаемый ie и chrome, поддержка firefox в пути

person andrew    schedule 25.04.2014

Для чего-то такого простого вы можете отправить ответ multipart/x-mixed-replace, где каждая часть представляет собой кадр видео. Chrome и Firefox удалили поддержку этого типа ответа при использовании с XMLHttpRequest, но, насколько мне известно, они по-прежнему разрешены для элементов изображения.

person mscdex    schedule 25.04.2014