获取摄像头

https://developer.mozilla.org/zh-CN/docs/Web/API/MediaDevices/getUserMedia

navigator.mediaDevices.getUserMedia(constraints)
.then(function(stream) {
  /* 使用这个 stream stream */
})
.catch(function(err) {
  /* 处理 error */
});

constraints部分参数说明

// 在移动设备上面优先使用前置摄像头
constraints = { audio: true, video: { facingMode: "user" } }

// 强制使用后置摄像头
constraints = { audio: true, video: { facingMode: { exact: "environment" } } }

constraints = {
    video: true,
    audio: {
        // 设置回音消除
        noiseSuppression: true,
        // 设置降噪
        echoCancellation: true,
    }
}

通过MediaRecorder将流媒体对象转换成mp4格式

function recoder (stream) {
    var options = {
      audioBitsPerSecond : 128000,
      videoBitsPerSecond : 2500000,
      mimeType : 'video/mp4'
    }
    var mediaRecorder = new MediaRecorder(stream,options);
    m = mediaRecorder;
}

MediaRecorder 对象

https://blog.csdn.net/weixin_41960204/article/details/110857225

MediaRecorder 是 MediaStream Recording API 提供的用来进行媒体轻松录制的接口，他需要通过调用 MediaRecorder() 构造方法进行实例化。

构造函数
MediaRecorder() 构造函数会创建一个指定的 MediaStream 进行录制， 支持的配置项包括设置容器的 MIME 类型(例如“video/webm” 或者"video/mp4") 和音频及视频的码率或者同用一个码率

配置项
MediaRecorder.mimeType 只读
返回 MediaRecorder 对象创建时选择器选择的录制容器的 MIME type

MediaRecorder.state 只读
返回录制对象 MediaRecorder 的当前状态(闲置中，录制中或则暂停)(inactive recording or paused )

MediaRecorder.stream 只读
返回录制器对象 MediaRecorder 创建时构造函数传入的 stream 对象

MediaRecorder.ignoreMutedMedia
用以指定 MediaRecorder 是否录制无声的输入源，如果这个属性是 false ,录制器对象 MediaRecorder 会录制无声的音频或者黑屏的视频，默认值是 false

MediaRecorder.videoBitsPerSecond 只读
返回视频采用的编码比率，它可能和构造函数的设置比率不同。(if it was privided)

MediaRecorder.audioBitsPerSecond 只读
返回音频采用的编码比率，它可能和构造函数中设置的比率不同。(if it was privaded)

方法
MediaRecorder.isTypeSupported()
返回一个 Boolean 值，来表示设置的 MIME type 是否被当前用户的设备支持

MediaRecorder.pause()
暂停媒体录制

MediaRecorder.requestData()
请求一个从开始到当前接收到的，存储为 Blob 类型的录制内容。(或者是返回上一次调用 requestData() 方法之后到现在的内容)。调用这个方法后，录制将会继续进行，但是会创建一个新的 Blob 对象

MediaRecorder,resume()
继续录制之前被暂停的录制动作

MediaRecorder.start()
开始录制媒体，这个方法调用时可以通过给 timeslice 参数设置一个毫秒值，如果设置这个毫秒值，那么录制的媒体会按照你设置的值进行分割成一个个单独的区块，而不是以默认的方式录制一个非常大的整块内容

MediaRecorder.stop()
停止录制，同时触发 dataavailable 事件，返回一个存储 Blob 内容的录制数据，之后不再记录

静态方法
静态方法，判断给定的 MIME 类型是否支持。返回 Boolean 类型的值

事件处理
MediaRecorder.ondataavailable
调用它用来处理 dataavailable 事件，该事件可用于获取录制的媒体资源( 在事件的 data 属性中会提供一个可用的 Blob 对象)

MediaRecorder.onerror
调用事件处理程序来处理记录错误事件，包括报告媒体记录所引起的错误。这些是致命错误，将停止记录

MediaRecorder.onpause
用来处理 pause 事件，该事件在媒体暂停录制时触发(MediaRecorder.pause())

MediaRecorder.onresume
用来处理 resume 事件，该事件在暂停后恢复录制视频时触发(MediaRecorder.resume())

MediaRecorder.onstart
用来处理 start 事件，该事件在媒体开始录制时触发( MediaRecorder.start)

MediaRecorder.onstop
用来处理 stop 事件，该事件会在媒体录制结束时、媒体流(MediaStream)结束时、或者调用 MediaRecorder.stop() 方法后触发

事件
使用 addEventListener() 或通过将事件侦听器分配给此接口的属性来侦听这些事件。

error
发生错误时触发: 例如，因为不允许录制或尝试使用不支持的编解码器进行录制。也可通过 onerror 获得

最后修改：2023 年 04 月 27 日
© 允许规范转载
如果觉得我的文章对你有用，请随意赞赏