limetelecom (limetelecom) wrote,
limetelecom
limetelecom

Categories:

Стабильное вещание с IP-камеры на сайт 24х7 (без Linux).

Задача: организовать вещание с китайской IP камеры на корпоративном сайте в формате 24х7, с использованием как можно меньшего количества узлов отказа (как это уже работает у нас http://amurnet.ru/web/web_stream.php).

Реализация:
В своё время уже приходилось строить подобную систему, и воспоминания были только негативные, то стример повиснет то камера, от того что зависла камера опять завис стример и т.д. Что больше всего раздражало что в сети куча пошаговых мануалов и у всех всё работает (правда уже тогда заметил что у всех немного разные конфиги). И вот спустя годы, аналогичная задача расставила всё на свои места, всё дело оказалось в многочисленных версиях используемого ПО.

И так что нам понадобится:
1. Неттоп, Десктоп, Сервер с установленной системой Windows (В нашем варианте это был Неттоп на Intel Atom D525 1.8, со свежеустановленной Windows 7 Home Basiс, встроенной видеокартой и сетевой картой Realtek).
2. VLC 2.1.5 (вот тут первый важный момент, нам нужна строго эта версия http://download.videolan.org/pub/videolan/vlc/2.1.5/win32/vlc-2.1.5-win32.exe).
3. Китайская IP-камера (или любая другая камера, которая отдаёт RTSP поток с кодеком H.264, что собственно делают 90% IP-камер среднего ценового диапазона).
4. Flowplayer 3.2.18 (тут второй важный момент качаем версию https://releases.flowplayer.org/flowplayer/flowplayer-3.2.18.zip).

[Если вам интересно, читаем дальше...]Собираем:
1. Настройка системы:
1.1. Заходим: Пуск\Панель управления\Все элементы панели управления\Электропитание там выбираем Сбалансированный план и заходим в его настройки. В настройках отключаем Выключение дисплея и Переход в спящий режим.
1

1.2. На диске С: создаём папку с именем VLC.
1.3. Если вы установили пароль для основного пользователя, нужно настроить автовход в систему при загрузке. Для этого нажмите Пуск и в строке поиска введите netplwiz, запустите найденное приложение. Уберите в нём галочку Требовать ввода имени пользователя и пароля, и нажмите кнопку Применить. После этих действий если потребуется перезагрузить сервер вам не потребуется подключатся к нему для запуска VLC.

2. Устанавливаем и настраиваем VLC.
2.1. Заранее скаченную версию VLC 2.1.5 запускаем на стандартную установку. Если у вас стояла другая версия VLC в процессе установки поставьте галочку очистить настройки и кеш.
2.2. После завершения процесса установки запускаем VLC и при первом запуске, снимаем галочки о получении данных и обновлений из сети.
2.3. Условимся что вы заранее выяснили как получить RTSP поток с вашей камеры используя RTSP ссылку. В нашем случае она выглядит так rtsp://192.168.11.1:554/user=admin&password=admin&channel=1&stream=0.sdp.
2.4. На данном этапе проведём первую проверку. Запустите VLC плеер, нажмите Медиа/Открыть URL... в появившемся окне вставьте в поле сетевой адрес RTSP ссылку от потока камеры.
2

2.5. Нажмите кнопку Воспроизвести и вы должны увидеть видео с камеры, чёткое без задержек и артефактов (для того что бы на более поздних этапах уже точно знать что на связке камера - сервер все хорошо).
2.6. Закройте VLC.
2.7. Зайдите в папку C:\VLC (созданную в пункте 1.2). Создайте там текстовый файл start_vlc.txt. В эту же папку скопируйте ваш логотип для трансляции в формате PNG и переименуйте его в LOGO.png.
2.8. Откройте созданный файл start_vlc.txt. Вставьте туда следующий код:

start /D "C:\Program Files\VideoLAN\VLC\" vlc.exe "rtsp://192.168.11.1:554/user=admin&password=admin&channel=1&stream=0.sdp" --sout #transcode{vcodec=FLV1,acodec=none,scale=0.5,vb=2048,sfilter={logo{file=C:\VLC\LOGO.png,x=10,y=10,opacity=200}}}:std{access=http{mime=video/x-flv},mux=ffmpeg{mux=flv},dst=192.168.11.2:8088/stream.flv} --rtsp-caching=5000 --http-caching=5000 --loop

2.9. Разберём по пунктам:
2.9.1. start /D "C:\Program Files\VideoLAN\VLC\" vlc.exe "rtsp://192.168.11.1:554/user=admin&password=admin&channel=1&stream=0.sdp" - запустить VLC и открыть RTSP поток с камеры.
2.9.2. vcodec=FLV1, acodec=none - пакуем полученный поток в видеокодек FLV1 (можно попробовать H264 но он потребляет в 3-4 раза больше ресурсов процессора и Intel Atom тут уже не хватит), аудиокодек не используем так как наша камера "глухая".
2.9.3. scale=0.5,vb=2048 - вот это одна из главных записей в конфигурации и тут нужно остановится подробнее. VLC кодирует в FLV используя ffmpeg и в разных сборках VLC он разный, именно поэтому мы особое внимание обращали на версию VLC (на момент написания этой статьи вышел VLC 2.2.0 где параметр scale уже не работает). Теперь подробнее о параметрах, наша камера вещает с разрешением 1280х720 (битрейт 4 Мегабита/с) это много для вещания в сеть, поэтому мы уменьшаем разрешение в два раза до 640х360 (битрейт 1-1.3 Мегабита/с в зависимости от времени суток). Тогда вопрос зачем мы задаём битрейт параметром vb=2048 - всё просто: если не прописать это значение (число может быть любое больше единицы) то ffmpeg будет очень сильно сжимать качество потока и вы будете наблюдать квадратные артефакты на всём изображении в независимости от разрешения.
2.9.4. sfilter={logo{file=C:\VLC\LOGO.png,x=10,y=10,opacity=200}} - это пункт вставки вашего логотипа в видео. Очень рекомендую не отказываться от этой процедуры, так как охотников выдать вашу трансляцию за свою будет очень много. x=10,y=10 - это отступ от левого верхнего угла. opacity=200 - это прозрачность логотипа (1 прозрачный, 255 не прозрачный).
2.9.5. std{access=http{mime=video/x-flv} - доступ к транскодированному потоку будет по протоколу http, mime тип контента video/x-flv.
2.9.6.
dst=192.168.11.2:8088/stream.flv - в этой строке указан IP адрес интерфейса на котором будет подниматься поток вещания на порту 8088 (IP адрес сетевой карты Неттопа/Десктопа/Сервера).
2.9.7. --loop - так же один из важных параметров. Всё дело в том что камера с которой мы принимаем поток может периодически виснуть и перегружаться, при этом без этого параметра VLC будет останавливать транскодинг. Параметр loop заставляет перебирать плейлист VLC по кругу и в нашем случае в случае потери потока с камеры, VLC будет пытаться его получить снова и снова.
2.10. Сохраняем файл start_vlc.txt и закрываем его.
2.11. Меняем расширение файла start_vlc.txt на start_vlc.bat.
2.12. Запускаем файл start_vlc.bat. Должен запустится VLC. Для проверки что транскодинг работает, зайдите в Инструменты/Информация о кодеке. В поле Битрейт должна отображаться скорость входного потока.
3

2.13. Закройте Информацию о медиаисточнике. На этом этапе VLC можно свернуть.
2.14. Создайте ярлык для файла start_vlc.bat и поместите его в Пуск/Автозагрузка (системы Windows). Конечно в сети не мало способов запустить VLC в виде сервиса, но испытав их на практике вы поймёте с запуском из командной строки гораздо проще менять конфигурацию "на лету" и отслеживать работу самого VLC.

3. Создаём страницу на веб-сервере.
3.1. Принимаем во внимание что у вас уже собран веб сервер и он имеет доступ к камере. В нашем случае как вы уже наверно догадались камера и транскодер на базе VLC находятся за NAT-серверов, на котором настроен проброс портов. Без экзотики порт 8088 вешнего IP адреса 62.33.***.*** NAT-сервера преобразовывается на порт 8088 локального IP адреса транскодера 192.168.11.2.
3.2. На веб-сервере создаём отдельный папку stream для страницы плеера. В этой папку создаём ещё одну папку js для скриптов.
3.3. Открываем скаченный архив с Flowplayer 3.2.18, копируем файлы flowplayer.controls-3.2.16.swf, flowplayer-3.2.13.min.js, flowplayer-3.2.18.swf в папку на веб-сервере stream/js.
3.4. В папке stream создаём два файла index.txt и stream.txt.
3.5. Открываем index.txt и вставляем в него следующий код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Моя камера</title>
<meta name="" content="">
</head>
<body>
<center><iframe src="stream.html" width="640" height="360" border="0" frameborder="no"></iframe></center>
</body>
</html>


3.6. Тут снова небольшое пояснение собственно кодом вставки (который вы будете раздавать своим друзьям или другим владельцам сайтов) видео с камеры на любой сайт будет <center><iframe src="stream.html" width="640" height="360" border="0" frameborder="no"></iframe></center>. Всё дело в том что "мир не стоит на месте" и самый простой способ моментально внести изменения в вашу будущую трансляцию у всех ваших коллег это использовать iframe и хранить код самого плеера у вас на сервере. Естественно в место stream.html будет полный адрес до вашего веб-сервера.
3.7. Сохраняем файл index.txt и закрываем его.
3.8. Открываем stream.txt и вставляем в него следующий код:

<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Cache-Control" content="no-cache">
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<script type="text/javascript" src="js/flowplayer-3.2.13.min.js"></script>
<style type="text/css">
html, body { height:100%; overflow:hidden; }
body { margin:0; }
</style>
</head>
<body>
<a href="http://62.33.***.***:8088/stream.flv" style="display:block;width:100%;height:100%" id="player"></a>
<script>
flowplayer("player", "js/flowplayer-3.2.18.swf", {
clip: {
autoPlay: false,
scaling: 'fit',
autoBuffering: true,
live: true
},
canvas: {
background: '#000000',
backgroundGradient: 'none'
},
plugins: {
controls: {
url: "js/flowplayer.controls-3.2.16.swf",
buttonColor: '#FFFFFF',
buttonOverColor: '#FFFFFF',
backgroundColor: '#000000',
backgroundGradient: 'none',
height: '30',
opacity: '0.6',
all: false,
play: true,
fullscreen: true
}
}
});
</script>
</body>
</html>

3.9. Тут тоже уточняем. Это код вставки Flowplayer с отключенными лишними кнопками временной полосой и т.д. Вместо http://62.33.***.***:8088/stream.flv нужно вставить адрес вашего NAT-сервер или напрямую адрес транскодера если вещание будет только в локальной сети.
3.10. Закрываем файл
index.txt и закрываем его.
3.11. Меняем расширения обоих файлов
index.txt и stream.txt на index.html и stream.html соответственно.
3.12. Открываем файл index.html на вашем веб-сервер и наблюдаем видео.
4



Tags: IP-камера, flowplayer, stream, vlc, windows, вещание, сайт
Subscribe
  • Post a new comment

    Error

    Anonymous comments are disabled in this journal

    default userpic

    Your reply will be screened

    Your IP address will be recorded 

  • 0 comments