«Нет времени объяснять!» или Как реализовать трансляцию с IP камеры на сайт?

by Опубликовано

ipcam_coverПожалуй мне везет на идиотские задачи в самый неподходящий момент. Это что, карма такая?! Ну да ладно..

В данном «отпускном» посте речь пойдет о том, как при наличии 3g модема и ноутбука реализовать трансляцию с IP камеры на сайт.

Сам пост я бы не написал, если бы не задал вопрос на тостере, на котором мне подсказали что гуглить.

 

Что мы имеем?

  1. Недешевая IP камера AXIS Q1755, которую я даже в руках не держал.. Сама камера находится в городе «А» и подключена через тормозной 3g модем.
  2. Сервер на Debian 7, который крутится на почти дохлом Core2Duo. Хотя не такой уж он и дохлый, но для данных задач подходит не очень. Ах, да, сам сервер живет в городе Б.
  3. Сайт, на который необходимо повесить плеер. Сайт находится на другом, более производительном сервере, в том же городе Б.
  4. Я, который находится в городе В, с ноутбуком, 3g модемом и ограниченным трафиком в 4gb..

При помощи чего мы все это реализуем? Сама камера будет передавать поток по RTSP, FFmpeg будет принимать его и конвертировать его в RTMP, а при помощи JW Player этот поток можно «повесить на сайт».

Для тех, кто любит наглядно — получайте:

"Нет времени объяснять!" или Как реализовать трансляцию с IP камеры на сайт?

Ну а теперь главное, что же нужно сделать, чтобы заиметь у себя такую штуку?

Подготовка.

Для начала нам необходимо все подготовить и установить необходимые пакеты. Например для сборки Nginx понадобится Perl библиотека регулярных выражений и заголовки OpenSSL:

apt-get install libpcre3 libpcre3-dev libssl-dev

Так же поставим утилиту rtmpdump, которая позволит нам понять, работает ли у нас rtmp или нет:

apt-get install rtmpdump

Далее скачаем сами исходники Nginx, стабильной версии 1.6.0 и распакуем их:

wget http://nginx.org/download/nginx-1.6.0.tar.gz
tar -xzvf nginx-1.6.0.tar.gz

Тоже самое сделаем и с модулем, с которым нам нужно будет скомпилировать Nginx:

wget https://github.com/arut/nginx-rtmp-module/zipball/master -O nginx-rtmp-module-master.zip
unzip nginx-rtmp-module-master.zip -d nginx-rtmp-module-master

Сборка Nginx с поддержкой rtmp

Теперь приступим к сборке. Для начала нужно сконфигурировать Nginx:

cd nginx-1.6.0
./configure --prefix=/usr --add-module=../nginx-rtmp-module-master/arut-nginx-rtmp-module-0bb2323/ --pid-path=/var/run/nginx.pid --conf-path=/etc/nginx/nginx.conf --error-log-path=/var/log/nginx/error.log --http-log-path=/var/log/nginx/access.log --with-http_ssl_module

На выходи мы должны получить что-то подобное:

...
<pre>configuring additional modules
<strong>adding module in ../nginx-rtmp-module-master/arut-nginx-rtmp-module-0bb2323/</strong>
<strong> + ngx_rtmp_module was configured</strong>
checking for PCRE library ... found
checking for PCRE JIT support ... found
checking for OpenSSL library ... found
checking for zlib library ... found
creating objs/Makefile</pre>
<pre>Configuration summary
 + using system PCRE library
 + using system OpenSSL library
 + md5: using OpenSSL library
 + sha1: using OpenSSL library
 + using system zlib library</pre>
<pre><strong> nginx path prefix: "/usr"</strong>
<strong> nginx binary file: "/usr/sbin/nginx"</strong>
<strong> nginx configuration prefix: "/etc/nginx"</strong>
<strong> nginx configuration file: "/etc/nginx/nginx.conf"</strong>
<strong> nginx pid file: "/var/run/nginx.pid"</strong>
<strong> nginx error log file: "/var/log/nginx/error.log"</strong>
<strong> nginx http access log file: "/var/log/nginx/access.log"</strong>
<strong> nginx http client request body temporary files: "client_body_temp"</strong>
<strong> nginx http proxy temporary files: "proxy_temp"</strong>
<strong> nginx http fastcgi temporary files: "fastcgi_temp"</strong>
<strong> nginx http uwsgi temporary files: "uwsgi_temp"</strong>
<strong> nginx http scgi temporary files: "scgi_temp"</strong>

