Кросс-браузерное решение для отображения потока MJPEG - PullRequest
22 голосов
/ 11 марта 2011

Существует ли легкий, бесплатный и надежный способ отображения MJPEG в кросс-браузерной среде? Я пытаюсь отобразить поток MJPEG с IP-камеры Axis 2120 на сайте, который я разрабатываю, и обнаружил, что это достаточно надежно в текущих версиях Firefox. Однако после некоторого тестирования я обнаружил, что IE, Opera и Chrome имеют разную степень сложности при этом (нет доступа к Mac, поэтому я не уверен насчет Safari). Internet Explorer не поддерживает MJPEG и не работает вообще. Опера занимает буквально 10-15 секунд, чтобы отобразить что-либо после того, как начальный GET был отправлен. Chrome отлично работает, пока <div>, содержащий тег <img>, не будет скрыт и затем снова показан.

Для справки, я использую тег <img> для отображения потока следующим образом:

<img src="http://my.ip.addr/axis-cgi/mjpg/video.cgi/?resolution=352x240" alt="real-time video feed" />

Я рассмотрел возможность использования сервера ретрансляции для сбора потока MJPEG и перекодирования его на лету, но это решение кажется слишком уродливым. Есть ли лучшие предложения там?

Ответы [ 2 ]

10 голосов
/ 19 октября 2012

Я только что предложил решение пару месяцев назад.Он кроссплатформенный и не требует сторонних плагинов, таких как Flash или Java.

По сути, это прокси-узел node.js, который анализирует границы m-jpeg и доставляет изображения через определенный интервал.*

Вилка это в https://github.com/rodowi/Paparazzo.js

5 голосов
/ 29 апреля 2011

Вот решение на основе Java-апплета, которое вы можете использовать для любого браузера (или только тех, которые не поддерживают MJPEG): http://www.charliemouse.com/code/cambozola/

Что касается других ошибок, связанных с MJPEG, я обнаружил, что вы должны установить для атрибута 'src' тега 'img' значение, отличное от MJPEG, прежде чем пытаться удалить тег 'img'. Пример:

<img src="#" />

Если вы этого не сделаете, Firefox продолжит загрузку потока MJPEG, хотя это не должно быть.

...