Stream-流对象
在介绍主要的房间/发布/订阅操作相关的 API 前,我想先介绍 Stream 这个基础类
媒体流是包含了媒体数据(视频,音频)的数据流,也就是我们在连麦过程中需要最经常操作的一种数据。
Stream 将媒体流进行了包装并结合了一些实际的业务数据
成员
name | 类型 | 介绍 |
---|---|---|
userId | string | 标记当前这个流属于哪个用户 |
isDestroyed | boolean | 这个流是否已经被销毁(发布者取消发布,发布者失去连接, 取消订阅...) |
muteAudio | boolean | 表示该流是否被静音 |
muteVideo | boolean | 表示该流是否被黑屏 |
enableAudio | boolean | 表示该流是否有音频轨道 |
enableVideo | boolean | 表示该流是否有视频轨道 |
video | HTMLVideoElement | 用来播放媒体流的 video 元素 |
play 播放媒体流 (同步)
参数 | 类型 | 备注 |
---|---|---|
containerElement | HTMLElement | 用来放置 video/audio 元素的上层 DOM 对象 |
isMute | boolean | 是否用 静音模式 播放 |
SDK 会在指定的元素下自动创建相应的 video/audio 元素播放媒体流
自动创建的元素有一个公共的 class 名称,qnrtc-stream-player
const containerElement = document.get...
stream.play(containerElement);
v0.2.0 之前的版本请直接传入 video/audio 元素
onAudioBuffer 获取音频 PCM 数据 (同步)
参数 | 类型 | 备注 |
---|---|---|
callback | (buffer: Float32Array) => any | 接收音频数据的回调 |
bufferSize | number | 每次获取的音频数据长度,默认为 4096 (只能为 2 的 n 次方,且处于 256 - 16384 之间) |
通过指定的 callback 获取音频数据
stream.onAudioBuffer(buffer => {
// buffer 为一个长度为 2048 的 Float32Array
console.log('get audio buffer data', buffer);
}, 2048)
getCurrentTimeDomainData 获取当前音频的时域数据 (同步)
通常用于音频可视化的数据,可以配合 requestAnimationFrame 和 canvas
实现绘制声波图
返回: 尺寸为 2048 的 Unit8Array
示例代码参考 AudioWave
getCurrentFrequencyData 获取当前音频的频域数据 (同步)
通常用于音频可视化的数据,可以配合 requestAnimationFrame 和 canvas
实现绘制音域图
返回: 尺寸为 2048 的 Unit8Array
示例代码参考 AudioWave
getStats 获取当前传输状态信息 (同步)
包括丢包率,实时码率等信息
返回的具体格式参考下面的返回类型介绍
Safari 暂时不支持此功能
返回: StatsReport
const report = stream.getStats();
console.log("音频丢包数", report.audioPacketLoss);
setAudioBufferData 输入外部音频数据 (同步)
只能在采集端且开启了外部音频输入后才能使用 具体使用方法参见 外部音频输入