主要是基于MediaStreamRecorder来实现
https://github.com/streamproc/MediaStreamRecorder
var MediaStreamRecorder = require('msr');
const chunks = new Set()
let mediaRecord
function createRecord () {
const mediaStream = viewer.canvas.captureStream(10) // 设置帧频率(FPS)
mediaRecord = new MediaRecorder(mediaStream, {
videoBitsPerSecond: 8500000
})
mediaRecord.ondataavailable = (e) => { // 接收数据
chunks.add(e.data)
}
mediaRecord.start() // 开始录制
}
createRecord()
setTimeout( ()=>{
mediaRecord.stop()
mediaRecord.onstop=()=>{
const videoBlob = new Blob(chunks, { 'type' : 'video/mp4' })
let videoUrl = window.URL.createObjectURL(videoBlob)
download(videoUrl)
}
},10000)
function download (videoUrl) {
var a = document.createElement('a')
a.href = videoUrl
a.download = 'record-canvas.mp4'
a.style.display = 'none'
document.body.appendChild(a)
a.click()
}