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);
  });
}    
相关推荐
小林ixn21 分钟前
从 onclick 到 React 合成事件,再到完整应用逻辑:一次前端架构的深度剖析
前端·react.js·前端框架
Csvn1 小时前
🧩「找不到模块」排查全记录——Monorepo 下 TypeScript 路径别名的 5 种「不通」与根治方案
前端
腻害兔1 小时前
【若依项目-产品经理视角】RuoYi-Vue-Pro 源码拆解:字典、短信、邮件、通知——后台系统的“基础设施四件套“!
java·前端·vue.js·产品经理·ai编程
CodexDave1 小时前
MySQL事务隔离级别与MVCC机制解析
前端·数据库·mysql·nginx·性能优化·负载均衡
Ai_easygo2 小时前
AI Agent开发入门——从ReAct到Tool Calling,拆解Agent的底层运行逻辑
前端·人工智能·react.js
研☆香2 小时前
分析制作html页面,如何划分页面结构
前端
腻害兔3 小时前
【若依项目-产品经理视角】RuoYi-Vue-Pro 源码拆解:支付模块 yudao-module-pay,一个让产品经理都看懂的支付中台设计
java·前端·vue.js·产品经理·ai编程
kyriewen3 小时前
我扒了最近的前端面经——2026年面试不背八股文了,考这5样
前端·面试·ai编程
IT_陈寒3 小时前
Redis的持久化配置把我坑惨了:你以为数据安全了?
前端·人工智能·后端
小徐_23333 小时前
uni-app 项目别再从零搭了!3 个 Wot UI 起手模板怎么选?
前端·uni-app