Web开发 媒体流遇到的坑

1.浏览器提示 webMediaPlayer 过多

问题真实原因

浏览器发现有多个webMediaPlayer 总数超过最大限制 (在谷歌浏览器中 PC 75个 移动端40个)
[Intervention] Blocked attempt to create a WebMediaPlayer as there are too many WebMediaPlayers already in existence.

问题出现后表现的现象

新增的video/audio标签不能播放音视频,一直为加载状态

寻找问题原因

1.你的网页上真的是有那么多超过了限制
2.你没有正确的去移除video/audio标签 导致webMediaPlayer 没有释放

解决方案

如果你遇到的问题是1那么请优化你的项目.

问题2的解决方法

正确的移除video/audio标签
在remove掉video/audio标签之前将绑定在video/audio 媒体 移除掉 之后再将其remove掉

var videoTag =document.getElementsByTagName('video');
videoTag.src=null;
videoTag.srcObject=null;  
videoTag.remove()

2.如果你的项目 媒体流中的视频轨道可能会无数据 但是音频有数据

你想一直播放音频 视频有就放,没有就放一个遮罩

video标签在没有视频轨道数据时,即使有音频轨道数据你调用play()不会播放,会一直加载直到视频数据时才会开始播放.
在video已经播放一段时间时视频轨道无数据,仍会继续播放音频.
1.考虑音视频分成两个标签放 (可能出现音视频不同步)
2.待完善

3.(MediaStreamTrack)视频轨道 stop()与enabled=fales的区别

enabled
在enabled该属性上的 MediaStreamTrack接口是一个布尔值，它是 true如果被允许呈现源流的音轨或 false如果它不是。这可用于有意将轨道静音。
启用时，曲目的数据从源输出到目的地；否则，输出空帧。
在音频的情况下，禁用的轨道会生成静音帧（即，每个样本的值为 0 的帧）。对于视频轨道，每一帧都完全用黑色像素填充。
的值enabled本质上代表了典型用户会认为轨道的静音状态，而muted属性表示轨道暂时无法输出数据的状态，例如在传输过程中丢失帧的场景.
当true,enabled表示允许轨道将其实际媒体呈现到输出。当enabled被设定为 false，轨道只生成空帧。
空音频帧的每个样本的值都设置为 0。空视频帧的每个像素都设置为黑色。
如果MediaStreamTrack代表来自摄像头的视频输入，通过设置禁用轨道enabled，以false同时更新设备的活动指标显示相机当前未录制或直播。例如，当轨道以这种方式静音时，iMac 和 MacBook 计算机中摄像头旁边的绿色“使用中”指示灯会关闭。
上面是MDN文档中给出的
实际表现为当enabled被设定为 false，轨道只生成空帧,使用WebRTC传输仍然占用网络带宽,在win系统下仍然占用摄像头

4.关于RTC的stream,track,

rtcpc.removeTrack(sender);
当你的
rtcpc.addTrack(track); 不生效时(这需要重新协商)

在关闭时不移除sender,只停掉track.stop();
试试这个
sender.replaceTrack(track);