Question

我知道如何检索例如。来自摄像头来源的视频流：

const constraints = { video: true };

navigator.mediaDevices

    .getUserMedia(constraints)

    .then(mediaStream => {

        // ** But how to get the a stream of bytes from here??? **

    });

我找不到有关如何从mediaStream对象中检索字节流的任何适当文档。

如何执行此操作？因为，可以说我想将字节流传输到服务器。

Answer 1

MediaStream录制API

通过进一步研究MDN和与音频和视频相关的HTML 5 API，我发现了MediaStream Recording API。

因此，要获取字节流（或在有可用块时立即获取块），我们可以这样做：

const constraints = { video: true };

navigator.mediaDevices

    .getUserMedia(constraints)

    .then(mediaStream => {

        // use MediaStream Recording API
        const recorder = new MediaRecorder(stream);

        // fires every one second and passes an BlobEvent
        recorder.ondataavailable = event => {

            // get the Blob from the event
            const blob = event.data;

            // and send that blob to the server...
        };

        // make data available event fire every one second
        recorder.start(1000);
    });

浏览器支持：

MediaStream Recording API仍处于工作草案状态（2018年3月）。目前仅在Chrome和Firefox中本地支持。

填充： streamproc/MediaStreamRecorder

进一步阅读： Record to an audio file

从navigator.mediaDevices.getUserMedia（）获取字节流？

1 个答案: