WebRTC中获取当前采集设备的deviceId

在做webRTC项目离不开切换摄像头,但是怎么拿到当前采集的设备id就成了问题,查阅资料后发现官方其实有提供相关方法,简单记录下;

通用玩法获取采集设备id
javascript 复制代码
// 请求访问用户媒体设备
navigator.mediaDevices.getUserMedia({ video: true, audio: true })
  .then((stream) => {
    // 获取视频轨道
    let videoTrack = stream.getVideoTracks()[0];
    if (videoTrack) {
      console.log('视频设备ID:', videoTrack.getSettings().deviceId);

      // 获取音频轨道
      let audioTrack = stream.getAudioTracks()[0];
      if (audioTrack) {
        console.log('麦克风设备ID:', audioTrack.getSettings().deviceId);
      }
    } else {
      console.log('未找到可用的视频设备');
    }
  })
  .catch((error) => {
    console.error('获取媒体流失败', error);
  });
相关推荐
mCell6 小时前
Lua 编程入门:从基础语法到元表
javascript·算法·lua
伟大的兔神7 小时前
我做了一个本地优先的 AI 图片工作台:Loomora v1.0.0 正式发布
前端·javascript·vue.js
fangzhanpeng1689 小时前
(前端)2.js变量作用域样例
开发语言·前端·javascript
码艺-Alimjan11 小时前
Vue项目源码备份最佳实践:无视node_modules,打包体积仅2MB
前端·javascript·vue.js
xixiaoyunya13 小时前
JavaScript 异步编程全解析:从回调地狱到 async/await 的演进之路
开发语言·javascript·ecmascript
张元清13 小时前
React useScrollLock Hook:为弹窗锁住页面滚动 (2026)
javascript·react.js
Sayai13 小时前
【无标题】ECharts 实现日志量异常检测:基线 ±Kσ 基带 + 灵敏度切换(Vue2 实战)
前端·javascript·echarts
默_笙14 小时前
💌 为了把"主题色"传给孙子组件,我翻了五层楼——直到遇见了 useContext
前端·javascript
小KK_14 小时前
JS 事件循环从小白视角入门:宏任务、微任务与 async/await 一网打尽
前端·javascript
kisshyshy16 小时前
从 useRef 到 Web Worker:理解 React 可变对象与浏览器多线程
前端·javascript·react.js