navigator.mediaDevices.getUserMedia获取本地音频/麦克权限并提示用户

效果

获取权限

NotFoundError

NotAllowedError

代码

javascript 复制代码
// 调用	
captureLocalMedia()

// 方法
function captureLocalMedia() {
  console.warn('Requesting local video & audio');
  navigator.mediaDevices
  .getUserMedia(constraints)
  .then(function (stream) {
    console.warn(stream)
    console.warn('Received local media stream');
    // connect local audio
    // console.warn(stream)
    // localStream = stream;
    // try {
    //   audio.srcObject = null // stream;
    // } catch (error) {
    //   console.warn(error)
    //   audio.src = window.URL.createObjectURL(stream);
    // }
  })
  .catch(function (err) {
    if (err.name === 'NotFoundError') {
     alert('浏览器无法获取音频设备,请检查电脑的麦克风是否可用')
     } else if (err.name === 'NotAllowedError') {
       alert('浏览器未检测到音频设备,请在浏览器设置中打开访问权限,打开后才可正常通话')
     } else {
       alert('未知,请检查设备是否正常')
     }
    console.log(err)
    console.log(err.name + ": " + err.message);
  });
}    
相关推荐
stringwu几秒前
Claude Skill 开发实战指南:客户端开发工程师版
前端
sudo_jin几秒前
Webpack 是如何工作的?
前端
跟着珅聪学java2 分钟前
Element UI 的 el-input组件触发 blur事件
javascript·vue.js·elementui
cxm@2 分钟前
vue中使用keepalive实现列表缓存
前端·javascript·vue.js·笔记
Komorebi゛5 分钟前
【Vue + Element Plus】el-tree树结构样式改造,添加转折线
前端·javascript·vue.js·elementui
feng68_7 分钟前
Web应用服务器Tomcat
运维·前端·tomcat
方安乐7 分钟前
react之shadcn(二)
前端·react.js·前端框架
一拳不是超人8 分钟前
Electron 实战全解析:基于 WebContentView 的多视图管理系统
前端·javascript·electron
阿珊和她的猫9 分钟前
网站页面卡顿的常见问题与解决方案深度剖析
前端·javascript·vue.js
globaldomain11 分钟前
立海世纪:WordPress 6.9的新功能、新模块、新API
前端·javascript·html·新媒体运营·网站建设·wordpress·域名注册