Важно, чтобы сам rtmp модуль подключился и пути к логам, конфигам и бинарнику были верными. Выше я выделил то, что нужно проверить. Если все хорошо, то компилируем и устанавливаем:

make
make install

Теперь скопируем файл stat.xsl из папки с исходниками в папку nginx:

cp nginx-rtmp-module-master/arut-nginx-rtmp-module-0bb2323/stat.xsl /etc/nginx/

И проверим работу самого nginx.

service nginx start

Заходим на http://ip_servera. Видим приветствие Nginx? Тогда все хорошо.

Установка FFmpeg и проверка его работы

Для того, чтобы мы смогли конвертировать поток rtsp в fvl, нам понадобится ffmpeg.

Да, кстати, если вы проделывайте все эти действия на Ubuntu, то имейте в виду, что в этом Ubuntu FFmpeg считается устаревшим, и в замен предлагает использовать avconv. Не пугайтесь, замена «шила на мыло» ничего не сломает, все будет работать.

Ладно, подключаем репозитории FFmpeg и ставим его:

apt-add-repository ppa:jon-severinsson/ffmpeg
apt-get update
apt-get install ffmpeg

Теперь проверим, на сколько удачно подключается ffmpeg к камерам. Я например забыл открыть доступ на маршрутизаторе к 554 порту.

ffmpeg -i rtsp://admin:[email protected]/axis-media/media.amp

На выходе мы должны будем получить что-то подобное:

ffmpeg version 1.0.10 Copyright (c) 2000-2014 the FFmpeg developers
built on Jul 25 2014 07:50:40 with gcc 4.7 (Debian 4.7.2-5)
configuration: --prefix=/usr --extra-cflags='-g -O2 -fstack-protector --param=ssp-buffer-size=4 -Wformat -Werror=format-security ' --extra-ldflags='-Wl,-z,relro' --cc='ccache cc' --enable-shared --enable-libmp3lame --enable-gpl --enable-nonfree --enable-libvorbis --enable-pthreads --enable-libfaac --enable-libxvid --enable-postproc --enable-x11grab --enable-libgsm --enable-libtheora --enable-libopencore-amrnb --enable-libopencore-amrwb --enable-libx264 --enable-libspeex --enable-nonfree --disable-stripping --enable-libvpx --enable-libschroedinger --disable-encoder=libschroedinger --enable-version3 --enable-libopenjpeg --enable-librtmp --enable-avfilter --enable-libfreetype --enable-libvo-aacenc --disable-decoder=amrnb --enable-libvo-amrwbenc --enable-libaacplus --libdir=/usr/lib/x86_64-linux-gnu --disable-vda --enable-libbluray --enable-libcdio --enable-gnutls --enable-frei0r --enable-openssl --enable-libass --enable-libopus --enable-fontconfig --enable-libfdk-aac --enable-libdc1394 --disable-altivec --dis libavutil 51. 73.101 / 51. 73.101
libavcodec 54. 59.100 / 54. 59.100
libavformat 54. 29.104 / 54. 29.104
libavdevice 54. 2.101 / 54. 2.101
libavfilter 3. 17.100 / 3. 17.100
libswscale 2. 1.101 / 2. 1.101
libswresample 0. 15.100 / 0. 15.100
libpostproc 52. 0.100 / 52. 0.100
[rtsp @ 0x19d6cc0] Estimating duration from bitrate, this may be inaccurate
Input #0, rtsp, from 'rtsp://admin:[email protected]/axis-media/media.amp':
Metadata:
title : Media Presentation
Duration: N/A, start: 0.570122, bitrate: N/A
Stream #0:0: Video: h264 (Baseline), yuvj420p, 1280x720 [SAR 1:1 DAR 16:9], 25 tbr, 90k tbn, 180k tbc
At least one output file must be specified

