TypeError: MediaStreamTrack.replaceTrack不是一个函数

Question

视频链接已经启动并运行。您可以为自己禁用/启用视频/音频，并且通过套接字为视频会议的其他参与者更新此状态。但我不能分享主机的屏幕，主机本身显示屏幕正在广播，但其他参与者继续播放网络摄像头。

在评估时，允许所有视频聊天参与者共享屏幕，我得到一个错误：

TypeError: videoStream.replaceTrack不是一个函数

const screenShare = () => {
    console.log('use!')
    if (!screenShareStatus) {
        // @ts-ignore
        navigator.mediaDevices.getDisplayMedia({cursor: true})
            .then((currentStream) => {
                const screenTrack = currentStream.getTracks()[0];
                // const screenTrack = currentStream.getVideoTracks()[0];
                const videoStream = localMediaStream.current.getTracks().find((track) => track.kind === 'video'); // camera
                console.log('videoStream: ', videoStream);
                videoStream.replaceTrack(screenTrack);
                setScreenShareStatus(true);
            }).catch((error) => {
                console.log('error: ', error)
            });
    } else {
        // @ts-ignore
        screenTrackRef.current.onended();
    }
};

实际上，我并没有在MediaStreamTrack对象上找到这个方法，那么如何更改视频源呢？在所有的例子中，人们对此都没有问题。

​

Answer 1

确实没有MediaStream#replaceTrack()方法；您可以使用removeTrack() + addTrack()来代替：

​

const stream = generateStream("red");
document.querySelector("video").srcObject = stream;

document.querySelector("button").onclick = (evt) => {
  evt.target.remove();
  const prevTrack = stream.getVideoTracks()[0];
  const newTrack = generateStream("green").getVideoTracks()[0];
  stream.removeTrack(prevTrack);
  stream.addTrack(newTrack);
};

function generateStream(color) {
  let x = 0;
  const canvas = document.createElement("canvas");
  const ctx = canvas.getContext("2d");
  ctx.fillStyle = color;
  const anim = () => {
    x = (x + 1) % canvas.width;
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    ctx.fillRect(x, 50, 50, 50);
    requestAnimationFrame(anim);
  };
  anim();
  return canvas.captureStream();
}

<video autoplay controls muted></video>
<button>change track</button>

​

但是，请注意，如果您确实记录了这个MediaStream唱歌一个MediaRecorder，MediaRecorder将停止时，轨道被改变。