Реализация обхода ограничений видео-потоков MJPG

Использование системы в различных ситуациях, вопросы программирования сценариев.

Модератор: immortal

Ответить
BwehaaFox
Сообщения: 3
Зарегистрирован: Ср фев 13, 2019 1:42 pm
Благодарил (а): 0
Поблагодарили: 2 раза

Реализация обхода ограничений видео-потоков MJPG

Сообщение BwehaaFox » Ср фев 13, 2019 4:22 pm

Браузеры имеют ограничение на вывод MJPG на одну страницу. В среднем это 5 потоков. Из за этого появляется проблема с выводом, допустим, большого количества камер. Они просто не отображаются. Можно воспользоваться и табами, но все фреймы на странице ограничены тем же количеством потоков, что и основная вкладка, поэтому это не решает проблем. Обход проблемы за счет сабдоменов не всегда представляется возможной. Но за счет хранения сцен в фреймах, можно обойти это ограничение с наименьшими затратами. Я решил не использовать существующие функции по отображению новых вкладок, дабы не нарушать изначальную логику работы и наложил свою реализацию отдельно.

Код решает проблему и легко встраивается, но из-за разной структуры HTML в логике табов, например в ../templates/application.html и ../templates/pages.html, нельзя его назвать однозначно универсальным.

Собственно код для ../templates/application.html:

Код: Выделить всё

var tab_array = {};

$(document).ready(function() {
 $('.ui-tabs-anchor').click(function(){
  var dataControl   = $(this).parent().attr('aria-controls');
  var targetWrapper = $('#'+dataControl).first();
  var frameChanged  = targetWrapper.hasClass('is-changed');

  var lastFrame        = $('#tabs iframe').first();
  var lastFrameWrapper = lastFrame.parent();
  var lastId           = lastFrameWrapper.attr('id');
  var lastSrc          = lastFrame.attr('src');

  tab_array[lastId] = lastSrc;

  lastFrame.remove();
  lastFrameWrapper.addClass('is-changed');

  if(frameChanged) {
    targetWrapper.html('<iframe src="'+ tab_array[dataControl]  
                                      + '" width=100% height="'
                                      + iFrameHeight
                                      + '" border="0" frameborder="0"></iframe>');
  }
 });
});

И для для ../templates/pages.html:

Код: Выделить всё

var tab_array = {};

 $(document).ready(function() {
  $('.tab_table_cell').click(function(){

   var dataControl = 'tab-' + $(this).attr('id').substr(4);
   var targetWrapper = $('#'+dataControl).first();
   var frameChanged = targetWrapper.hasClass('is-changed');

   var lastFrame        = $('#container iframe').first();
   var lastFrameWrapper = lastFrame.parent();
   var lastId           = lastFrameWrapper.attr('id');
   var lastSrc          = lastFrame.attr('src');

   lastFrame.remove();
   lastFrameWrapper.addClass('is-changed');
   tab_array[lastId] = lastSrc;
   console.log(tab_array);
   if(frameChanged) {
     targetWrapper.html('<iframe src="'+ tab_array[dataControl] 
                                       + '" width=100% height="'
                                       + iFrameHeight
                                       + '" border="0" frameborder="0"></iframe>');
   }
  });
 });
Как видно выше, отличие лишь в селекторах и формате поиска идентификатора. В тоже время проблема данной реализации в том, что оно очищает все табы, поэтому данные введенные между вкладками не будут сохранены. Если данную логику реализовать более полноценно в пределах связки с CMS, то как вариант это реализовать флаг при создании сцены, по которому можно определить, необходимо ли удалять сцену при переключении вкладки. Но в то же время я полноценно не работаю с этой системой и оказался здесь пролетом, и углубленно изучить структуру кода проекта не представляется возможным.

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

Конфигурация на котором тестировалась данная реализация:
ПО линия и Majordomo
Стандартная установка
Ubuntu 18.04.1 LTS bionic
PHP 7.2.10
Mysql 14.14 Distrib 5.7.25
Apache/2.4.29 (Ubuntu)
За это сообщение автора BwehaaFox поблагодарили (всего 2):
skysilver (Ср фев 13, 2019 4:22 pm) • Chainik (Ср фев 13, 2019 4:36 pm)
Рейтинг: 2.33%
Chainik
Сообщения: 1462
Зарегистрирован: Вс янв 10, 2016 11:05 am
Благодарил (а): 260 раз
Поблагодарили: 454 раза

Re: Реализация обхода ограничений видео-потоков MJPG

Сообщение Chainik » Ср фев 13, 2019 4:43 pm

Вопрос на понимание.
ПО Линия поднимает свой веб-сервер, с которого уже можно "подцепить" поток, выводя его на сцену или домашнюю страницу Мажордомо с помощью API Линии. Например, так

Код: Выделить всё

