Настройка веб-страницы веб-камеры

Веб-камеры не новы в Интернете и все еще невероятно популярны. Это проще, чем когда-либо, настроить страницу веб-камеры и стать одним из многих доступных веб-сайтов. Все, что вам нужно, это компьютер с веб-камерой, подключение к Интернету и сервер для размещения вашего сайта. Настройка не займет много времени.

Как настроить веб-камеру для прямой трансляции

Вот как настроить веб-камеру для работы с вашим сайтом:


  1. Выберите хостинг. Веб-хостинг — это сервер, который вы арендуете в Интернете для размещения своего сайта. Они обычно недороги и не требуют особого ухода. Вы можете сделать это практически с любым веб-хостингом.


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


  3. Выберите медиаплеер. VLC — это бесплатный медиаплеер с открытым исходным кодом, работающий на Windows, Mac и Linux. VLC поставляется со встроенными возможностями потоковой передачи.

    Кнопка загрузки на сайте VLC

    Перейдите на страницу загрузки VLC и загрузите последнюю версию установщика. Если вы используете Linux, VLC может быть найден в репозиториях вашего дистрибутива, поэтому проверьте сначала.


  4. Установите VLC. Мастер проведет вас через процесс установки VLC в вашей системе.

    Установить VLC


  5. Откройте VLC.

    VLC работает на Windows 10


  6. На главном экране VLC выберите СМИ.

    Вкладка «Медиа» в VLC Media Player в Windows


  7. Выбрать Ручей.

    Опция меню потока для VLC в Windows


  8. в Открытые СМИ диалоговое окно, выберите Устройство захвата Вкладка.

    Устройство захвата в VLC для Windows


  9. Выберите Название видеоустройства стрелка вниз и выберите вашу веб-камеру. Если вы планируете захватывать аудио тоже, выберите Название аудиоустройства стрелку раскрывающегося списка и выберите аудиоустройство. Затем выберите Ручей.

    Кнопка потока в VLC для Windows


  10. Проверьте источник вашего потока. VLC отображает местоположение вашей веб-камеры. Вы можете указать другой поток, но в большинстве случаев используйте значение по умолчанию.


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

    Можно создать несколько пунктов назначения, но HTTP — все, что вам нужно для вашего потока.


  12. VLC создает новую вкладку для вашего потока HTTP. Вкладка содержит две опции: одну для порта и одну для пути. Если у вас нет другого порта, использующего порт по умолчанию, оставьте его по умолчанию. Путь — это точный путь к вашему потоку, следующий за основным URL, и по умолчанию это http: // localhost: 8080 / path. в Дорожка текстовое поле, введите /ручей или что-то подобное, чтобы отделить поток от всего, что вы можете запустить.

    Вкладка HTTP в VLC для Windows


  13. Выберите профиль кодировки для вашего потока. Самый простой и универсальный формат для работы здесь — это OGG. Выберите Профиль стрелку раскрывающегося списка и выберите Видео — Theora + Vorbis (OGG). Используйте значок гаечного ключа для изменения определенных настроек, но профиль по умолчанию будет работать в большинстве случаев.

    Кнопка параметров кодирования (значок гаечного ключа) в настройках Stream Output в VLC для Windows


  14. Выберите Поток всех элементарных потоков установите флажок, затем выберите Ручей начать.

    Кнопка потока в VLC для Windows


  15. Ваш поток теперь работает на вашем компьютере в порту, который вы указали. Вы можете получить к нему доступ в некоторых браузерах и мультимедийных проигрывателях, используя IP-адрес вашего компьютера, а также указанный вами порт и путь. Если вы хотите сделать это для Интернета, разрешите доступ к вашей домашней сети из Интернета. Есть два способа сделать это.

    • Настройте переадресацию портов с вашего маршрутизатора на компьютер через порт, на котором работает ваш поток. Затем настройте динамический DNS из службы, такой как No-IP.com, чтобы убедиться, что ваш домашний IP-адрес не меняется. С помощью этого метода вы получаете доступ к своей камере таким же образом, но вы будете использовать внешний URL-адрес от No-IP, а затем номер порта и путь. Ваш адрес будет выглядеть так yourstream.no-ip.org:8080/stream.
    • Настройте VPN. Вы можете подключить как компьютер, так и сервер, на котором размещен ваш сайт, к VPN. Через VPN они будут вести себя так, как будто они находятся в одной локальной сети, что делает ваш поток доступным и легкодоступным для вашего сервера.


  16. Получив доступ к своей ленте, используйте текстовый редактор, чтобы написать базовый HTML-код, чтобы проверить, как ваша веб-камера будет отображаться на странице. Для чего-то минимального, используйте этот код на веб-странице:



    Тест веб-камеры





  17. Создайте тег HTML5 видео в теги. Установите атрибут источника в местоположение вашего потока.

     

     Чтобы проверить это локально на вашем компьютере, введите:

     


  18. Добавьте другие атрибуты для вашего видео, начиная с идентификатора, высоты и ширины.



  19. Добавьте информацию о видео. Укажите тип видео, кодек и способ его воспроизведения в браузере.



  20.  Ваш HTML-файл должен выглядеть аналогично этому примеру.



    Тест веб-камеры






  21.  Когда HTML выглядит правильно, сохраните файл.


  22. Откройте файл в браузере. Чтобы проверить его локально, щелкните файл правой кнопкой мыши и выберите браузер, например Chrome. В противном случае загрузите файл в корневой каталог HTML на вашем сервере. Поток веб-камеры воспроизводится в основном на пустой странице.

    Веб-камера VLC Stream в Chrome


Есть еще что вы можете сделать с вашей веб-камерой. Если вы планируете создать свой сайт с помощью WordPress, установите один из плагинов для веб-камеры. С этими плагинами все, что вам нужно сделать, это ввести адрес потока. Если вы сами создаете сайт, используйте видео тег HTML5 и обходите его.

Ссылка на основную публикацию