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);
  });
相关推荐
m0_740043732 分钟前
父组件 子组件
javascript·vue.js·ecmascript
爱吃无爪鱼2 分钟前
05-JavaScript/TypeScript 项目结构完全解析
javascript·react.js·typescript·前端框架·npm·html·sass
渴望成为python大神的前端小菜鸟8 分钟前
JS宏任务 & 微任务 API 速查表
javascript
前端小王呀11 分钟前
自定义图表相关配置
android·前端·javascript
chilavert31816 分钟前
技术演进中的开发沉思-226 Ajax:前端兼容
javascript·架构
西西学代码16 分钟前
flutter---进度条
前端·javascript·flutter
时间的情敌32 分钟前
Vue3 和 Vue2 的核心区别
前端·javascript·vue.js
Aevget37 分钟前
DevExtreme JS & ASP.NET Core v25.2新功能预览 - 提升AI扩展功能
javascript·人工智能·ui·asp.net·界面控件·devextreme
春卷同学38 分钟前
电子蛇对战 - Electron for 鸿蒙PC项目实战案例
javascript·electron·harmonyos
1024小神43 分钟前
android studio最新版在toolbar工具栏显示back和forward按钮
javascript·html·android studio