梦想自己成为大牛 2021-09-04 20:32 采纳率: 0%
浏览 104
已结题

媒体流如何获取每帧摄像头数据

现在我的项目是使用electron-vue写的,有一个需求是需要把摄像头画面采集上来,并且需要将每帧画面传递到Python做图像识别,现在视频已经可以采集到了,但就是怎么获取每帧的数据,各位有遇到过或解决过这种问题的,请回复下,谢谢
下面是获取摄像头代码:

 /** @desc 获取计算机外设列表 储存摄像头数据 */
    getDevices() {
      return new Promise((resolve, reject) => {
        if (
          !navigator.mediaDevices ||
          !navigator.mediaDevices.enumerateDevices
        ) {
          window.alert('不支持 mediaDevices.enumerateDevices()');
        }
        navigator.mediaDevices
          .enumerateDevices()
          .then((devices) => {
            this.cameraList = [];
            devices.forEach((device, index) => {
              if (device.kind && device.kind === 'videoinput') {
                this.cameraList.push({
                  id: device.deviceId,
                  label: device.label,
                });
              }
            });
            resolve();
          })
          .catch((err) => {
            console.log(err.name + ': ' + err.message);
            reject();
          });
      });
    },

main() {
      this.cameraList.forEach((camera, index) => {
        let domId = `video${index}`;
        let video = document.getElementById(domId);
        this.enableCamera(camera.id, video,index);
        
      });
    },
    /** @desc 摄像头使能封装 */
    enableCamera(deviceId, video,index) {
      this.getUserMedia(
        this.setConstraints(deviceId),
        (stream) => {
          // var videoTracks = stream.getVideoTracks();
          // console.log('Using video device: ' + videoTracks[0].label);
          // stream.onended = function() {
          //   console.log('Stream ended');
          // };
          mediaStreamArray.push(stream)
          video.srcObject = stream;
          
          video.onloadedmetadata = (e) => {
            video.play();
          };
          // debugger
          // var stream_video = video.captureStream() || video.mozCaptureStream();
          // var videoTrack_media = stream_video .getVideoTracks()[0].clone();
          // console.log(videoTrack_media)
          if(index == 0){
            this.bufferDataOne = stream
          }else if(index == 1){
            this.bufferDataTwo = stream
          }else if(index == 2){
            this.bufferDataThree = stream
          }else if(index == 3){
            this.bufferDataFour = stream
          }
        },
        (error) => {
          console.log(`访问用户媒体设备失败${error.name}, ${error.message}`);
        }
      );
    },
  • 写回答

4条回答 默认 最新

报告相同问题?

问题事件

  • 已结题 (查看结题原因) 9月9日
  • 创建了问题 9月4日

悬赏问题

  • ¥15 C++显示超限兔子集结
  • ¥15 sql server 2012的下载出错
  • ¥15 图像识别用户软件开发
  • ¥20 类原生rom lineageos
  • ¥15 有没有会做中专,云计算,卷子的,有偿一百块
  • ¥15 HC32串口DMA循环发送数据
  • ¥15 Uni-App实现飞书授权登陆
  • ¥50 Qt应用中如何通过代码打开开发者工具devtools
  • ¥20 mpp硬解码h264转为yuv
  • ¥40 怎样批量对比两个数据库的表差异