使用 vlc 将 mp4 流式传输到 html 浏览器

Posted

技术标签:

【中文标题】使用 vlc 将 mp4 流式传输到 html 浏览器【英文标题】:Streaming mp4 with vlc to html browser 【发布时间】:2012-07-02 22:27:51 【问题描述】:

我在将网络摄像头图片(无声)流式传输到 html 页面时遇到问题。我正在使用最新的(v2.0.2 vlc for windows)进行流式传输,这是命令行:

"c:\Program Files (x86)\VideoLAN\VLC\vlc.exe" -I dummy  dshow:// --dshow-vdev="Logitech QuickCam Chat" --dshow-adev=none --dshow-caching=0 --sout=#transcodevcodec=h264,vb=1024,channels=1,ab=128,samplerate=44100,width=320:httpmux=ts,dst=:8080/webcam.mp4 

当我在另一个 vlc 播放器 (http://127.0.0.1:8080/webcam.mp4) 中打开流时,我可以观看流,但是当我尝试将其嵌入网页时,我可以看到没有!这是代码:

<!DOCTYPE html>
<html>
  <head>
    <title>Video Test</title>
  </head>
  <body>
    <video id="video" class="projekktor" autoplay="autoplay"  preload="metadata">  
      <source src="http://127.0.0.1:8080/webcam.mp4" />
            Your browser doesn't appear to support the HTML5 <code>&lt;video&gt;</code> element.  
    </video>
  </body>
</html>

比我尝试在浏览器中打开它:

file:///C:/videostreaming/video.html

我在 chrome 示例中可以看到,有网络流量,正在下载流,但没有显示。

【问题讨论】:

你解决过这个问题吗?我遇到了类似的问题,很想知道您是如何解决的。 @cssyphus 不,我没有,但如果你能做到,请不要忘记回答这个问题。 :) @balazs 我遇到了完全相同的问题,但我没有在此页面上找到答案。有进展吗? 【参考方案1】:

您不能使用 VLC 通过 http 协议传输 mp4

点击此链接查看输出方法/复用器矩阵 http://www.videolan.org/streaming-features.html

不过您可以尝试转码为 ogg。

试试这个:

"c:\Program Files (x86)\VideoLAN\VLC\vlc.exe" \
-I dummy  dshow:// --dshow-vdev="Logitech QuickCam Chat" \
--dshow-adev=none --dshow-caching=0 \
--sout=#transcodevcodec=theo,vb=1024,channels=1,ab=128,samplerate=44100,width=320:httpdst=:8080/webcam.ogg

在您的 html 视频标签中:

<source src="http://127.0.0.1:8080/webcam.ogg"/>

【讨论】:

是否可以为 -I 输入而不是网络摄像头提供 rtmp 流?【参考方案2】:

尝试添加视频类型(type="video/mp4"):

<video   controls="controls">
      <source src="movie.mp4" type="video/mp4" />
      <source src="movie.ogg" type="video/ogg" />
      Your browser does not support the video tag.
    </video>

【讨论】:

不幸的是它没有帮助。 如果这不起作用,您可以尝试将其转换为 ogg 视频。 vlc 也可以做到这一点及其 html5 视频功能 从我的 chrome 看来,我的 chrome 是作为应用程序/八位字节流传入的。我认为除非将其视为视频/mp4,否则它不会出现。您可以转到 VLC 的高级首选项并在 HTML 流选项中将 MIME 类型设置为 video/mp4 将 MIME 类型设置为 video/mp4 也不能解决问题。当我使用 theora (video/ogg) 流式传输时,MIME 也是 application/octet-stream,它可以工作。但我想流式传输 mp4 格式。【参考方案3】:

你告诉 VLC 以 ​​TS 格式流式传输 mux=ts 这是你的问题,你需要在 mp4 中复用

【讨论】:

mp4 不是 mux (videolan.org/doc/streaming-howto/en/ch03.html) 的有效选项。【参考方案4】:

对于直播,您应该使用以下内容

<video id="video" src="http://localhost:8181/stream" type="video/ogg; codecs=theora" autoplay="autoplay"/>

更多信息 这是a link!

请注意:仅限视频类型“ogg”!

【讨论】:

以上是关于使用 vlc 将 mp4 流式传输到 html 浏览器的主要内容,如果未能解决你的问题,请参考以下文章

如何减少延迟 - 来自网络摄像头的 VLC 流式传输

将 h.264 流包装在 mp.4 容器中并使用 nodejs 流式传输

将 mp4 文件流式传输到其他网站

AWS ElasticBeanStalk 上的解析服务器不会将 .mp4 PFFile 流式传输到 AVPlayer?

使用 rails、nginx 和 send_file 在 Chrome 中流式传输 mp4

如何将 Django 3 中的 mp4 视频流式传输到 Vue.js