<img src="http://192.168.0.103:9786/cameras/0/video?resolution=480x270&fps=15&keep_aspect_ratio=0&authorization=Basic%20YWRtaW46">
Собственно вопрос, я правильно понимаю, что с веб-сервера Линии мы получаем поток, конвертированный в MJPG (например, из исходного RTSP) и, соответственно, у нас появляется проблема ограничения количества потоков, которую вы пытаетесь обойти?
BwehaaFox
Сообщения: 3
Зарегистрирован: Ср фев 13, 2019 1:42 pm
Благодарил (а): 0
Поблагодарили: 2 раза

Re: Реализация обхода ограничений видео-потоков MJPG

Сообщение BwehaaFox » Ср фев 13, 2019 5:00 pm

Да, именно так.
То есть в данном случае было 15 потоков с камер, их преобразовывали в MJPG, и необходимо было их вывести на страницу. По 4 камеры на вкладку.
Chainik
Сообщения: 1462
Зарегистрирован: Вс янв 10, 2016 11:05 am
Благодарил (а): 260 раз
Поблагодарили: 454 раза

Re: Реализация обхода ограничений видео-потоков MJPG

Сообщение Chainik » Ср фев 13, 2019 5:14 pm

Ясно.
Видимо, до вас никто не пытался таким образом запихнуть в Мажордомо больше чем 4-5 потоков с камер. Либо просто пользовались "трансляцией всего интерфейса" Линии. Т.е.

Код: Выделить всё

http://192.168.0.103:9786
или

Код: Выделить всё

<iframe width="480" height="270" src="http://192.168.0.103:9786" frameborder="0" allowfullscreen></iframe>
А там используется Adobe Flash...
BwehaaFox
Сообщения: 3
Зарегистрирован: Ср фев 13, 2019 1:42 pm
Благодарил (а): 0
Поблагодарили: 2 раза

Re: Реализация обхода ограничений видео-потоков MJPG

Сообщение BwehaaFox » Ср фев 13, 2019 5:36 pm

Собственно, тут и требовалось найти лазейку без Adobe Flash, чтобы можно было более менее спокойно запускать на мобильных устройствах
Chainik писал(а):
Ср фев 13, 2019 5:14 pm
Видимо, до вас никто не пытался таким образом запихнуть в Мажордомо больше чем 4-5 потоков с камер
Возможно, кто-то и пытался, и нашел более удобные решения, но не огласил.
Chainik
Сообщения: 1462
Зарегистрирован: Вс янв 10, 2016 11:05 am
Благодарил (а): 260 раз
Поблагодарили: 454 раза

Re: Реализация обхода ограничений видео-потоков MJPG

Сообщение Chainik » Ср фев 13, 2019 5:46 pm

BwehaaFox писал(а):
Ср фев 13, 2019 5:36 pm
Возможно, кто-то и пытался, и нашел более удобные решения, но не огласил.
Сомневаюсь, что находили решение и не выкладывали. Вообще, профессионалов тут мало. В основном "чайники" вроде меня.
Если нужно было выводить большее количество потоков, чем 4-5, просто находили другой софт. Вот, например, ContaCam (viewtopic.php?f=34&t=4874&p=66084).
Но в отличии от Линии у меня ContaCam выдавал поток с максимальной частотой всего 1 кадр в секунду (причем "железо" у меня не слабое).

В общем, в любом случае спасибо, что делитесь с сообществом.
maestro
Сообщения: 1
Зарегистрирован: Пн янв 28, 2019 8:12 am
Благодарил (а): 0
Поблагодарили: 0

Re: Реализация обхода ограничений видео-потоков MJPG

Сообщение maestro » Чт фев 14, 2019 8:52 am

ContaCam в этом случае не панацея. Тут идея была такова:
Дано регистраторы 10-14 штук по 16 камер и отдельно стоящие ip камеры, как правило поток с этих устройств не имеет H265, там rtsp, т.е. вставить видео поток в majordomo на сцену тегом <video src=""></video> не представляется возможным, а так же не устраивает картинка раз в секунду, нужен именно видео поток сносного качества.
Raspberry pi 3 или orange pi 3 для majordomo для агрегации (devline бесплатна на 16 потоков) и одно устройство в качестве сервера majordomo.
Raspberry обрабатывает и выводит информацию с датчиков, majordomo отображает её, а так же выводит и видео потоки в любом браузере без дополнительных флеш, java плееров, всё это работает на Linux состав ПО выше выложил мой Друг. Так достигнута не только цель вывода большого количества потоков видео (максимум по 6 на сцену, зависит от браузера, ознакомится с проблемой и альтернативным решением которое не будет работать через NAT, можно тут https://stackoverrun.com/ru/q/6539222 ), но и кросплатформенности. P.S. devline обещают дописать кодировщик потока в H265 к лету этого года.
Ответить