Это доказывает что камера работает, вещает rtsp поток и ffmpeg работает.

Настройка Nginx и проверка его работы

Теперь открываем файл коyфигурации nginx своим любимым редактором (у меня это vim)

vim /etc/nginx.conf

и приводим его к следующему состоянию:

user nginx;
# Узнать сколько ядер в системе можно при помощи команды nproc
worker_processes 2;

error_log /var/log/nginx/error.log warn;
pid /var/run/nginx.pid;

events {
  worker_connections 1024;
}

http {
  include /etc/nginx/mime.types;
  default_type application/octet-stream;

  log_format main '$remote_addr - $remote_user [$time_local] "$request" '
  '$status $body_bytes_sent "$http_referer" '
  '"$http_user_agent" "$http_x_forwarded_for"';

  access_log /var/log/nginx/access.log main;
  sendfile on;
  #tcp_nopush on;
  keepalive_timeout 65;
  #gzip on;

  server {
    listen 80;
    # rtmp stat
    location /stat {
     rtmp_stat all;
     rtmp_stat_stylesheet stat.xsl;
    }

    location /stat.xsl {
     # you can move stat.xsl to a different location
     root /etc/nginx/;
    }

    location / {
     rtmp_control all;
    }

    error_page 500 502 503 504 /50x.html;
    location = /50x.html {
    root html;
  }
  #Добавим locations для просмотра статических изображений с камеры
  location /image/cam1/ {
    proxy_pass "http://10.10.10.11/axis-cgi/jpg/image.cgi";
  }
 }
 include /etc/nginx/conf.d/*.conf;
}

rtmp {
 access_log /var/log/nginx/rtmp_access.log;
 server {
 listen 1935;
 ping 30s;
 notify_method get;
 application cam1 {
   live on;
   exec_pull ffmpeg -i rtsp://admin:[email protected]/axis-media/media.amp -threads 2 -f flv -r 25 -s 1280x720 -an rtmp://localhost:1935/cam1/stream 2>>/var/log/nginx/ffmpeg.log;
 }
 }
}

Сохраняем, закрываем, проверяем:

nginx -t
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful
service nginx restart

Проверить корректность работы RTMP сервера на базе NGINX можно следующей командой:

rtmpdump -r "rtmp://127.0.0.1:1935/cam1/stream" -v

Вывод видео вы получите пряма в консоль.

Подключение нашего потока к JWPlayer

Ну и последнее, что вам нужно будет сделать, так это зарегистрироваться на сайте www.jwplayer.com, получить код плеера и привести его к следующему виду:

<div id='player...'></div>
<script type='text/javascript'>
 jwplayer('player...').setup({
 file: 'rtmp://10.10.10.11:1935/cam1/stream',
 image: 'http://10.10.10.11/image/cam1/',
 width: '1280',
 height: '720',
 aspectratio: '16:9'
 });
</script>

Все, задача выполнена, наслаждайтесь!

Источники и прочие вспомогательные ресурсы:

  • https://www.sinyawskiy.ru/nginxrtmpmodule.html
  • https://help.ubuntu.com/community/FFmpeg
  • https://github.com/arut/nginx-rtmp-module
  • http://osdrive.ru/blog.php?page=entry&action=read&id=22
  • http://habrahabr.ru/post/117735/
  • https://toster.ru/q/128005
  • jwplayer.com
  • http://support.jwplayer.com/customer/portal/articles/1430358-using-rtmp-streaming
  • http://rugraphics.ru/forvideo/pleer-dlya-sayta-jw-player-oblachnoe-podklyuchenie
  • http://habrahabr.ru/post/162237/
  • https://obsproject.com/forum/resources/how-to-set-up-your-own-private-rtmp-server-using-nginx.50/
  • http://habrahabr.ru/post/145867/
  • http://habrahabr.ru/post/233237/
  • http://flance.onego.ru/2012/09/07/387
  • http://habrahabr.ru/post/188380/

Опубликовано p.b.Leo

WTF ?