Html 如何在 HTML5 中流式传输实时视频?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5623912/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 07:54:23  来源:igfitidea点击:

How to stream live video in HTML5?

htmlstreamingmp4rtsprtp

提问by user702470

I'm looking for a way to broadcast a live video taken from a webcam or camera rooted to a PC. The broadcast should be displayed in a HTML5 page using the tag (which support rtp, and rtsp I think).

我正在寻找一种方法来播放从根植于 PC 的网络摄像头或相机拍摄的实时视频。应该使用标记(我认为支持 rtp 和 rtsp)在 HTML5 页面中显示广播。

The user viewing the stream should not have to install any plug-in or video player such as QuickTime.

查看流的用户不必安装任何插件或视频播放器,例如 QuickTime。

I need the video to be in mp4 format such as: rtsp://www.mywebsite/streaming/video.mp4

我需要视频为 mp4 格式,例如:rtsp://www.mywebsite/streaming/video.mp4

This would be the link I'd put as the src of the html 5 video tag.

这将是我作为 html 5 视频标签的 src 放置的链接。

So I'd like to know if it's possible, what are my options to do such things.

所以我想知道是否有可能,我有什么选择来做这些事情。

回答by Karl Laurentius Roos

It's possible. But you will have major problems if you're looking for cross browser support. What you can do is offer HTML5 video to the browsers supporting it and then offer QuickTime for browsers not supporting it.

这是可能的。但是,如果您正在寻找跨浏览器支持,则会遇到重大问题。您可以做的是向支持它的浏览器提供 HTML5 视频,然后为不支持它的浏览器提供 QuickTime。

<video src="stream.mp4">

    <!-- Don't support <video> -->
    <object>
        <param name="src" value="video.mp4" />
        ?    <param name="autoplay" value="true" />
        ?    <param name="type" value="video/quicktime" height="256" width="320" />
        ?    ?    <embed src="video.mp4" height="256" width="320" autoplay="true" type="video/quicktime" pluginspage="http://www.apple.com/quicktime/download/" />
    </object>

</video>

Also see: Streaming via RTSP or RTP in HTML5

另请参阅:在 HTML5 中通过 RTSP 或 RTP 流式传输

回答by ciphor

I don't think it is possible now to "cheat" the HTML5 browser to encapsulate the live video stream to a ".mp4" file. I believe HTML5 will consider live video support in a near future. What you can do is just wait. :)

我认为现在不可能“欺骗”HTML5 浏览器将实时视频流封装到“.mp4”文件中。我相信 HTML5 会在不久的将来考虑支持实时视频。你能做的就是等待。:)

回答by pg200890

For maximum compatibility, here's what our video workflow will look like, Make one version that uses H.264 baseline video and AAC “low complexity” audio in an MP4 container & Make another version that uses WebM (VP8 + Vorbis) or Theora video and Vorbis audio in an Ogg container. I think this combination solves your problem & it plays on most of browsers. You should required at least two versions of Video to play in all the browsers.

为了获得最大的兼容性,我们的视频工作流程如下所示,在 MP4 容器中制作一个使用 H.264 基线视频和 AAC“低复杂度”音频的版本并制作另一个使用 WebM (VP8 + Vorbis) 或 Theora 视频的版本和Ogg 容器中的 Vorbis 音频。我认为这种组合可以解决您的问题,并且可以在大多数浏览器上播放。您应该需要至少两个版本的 Video 才能在所有浏览器中播放。