js获取浏览器摄像头和麦克风权限

2022-07-25,,,,

文章目录

前言

一、我们想要实现的效果,浏览器弹出摄像头麦克风权限询问窗口?

二、实现方法

1.首先判断浏览器是否支持getUserMedia方法

2.实现浏览器询问用户,是否同意浏览器调用麦克风或摄像头


前言

项目中会使用到摄像头或麦克风设备,这就需要我们获取浏览器的摄像头和麦克风权限,权限是无法通过js操控的,必须由浏览器用户设置。


下面我来告诉大家如何获取浏览器的摄像头或麦克风的权限,使浏览器弹出询问窗口。

一、我们想要实现的效果,浏览器弹出摄像头或麦克风权限询问窗口?

如图,浏览器询问用户,允许或禁止浏览器使用您的摄像头或麦克风

二、实现方法

1.首先判断浏览器是否支持getUserMedia方法

代码如下(示例):

navigator.getUserMedia  = navigator.getUserMedia ||
                          navigator.webkitGetUserMedia ||
                          navigator.mozGetUserMedia ||
                          navigator.msGetUserMedia;
 
if (navigator.getUserMedia) {
    // 支持
} else {
    // 不支持
}

 

2.实现浏览器询问用户,是否同意浏览器调用麦克风或摄像头

在浏览器支持getUserMedia方法的前提下,我们可以直接调用getUserMedia,其中video询问摄像头权限,audio询问麦克风权限

代码如下(示例):

navigator.getUserMedia({video: true,audio:true}, function onSuccess(stream) {
    console.log('已点击允许,开启成功');
}, function onError(error) {
    console.log("错误:", error);
});

 

本文地址:https://blog.csdn.net/qq_37025418/article/details/112861649

《js获取浏览器摄像头和麦克风权限.doc》

下载本文的Word格式文档,以方便收藏与打印。