音频与视频源添加到WebRTC对等连接流对象

2024-01-09 23:15:41

WebRTC的addTransceiver()和addTrack()方法：为实时通信添加媒体流

简介

WebRTC（Web实时通信）是一项强大的技术，它使网络浏览器能够直接进行实时通信，无需插件或其他第三方软件。addTransceiver()和addTrack()方法是WebRTC中的两个关键方法，用于将音频或视频流添加到对等连接中。

`addTransceiver()`方法

用法：

addTransceiver(kind, init)

参数：

kind: 指定要添加的媒体类型，可以是"audio"或"video"。
init: 一个可选对象，包含以下属性：
- direction: 指定流的方向，可以是"sendrecv", "sendonly", "recvonly"或"inactive"。
- streams: 一个MediaStream数组，指定要添加到流中的流。
- sendEncodings: 一个RTCRtpEncodingParameters数组，指定发送流的编码参数。
- receiveEncodings: 一个RTCRtpDecodingParameters数组，指定接收流的解码参数。

作用：

addTransceiver()方法允许您指定要添加的媒体类型，并提供可选的参数来控制流的方向和编码设置。

`addTrack()`方法

用法：

addTrack(track, streams)

参数：

track: 要添加到流中的MediaStreamTrack。
streams: 一个可选的MediaStream数组，指定要添加到流中的流。

作用：

addTrack()方法允许您直接添加一个MediaStreamTrack到连接中，例如来自麦克风或摄像头的轨道。

何时使用哪种方法？

使用addTransceiver()： 当您需要控制流的类型和配置时，例如指定特定的编码设置或流的方向。
使用addTrack()： 当您只想将现有的MediaStreamTrack添加到连接中时，例如从麦克风或摄像头。

代码示例

以下是如何使用addTransceiver()和addTrack()方法添加音频和视频流到WebRTC连接中的示例：

// 创建一个新的WebRTC对等连接
const pc = new RTCPeerConnection();

// 使用addTransceiver()添加一个音频流
pc.addTransceiver('audio', {direction: "sendrecv"});

// 使用addTrack()添加一个视频流
const videoTrack = document.querySelector('video').srcObject.getVideoTracks()[0];
pc.addTrack(videoTrack);