Поиск в системе
Результаты поиска по тегам 'video-js'.
Найдено 1 результат
-
Возникла задача организовать закрытую трансляцию камер на сайте. Ни один из стандартных вариантов (https://devline.ru/translation/) не подошёл, предложенные на форуме способы тоже не устроили. На скорую руку было набросано решение на nginx (нужен для корректной работы по HTTPS) и Video.js (собственно сам плеер). Плюсы: Полноценное HTML5 видео со всеми вытекающими. Поддерживается Internet Explorer (по меньшей мере Windows 7/IE11 или новее, на более старых не проверял). Поддержка работы по HTTPS без каких-либо предупреждений. Скрыт реальный адрес сервера с «Линия IP». Не используются сторонние сайты. Разграничение доступа по пользователям. Минусы: Весь трафик идёт через ваш сервер. В конфиг nginx надо будет добавить: server { listen 443 ssl http2; root /usr/local/www/video; server_name video.example.com; ssl_certificate fullchain.pem; ssl_certificate_key privkey.pem; location / { auth_basic "My video server"; auth_basic_user_file htpasswd; } location /cameras/ { proxy_pass http://devline.server.local:9786/cameras/; } } Вместо devline.server.local указываем имя или IP-адрес вашего сервер «Линия IP». В файле htpasswd необходимо прописать имена пользователей и пароли (по паролям читаем документацию), которые совпадают с соответствующими пользователями на сервере «Линия IP» и которым необходимо дать доступ к трансляции. Для работы потокового вещания потребуется библиотека HLS для Video.js. Пример кода: <!doctype html> <html lang="ru"> <head> <meta charset="utf-8"> <title>Видеонаблюдение</title> <link href="css/video-js.min.css" rel="stylesheet"> <script src="js/videojs-ie8.min.js"></script> <script src="js/video.js"></script> <script src="js/lang/ru.js"></script> <script src="js/videojs-flash.min.js"></script> <script src="js/videojs-http-streaming.min.js"></script> </head> <body> <video id="video" class="video-js vjs-default-skin" width="640" height="360" poster="//video.example.com/cameras/0/image?resolution=640x360" preload="none" controls data-setup='{"language": "ru"}'> <source src="//video.example.com/cameras/0/streaming/main.m3u8" type="application/x-mpegURL" /> <p class="vjs-no-js">Для просмотра этого видео, пожалуйста, включите JavaScript и убедитесь, что ваш браузер поддерживает HTML5-видео.</p> </video> </body> </html>
