bounty将在3天后过期。回答此问题可获得+50声望奖励。A. Abramov希望引起更多人关注此问题。
我有一个MediaStreamTrack，它将来自用户相机的视频流传输到<video>标签上。
我想用一个静态图像来代替它。
我尝试更改enabled标志as specified in other questions（这会使图像变黑而不是冻结图像），调用stop()杀死它，或者使用ImageCapture.TakePhoto(...)生成图像，将其放入画布，并捕获画布源-这会失败，因为画布流与原始画布流不匹配，导致黑色图像。我试图用Object.defineProperty()覆盖其他属性，在调用removeTrack()后用另一个替换轨道，也没有工作。
问题：
您将如何“冻结”mediaStreamTrack，使其包含、发送和记录为静态图像？
- （编者注：
这部分来自对一个（现已删除）答案的评论。它澄清了提问者的预期结果）*
你能给我举个例子，说明你是如何在将输出视频的流更改为画布流之前，从那个（网络摄像头）视频中获取画布的源代码的吗？
下面是我使用的代码：
var vid = getVideoElementFromPage();
var Stream = vid.captureStream();
var Track = Stream.getVideoTracks()[0];
var URLIdea = undefined;
new ImageCapture(Track).takePhoto().then((imCpt) => {
URLIdea = URL.createObjectURL(imCpt);
// Here, I've tried setting this URL to a canvas, capturing stream and changing the track,
// or changing the video src to the URL directly.
// in both cases - black screen
});
1条答案
按热度按时间92dk7w1h1#
要冻结视频MediaStreamTrack，您可以使用ImageCapture API从视频中捕获单个帧，然后从该帧创建新的MediaStreamTrack。以下是如何实现此目的的示例：
//获取video元素及其video track
1.获取视频元素及其视频轨道。
2.从视频轨道创建ImageCapture对象。
3.使用takePhoto（）从视频中捕获单个帧。
4.创建一个新的video元素，并将其src属性设置为所捕获照片的URL。
5.当新视频元素已经加载其元数据时，从新视频元素的视频轨道创建新MediaStreamTrack。
6.从流中删除原始视频轨道并将新轨道添加到流中。
这将用静态图像替换原始视频流。