WebRTC学习总结(1):本地视频的获取和录制
简单介绍
WebRTC ( Real-Time Communications)是一个可以在 Web 应用程序中实现音频、视频和数据的实时通信的开源项目,它封装了很多音视频的采集、处理功能,比如音视频流的编解码、降噪和回声消除等。通过WebRTC,我们可以方便地获取优化后的媒体流,将其输入到本地或转发给其他对等端。
WebRTC设计的初衷是为了在无插件的条件下实现两个浏览器之间**点对点(peer to peer,P2P)**连接,从而进行音视频的实时通信。这种通信模式大多数情况下不需要依赖于服务器的中转,WebRtc只适合小范围(8人以内)音视频会议,
在这端时间的学习中,我主要实现了以下功能:
1. 本地视频的播放
2. 视频录制
3. 一对一视频对话
4. 一对多视频对话
5. 多对多视频对话
下面就把我这段时间学习和实践的内容整理一下。
1. 本地视频的播放
本地视频流的获取是webRTC最基本也是最简单的功能,用到的API是getUserMedia
,调用方法如下:
navigator.mediaDevices.getUserMedia({
audio: ture,
video: true
}) //约束条件
.then(gotLocalMediaStream)
.catch(function (e) {
alert('getUserMedia() error: ' + e.name);
});
function gotLocalMediaStream(mediastream) {
console.log('>>>>正在打开本地摄像头');
localStream = mediastream;
localVideo.srcObject = mediastream;
}
上面代码中的约束条件(constraints)可以用来指定和媒体流有关的属性,比如:
// 只要视频流
{
audio: false, video: true }
//指定视频流的宽高,注意宽高比和采集到的不一样的时候会自动裁剪