reactjs 使用JavaScript的屏幕录制部分

i34xakig  于 2022-11-29  发布在  React
关注(0)|答案(1)|浏览(150)

我尝试用JavaScript实现一个屏幕记录器,它记录一个视频源,而不是整个屏幕。我的问题是这是否可以使用getDisplayMedia实现,或者是否有一个库可以实现这一点。这是我当前的实现,它将询问并记录整个屏幕。

const handleRecord = async () => {
    // console.log('record')
    let stream = await navigator.mediaDevices.getDisplayMedia({
      video: true
    })
    // Needed for better browser support 
    const mime = MediaRecorder.isTypeSupported("video/webm; codecs=vp9")
      ? "video/webm; codecs=vp9"
      : "video/webm"

    let mediaRecorder = new MediaRecorder(stream, { mimeType: mime })

    let chunks = []
    mediaRecorder.addEventListener('dataavailable', ({ data }) => chunks.push(data))

    mediaRecorder.addEventListener('stop', function () {
      let blob = new Blob(chunks, {type: chunks[0].type})
      let url = URL.createObjectURL(blob)
      let video = document.querySelector("#cameraFeed")
      video.src = url

      let a = document.createElement('a')
      a.href = url
      a.download = 'video.webm'
      a.click()
    })

    //we have to start the recorder manually
    mediaRecorder.start()
  }
avwztpqn

avwztpqn1#

据我所知你的问题你是否要记录用户凸轮如果是这里你

let stream = await navigator.mediaDevices.getUserMedia({
  video: { facingMode: "user" },
})

如果你觉得有什么困难,尽管问!

相关问题