通过input=file方式兼容比较好一些。
html部分代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>h5手机录像</title>
</head>
<body>
<div class="next_submit">
<span>开始录制视频</span>
<input type="file" accept="video/*" id="uploadVideo" capture="camcorder"
/>
</div>
</body>
</html>
js代码块
let videoBtn=document.getElementById("uploadVideo");
var videoBase=""
function uploadVideo(e) {
let files = e.target.files;
if (files && files.length > 0) {
let file = files[0];
//对录制的视频限制大小
if (file.size > 8388608) {
alter("录制视频时间过长");
return;
} else if (file.size < 211057) {
alter("录制视频时间太短");
return;
}
let reader = new FileReader();
//将视频文件转换为base64格式
reader.readAsDataURL(file);
reader.onload=function() {
if (reader.result) {
videoBase = reader.result;
//请求后端,传递数据
} else {
alter("视频录制异常");
}
});
} else {
alter("请重新录制视频");
}
}
//监听change事件
videoBtn.onchange=function(){
uploadVideo(e)
}
希望可以帮助到大家