- 18.08.2010
Завдання таке: з мінімальними зусиллями вставити живе відео з домашньої веб-камери на сайт під управлінням WordPress.
Будемо вважати, що веб-камера вже підключена, налаштована і нормально працює.
підготовка:
- Завантажити та встановити VLC media player для Windows (відкрийте посилання, на головній сторінці велика синя кнопка «Download VLC»). VLC буде здійснювати кодування і потокове мовлення.
- завантажити FlowPlayer (Знадобиться для тестування, а також якщо ваш сайт не на движку WordPress). FlowPlayer - це flash-плеєр, який буде безпосередньо здійснювати показ відео. В принципі його можна замінити будь-яким іншим плеєром, який вам більше до смаку.
Налаштування VLC:
- Відкрити VLC media player.
- Для початку просто переглянути відео з веб-камери в VLC плеєрі. У головному меню відкриваємо Медіа -> Відкрити пристрій захоплення:
Тестуємо веб-камеру + VLC
- У графі «Назва відео-пристрої» вибираємо свою веб камеру (у мене Logitech Webcam 250). У графі «Назва аудіо-пристрої» вибираємо мікрофон веб-камери (у мене Microphone Logitech Mic (Webcam 250)). Після цього натискаємо кнопку Відтворити. Якщо все правильно, ви побачите відео зі своєю веб-камери.
- Переконавшись, що камера працює переходимо до налаштування потокового мовлення. Відкриваємо Медіа -> Потокове мовлення -> закладка Пристрій захоплення. Також як і в попередньому пункті вибираємо пристрій захоплення відео і аудіо. Натискаємо на кнопку Потік.
- У вікні, знаходимо кнопку Наступний, натискаємо її і потім ще раз. У підсумку ви повинні побачити ось таке вікно:
VLC - потокове мовлення
В поле «Рядок введення для генерованого потоку» вставляємо:
: Sout = # transcode {vcodec = h264, vb = 300, ab = 64, fps = 25, width = 256, height = 192, acodec = mp3, samplerate = 44100}: duplicate {dst = std {access = http {mime = video / x-flv}, mux = ffmpeg {mux = flv}, dst =: 7777}}Розглянемо параметри докладніше:
vcodec = h264 - відео кодек H264;
acodec = mp3 - аудіо кодек;
vb = 300 - відео бітрейт (чим вище, тим вище якість і вимоги до смуги пропускання);
ab = 64 - аудіо бітрейт (чим вище, тим вище якість і вимоги до смуги пропускання);
fps = 25 - кількість кадрів в секунду;
width = 256, height = 192 - відповідно ширина і висота зображення;
samplerate = 44100 - частота дискретизації звуку.Ці параметри можна варіювати і тим самим покращувати / знижувати якість зображення ну і як наслідок вимоги до смуги пропускання. Що стосується конкретних цифр, то вони взяті мною з videolan.org з прикладу для простих веб-трансляцій. Для перегляду в невеликому вікні плеєра (до 640х480) якість цілком нормальне)
dst =: 7777 - найважливіший параметр, що визначає мережевий порт (TCP) по якому буде здійснюватися мовлення. У моєму випадку: 7777 (ви можете вибрати будь-який інший не зайнятий порт). Порт повинен бути відкритий в брандмауері. Якщо підключення до Інтернет здійснюється через роутер, то на роутері необхідно додатково налаштувати форвардного цього порту.
Після налаштування параметрів, натискаємо на кнопку Потік.
- Якщо все працює правильно, то повинен засвітитися роботи на веб-камері, а також в рядку стану VLC плеєра повинна бути напис «Передача потокового»:
Йде потокова передача
- Щоб остаточно переконатися, запускаємо Flowplayer на локальному комп'ютері. Для цього розпаковуємо раніше скачаний архів (можна прямо на робочий стіл, щоб ближче). В архіві папка example, в ній файл index.htm - відкриваємо його в блокноті. Шукаємо рядок: http://pseudo01.hddn.com/vod/demo.flowplayervod/flowplayer-700.flv і замінюємо її на http: // localhost: 7777, де 7777 раніше обраний порт веб-трансляції. Зберігаємо файл, і запускаємо його подвійним клацанням. Відкриється браузер за замовчуванням. Якщо це експлорер, то ви побачите вгорі попередження про заблокованого документа - все дозволяємо. В результаті відкриється сторінка з плеєром. Завантаження трансляції може зайняти до 30 сек. На початку (10-15 сек.) Можуть бути проблеми з якістю (наприклад у мене все зелене).
Вставляємо трансляцію на сайт WordPress:
- Необхідна умова: інтернет-провайдер повинен надати вам зовнішній статичний або зовнішній динамічний ip-адреса. У разі зовнішнього динамічного адреси (на сьогоднішній день найбільш часто зустрічається тип адреси) необхідно додатково налаштувати сервіс DDNS .
- Встановлюємо і активуємо плагін FV WordPress Flowplayer (З безлічі інших плагінів, він мені сподобався найбільше). Після установки досить вставити на сторінку наступний шорттег: [flowplayer src = 'http: //89.235.17.66: 7777' width = 520 height = 330 autoplay = true]
де 89.235.17.66 - ваш зовнішній ip-адреса або доменне ім'я DDNS, 7777 - порт веб-трансляції.
- Увага! Якщо ви підключені до Інтернет через роутер, ввідео на сайті може не програватися (для вас). Переконатися, що трансляція працює, можна, відкривши сайт з будь-якого іншого комп'ютера не з вашої локальної мережі (наприклад попросити зайти на сайт одного).