export default class RecordVideo {
|
/**
|
* 构造函数
|
*
|
* @param {Object} videoObj 视频对象
|
*/
|
constructor(videoObj) {
|
this.video = videoObj
|
this.mediaRecorder = null
|
this.chunks = []
|
}
|
|
/**
|
* 初始化
|
*
|
* @return {Object} promise
|
*/
|
init() {
|
// 返回Promise对象
|
// resolve 正常处理
|
// reject 处理异常情况
|
return new Promise((resovle, reject) => {
|
navigator.mediaDevices
|
.getUserMedia({
|
audio: true,
|
video: true,
|
// video: {
|
// width: this.videoWidth,
|
// height: this.videoHeight
|
// }
|
})
|
// 返回一个媒体内容的流
|
.then(stream => {
|
// 检测是否支持 srcObject，该属性在新的浏览器支持
|
if ('srcObject' in this.video) {
|
this.video.srcObject = stream
|
} else {
|
// 兼容旧的浏览器
|
this.video.src = window.URL.createObjectURL(stream)
|
}
|
|
// 当视频的元数据已经加载时触发
|
this.video.addEventListener('loadmetadata', () => {
|
this.video.play()
|
})
|
this.mediaRecorder = new MediaRecorder(stream)
|
this.mediaRecorder.addEventListener('dataavailable', e => {
|
this.chunks.push(e.data)
|
})
|
resovle()
|
})
|
// 异常抓取，包括用于禁用麦克风、摄像头
|
.catch(error => {
|
reject(error)
|
})
|
})
|
}
|
|
/**
|
* 视频开始录制
|
*/
|
startRecord() {
|
if (this.mediaRecorder.state === 'inactive') {
|
this.mediaRecorder.start()
|
}
|
}
|
|
/**
|
* 视频结束录制
|
*/
|
stopRecord() {
|
if (this.mediaRecorder.state === 'recording') {
|
this.mediaRecorder.stop()
|
}
|
}
|
|
/**
|
* 检测当前浏览器对否支持
|
*
|
* @return {boolean} 当前浏览器是否支持
|
*/
|
isSupport() {
|
const flag = navigator.mediaDevices && navigator.mediaDevices.getUserMedia
|
if (flag) {
|
return true
|
}
|
}
|
}
|
