WebRTC教程—音频与视频

作者:deepstreamHub(原文链接

翻译:刘通

原标题:WebRTC 03: Audio & Video

上一篇:WebRTC教程—多到多连接

一旦你知道了如何在两个对等端之间建立WebRTC连接之后,在连接中加入音频和视频流就会变得出乎意料的简单。

a&v1

(点击图片跳转到原文查看例子)

首先我们需要使用浏览器的navigator.getUserMedia来获取用户麦克风和摄像头的权限。在我们可以使用一个流的时候,我们储存一份作为参照,使用URL.createObjectURL( stream )将其加到视频元素上,然后建立我们的P2P连接。

a&v2

当建立连接的时候,我们将流作为一个参数加到里面:

a&v3

只要数据流变得可用,就会在另一个客户端处触发一个‘stream’事件。在接收到这个事件之后我们要再次将它加到一个HTML5视频标签上。

a&v4

这基本就是需要建立简单音视频聊天的全部过程了。请点击此处查看完整代码,或者在多个标签页中打开此网页然后用下面的demo与自己聊天。

真的只需要这些吗?

如果你经常使用视频会议软件,你就会深刻意识到这点:软件工作的不是很好。可靠的视频聊天是一个很难实现的目标,就像Google和Skype这种网络巨头也是费了很大劲才能提供可靠且高质量的视频流。

WebRTC也是一样。如果你尝试了本章的demo,它可能运行的还不错—因为这只是在局域网中数量不多的用户之间的对话。对于更大的使用案例,你很有可能不想使用端到端连接,而是将你的视频流传输到一个服务器上。

这个服务器可以被称作选择性传输单元(Selective Forwarding Unit,SFU),比如Jitsi的视频桥,或者像Janus这样的WebRTC网关。

你也可以从众多的云服务器供应商中选择一个,比如TokBox或者Skylink

点击下图跳转原文来自己尝试一下这个示例

a&v5

 

填写常用邮箱,接收社区更新

WebRTC 中文社区由

运营