將H.264直播流發送到Nginx併發布爲HLS以嵌入到網站

Question

根據this發佈我試圖在網頁上顯示來自IP攝像機（AXIS M1145-L + CamStreamer插件）的H.264實時流而不使用任何外部瀏覽器插件（僅純HTML5）和桌面。

由於I`ve讀有有可能用的Video.js和HLS做到這一點，所以這是我曾嘗試：

Stream from camera (push to rtmp with CamStreamer) --> to nginx (rtmp module) --> 
nginx serves HLS --> display with video.js and videojs-hls plugin in browser 

一邊看它單曲使用HLS URL中VLC流（http://192.168.1.105:8080/hls/movie.m3u8）我沒有任何問題或滯後，但我無法使用video.js在瀏覽器中工作。

它總是報告我無效媒體。

• 流中的VLC +編解碼器的信息： http://s8.postimg.org/vb63fgfwh/codec.png

• 我nginx的配置：http://pastebin.com/9GuAMuBx

• HTML源代碼：http://s8.postimg.org/dwlv76irl/error_html.png

：在鍍鉻 http://pastebin.com/QGmEamjT

輸出

原始流被推向：RTMP：//192.168.1.105：1935/HLS /電影

192.168.1.105是其中nginx的運行的機器。然後

的HLS流是http://192.168.1.105:8080/hls/movie.m3u8

入店我完全想避免是需要重新編碼在哪裏它會在以後運行視頻的機器沒有做到這一點，它的力量也將是一個完整的高清視頻流。這就是爲什麼我放棄FFmpeg（需要重新編碼Mp4進行實況流傳輸）。此外，該機器不會有連續的互聯網接入，因此在線轉碼也是不可能的。

請幫忙。謝謝 ！

Answer 1

終於明白了。

使用hls.js庫（https://github.com/dailymotion/hls.js）獨立沒有 video.js做了詭計。該視頻在Windows 7上的Chrome/Opera中播放效果良好。尚未與其他人一起嘗試。

所以我猜這是video.js的player/codec dependend問題。

帶播放器的html頁面需要在服務器上（不是本地文件系統！），否則瀏覽器安全限制將到位，阻止視頻播放。注意到，雖然hls.js演示工作在同一個流，但從瀏覽器中的本地HTML頁面嘗試。

謝謝你的提示！

Answer 2

我遇到了一個類似的問題，試圖讓Video.js播放器（使用HLS contrib模塊）在PC/Chrome中加載HLS流。播放器將顯示「媒體無法加載......因爲格式不被支持。」

我後來發現它在Mac/Safari和PC/MS Edge瀏覽器中表現良好。

對HLS的全面瀏覽器支持仍然相當缺乏。 https://www.jwplayer.com/html5/#adaptive-streaming

我已經與Bitmovin的玩家Bitdash成功，並意識到這是一個瀏覽器問題（不是流或nginx問題）。