Javascript 如何选择当前正在播放的MediaStreamTrack？

我有一个

MediaStream

，有一个音频曲目和两个视频曲目。此流是通过将来自

navigator.mediaDevices.getUserMedia

的音频和视频曲目与来自

navigator.mediaDevices.getDisplayMedia

的视频曲目组合而创建的

var camStream=wait navigator.mediaDevices.getUserMedia（{audio:true，video:true，width:“1280”}）；
var screenStream=await navigator.mediaDevices.getDisplayMedia（{video:true，width:“1280”}）；
var screenTrack=screenStream.getVideoTracks（）[0]；
camStream.addTrack（屏幕跟踪）；

此时，

camStream

有1个音频曲目和2个视频曲目

我有一个HTML元素

，我通过设置srcObject属性来播放流：

document.getElementById（“本地视频”）.srcObject=camStream；

问题是我无法选择播放哪一首曲目。camStream视频曲目始终在屏幕流视频曲目上播放是否有一种方法可以将两个视频曲目保留在流中，但选择当前正在视频元素中播放的曲目？

到目前为止，唯一有效的方法是从流中删除一个视频曲目，以便另一个可以播放，但我希望将两个视频曲目都保留在流中，以便我可以切换它们。

和应该是解决此问题的一般解决方案，但到目前为止，浏览器支持还不是很好，因为没有任何浏览器真正正式支持这一功能，也没有任何浏览器支持MediaStreams

下面是一个片段，展示了它应该是怎样的，但这是为了将来

const vid=document.querySelector（“视频”）；
const btn=document.querySelector（“按钮”）；
const track1=makeVideoTrack（“红色”）；
const track2=生成视频跟踪（“蓝色”）；
const stream=新媒体流（[track1，track2]）；
vid.srcObject=流；
btn.onclick=（）=>{
//将一个轨迹设置为“选定”将取消选择以前选择的轨迹
//所以我们需要抓住当前状态来切换它
const state=video.videoTracks[0]。已选中；
vid.videoTracks[1]。选中=状态；
vid.videoTracks[0]。所选=！状态；
};
函数makeVideoTrack（彩色）{
const canvas=document.createElement（“canvas”）；
const ctx=canvas.getContext（“2d”）；
ctx.fillStyle=颜色；
设x=0；
常量动画=（）=>{
x=（x+1）%canvas.width；
clearRect（0，0，canvas.width，canvas.height）；
ctx.fillRect（x-5,0,10，画布高度）；
请求动画帧（anim）；
};
动漫（）；
返回canvas.captureStream（）.getVideoTracks（）[0]；
}

切换视频曲目

谢谢Kaido。如果你能做VideoTrack，那就太好了。选择=真的。是的，对。。。还要注意的是，我确实编辑了这个问题，因为你接受了它，我的第一个修订版依赖于Chrome和Firefox的行为，但根据规范，这个行为不应该依赖，事实上Safari已经偏离了它。