javascript - Windows 8 (JavaScript) : Multiple tags with same webcam source: Possible?

Question

我正在使用 JavaScript 开发一个地铁应用程序，并试图同时显示来自网络摄像头的两个视频(其中一个视频最终会应用过滤器)。但是，每当我尝试将它们都设置为使用网络摄像头作为源时，我会收到错误消息，有没有解决这种情况的好方法？

谢谢!

编辑:这是一些代码:

(JavaScript)

var mediaCaptureMgr = new Windows.Media.Capture.MediaCapture();
var captureInitSettings = new Windows.Media.Capture.MediaCaptureInitializationSettings();
//...set properties of captureInitSettings...


mediaCaptureMgr.initializeAsync(captureInitSettings).then(function (result) {
            var video1 = id("Video1"); //function to get html element with id
            video1.src = URL.createObjectURL(mediaCaptureMgr, false); //does not matter if false is switched to true
            var video2 = id("Video2");
            video2.src = video1.src;//could also use var x = URL.create... then set video1.src/video2.src = x; still won't work.
        },
    errorHandler);

(HTML)

<video id="Video1" autoplay></video>
<video id="Video2" autoplay></video>

我可以通过 Click 事件或 Load 事件触发 JS——没关系——只有 Video1 获取网络摄像头视频。视频 2 不起作用。想法？

谢谢!

Answer 1

最近在 Chrome 中以类似的方式玩了一下 getUserMedia，我想知道 Metro 中的 Canvas 是否可以用于您的第二个视频播放，因为您正计划进行过滤，看来您可能有无论如何都要走这条路？

也就是说，我对 Metro javascript 环境一无所知，但查看您的示例并知道我将如何在受支持的浏览器中执行此操作:

var video1 = id("Video1");
var canvas = id('canvas');

var context = canvas.getContext('2d');

context.drawImage(video1, 0, 0);

当然，这只有在您为每一帧视频绘制该图像时才有效，如果有 window.requestAnimationFrame 的一些模拟，这将是一件轻而易举的事。