如何录制网络摄像头视频，并在多个页面上保持录制状态

Question

目前，我正试图找到一种方法来录制网络摄像头的视频，使用。WebRTC 和 getUserMedia. 我设法捕获一个给定时间的视频，但我想做的是在应用程序的第一页开始录制，并继续录制，直到用户在几页后按下某个按钮。这里发生的情况是，当用户进入另一个页面时，即使时间没有到，也会停止录制。

我对前端开发和使用Node.js是个新手。有没有办法让我通过应用程序全局使用摄像头？

这是我用HTML进行简单录制的代码。

navigator.mediaDevices.getUserMedia({
    video: true,
    audio: true
  }).then(async function(stream) {
    let recorder = RecordRTC(stream, {
        type: 'video'
    });
    recorder.startRecording();

    const sleep = m => new Promise(r => setTimeout(r, m));
    await sleep(10000);

    recorder.stopRecording(function() {
        let blob = recorder.getBlob();
        invokeSaveAsDialog(blob);
        var url = URL.createObjectURL(blob);
        document.querySelector("video").src = url;
    });
  });

Answer 1

并非如此，因为录制是由加载到浏览器中的网页中的代码开始的。如果该页面不再加载（因为用户将窗口导航到了另一个页面），那么很明显该代码必须停止运行。所以你每次都要开始一个新的记录会话。

如果你有一个单页应用，整个页面从未被刷新，内容变化是通过AJAX加载的，那么你可以实现它，但如果你的网站有不同的页面，那么很难看到你如何成功实现你的要求。