使用JavaScript在WebSocket上进行视频流式传输


84

使用JavaScript直播视频的最快方法是什么?TCP上的WebSockets是否足够快,可以流传输30fps的视频?


1
格特G:您会推荐什么?我希望保持相对较低的内存消耗,这就是为什么JS(更新HTML5画布)似乎可以提供更好的速度,因此它似乎是一个更好的选择。
SMiLE 2010年

1
糟糕,忘了提及我对实时流式传输感兴趣,而不仅仅是对存储在文件中的某些视频进行流式传输。<video>可以提供吗?
SMiLE 2010年

2
我不会太在意流传输部分,而是会如何以这种方式渲染流传输的视频。那有可能吗?
deceze

4
对于速度反对者来说,这些是使用HTML 5的快速帧和视频速率的示例:The Wilderness Downtown(Chrome,视频)thewildernessdowntown.com和Quake in HTML 5(Chrome,帧速率)techcrunch.com/2010/04/01/ google-html5-quake几个概念证明。这只会改善。如果有人还没有,那么有人将尽快赶上潮流,并从成为市场早期参与者的中获得好处。我会为IE屏住呼吸吗?我不知道
约翰·K

2
感谢您的示例,John K.
SMiLE 2010年

Answers:


78

TCP上的WebSockets是否足够快,可以流传输30fps的视频?

是的..是的,看看这个项目。Websocket可以轻松处理高清视频流。但是,您应该选择自适应流。我在这里解释如何实现它。

当前,我们正在开发基于Web的即时消息应用程序,该应用程序具有聊天,文件共享和视频/网络摄像头支持。通过一些技巧,我们通过websockets获得了流媒体(使用HTML5 Media Capture从我们的网络摄像头获得了流)。

您需要构建stream APIMedia Stream Transceiver控制媒体的相关处理和传输。


4
太好了,谢谢!我想我将尝试一种根本不适应的视频流的非常基本的实现,查看结果,并据此进行;知道这是可能的,但这确实令人鼓舞!您的教程也非常有帮助。
SMiLE

1
是的..从一个简单的应用程序开始是一个好习惯。您将必须自行构建实时流式传输所需的大多数技术,而在以下情况下,这可能不是一个选择:A.刚开始而B.一个人。祝好运。
Wouter Dorgelo

@ Mr.Pallazzo您要为该应用程序做什么?业务?我有机会就您的运作方式与您取得联系吗?
Alistair

@WouterDorgelo通过网络套接字进行高清流传输时,您的应用程序性能如何?
夸克

我们可以使用录制视频CCTV并将其实时显示在网页中Javascript吗?
shaijut


0

要回答这个问题:

使用JavaScript直播视频的最快方法是什么?TCP上的WebSockets是否足够快,可以流传输30fps的视频?

是的,Websocket可以用于传输30 fps甚至60 fps。

Websocket的主要问题是它是低级的,您不仅要传输视频块,还必须处理其他问题。总而言之,这是视频和音频的绝佳传输方式。


那么,WebRTC呢?它(与w3c一样)正在UDP连接上工作,如果我们有一些数据包丢失,那将不是问题。另一方面,WebSocket是面向连接的,由于可能发生的延迟,它可能会打扰用户。
M. Rostami

-1

这绝对是可以想象的,但我不确定我们还在那里。同时,我建议您将SilverlightIIS平滑流一起使用。Silverlight基于插件,但可在Windows / OSX / Linux上运行。有朝一日,HTML5<video>元素将成为未来的发展之路,但这将缺乏支持。


感谢您的答复。我同意在这一点上Silverlight和Flash可能是更好的选择。我想我对Javascript流感兴趣,因为它为用户和(视频传输)服务器之间的交互提供了更多可能性。
SMiLE 2010年

我必须同意Josh ..如果您现在迫切需要流媒体,请不要使用HTML5。
Wouter Dorgelo

6
以防万一有人还在读这篇文章:Silverlight的第一版从未支持Linux或移动系统。Linux silverlight支持根本就不存在。其次,正如新的答案正确指出的那样,HTML5 / MSE视频流现在在现代浏览器中非常有可能,并且在几乎所有情况下都应优先于任何基于插件的方法。
ntninja

3
如果有人还在读这篇文章,那一天就到了。为了对上帝的爱,不要使用Silverlight
Zannith
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.