手机浏览器支持getUserMedia

发布网友发布时间：2022-04-22 13:56

共1个回答

热心网友时间：2023-08-18 05:47

原版安卓chrome 和 Firefox 移动版可以支持（目前测试已知，苹果不支持），Firefox还能选择前后摄像头。其他国产uc qq浏览器 360什么的在我给答案的时候的最新版中都不太支持getUserMedia()这个接口。代码如下：
<script>
$(document).ready(function () {
// Grab elements, create settings, etc.
var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');
var video = document.getElementById('video');

// Get access to the camera!
/*if(navigator.mediaDevices.getUserMedia) {
alert("navigator.mediaDevices.getUserMedia");
}
if (navigator.mediaDevices.webkitGetUserMedia) {
alert("navigator.mediaDevices.webkitGetUserMedia");
}
if (navigator.getUserMedia) {
alert("navigator.getUserMedia");
}
if (navigator.webkitGetUserMedia) {
alert("navigator.webkitGetUserMedia");
}
if (navigator.mozGetUserMedia) {
alert("navigator.mozGetUserMedia");
}
if (navigator.msGetUserMedia) {
alert("navigator.msGetUserMedia");
}*/
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia;
window.URL = window.URL || window.webkitURL || window.mozURL || window.msURL;
navigator.getUserMedia({video: {width: {min: 1080, ideal: 1080, max: 1920}, height: {min: 1080, ideal: 1080, max: 1080}}}, function (stream) {
video.src = window.URL.createObjectURL(stream);
video.play();
}, errBack);

// Trigger photo take
document.getElementById("attenceStop").addEventListener("click", function () {
$("#canvas").addClass("bdr");
/*alert("width" + video.videoWidth);
alert("height" + video.videoHeight);*/
$("#canvas").attr("width", video.videoWidth);
$("#canvas").attr("height", video.videoHeight);
context.drawImage(video, 0, 0, video.videoWidth, video.videoHeight);
video.pause();
}
)};

function errBack(error) {
alert("error!");
if (error.PERMISSION_DENIED) {
alert('用户拒绝了浏览器请求媒体的权限');
} else if (error.NOT_SUPPORTED_ERROR) {
alert('对不起，您的浏览器不支持拍照功能，请使用其他浏览器');
} else if (error.MANDATORY_UNSATISFIED_ERROR) {
alert('指定的媒体类型未接收到媒体流');
} else {
alert('系统未能获取到摄像头，请确保摄像头已正确安装。或尝试刷新页面，重试');
}
}
});
</script>