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 }

//指定视频流的宽高，注意宽高比和采集到的不一样的时候会自动裁剪